JS基础(十) 将字符串转为对象

JavaScript02

JS基础(十) 将字符串转为对象,第1张

<script>

        /*

            let phone = {

                name: '小米10',

                color: '红色',

                size: '1000*200*500',

                price: '2999'

            }

        */

        let str1 = 'name=小米10&color=红色&size=1000*200*500&price=2999'

        // let arr = str1.split('&')

        // console.log(arr) // (4) ["name=小米10", "color=红色", "size=1000*200*500", "price=2999"]

        // 定义一个反译方法,头大,真离谱

        function rever(str) {

            // 定义一个空对象

            let obj = {}

            str.split('&').forEach(item =>{

            let kv = item.split('=')

            obj[kv[0]] = kv[1]

            })

            return obj

        }

        let obj1 = rever(str1)

        console.log(obj1)

        let str = 'name=小米10&color=红色&size=1000*200*500&price=2999'

        // 思路:得先将字符串转为数组

        // 数组中的元素应该是什么样的

        // 结果中需清除“&”和“=”字符,那就得调用split()方法来分隔

        // 第一步:先将该型字符串调用split()方法以"&"字符分隔,返回一个数组

        // console.log(str.split('&'))

        // (4) ["name=小米10", "color=红色", "size=1000*200*500", "price=2999"]

        // 第二步:将得到的数组里的每一个元素再次调用split()方法以“=”分隔

        // 这样就将“&”和“=”字符清除了

        // 从而得到了第一位为属性名(下标为0),第二位为属性值的几个数组(下标为1)

        // 那么如何才能将属性名与属性值一一对应?

        /* str.split('&').forEach(item =>{

            console.log(item.split('='))

        }) */

        // 返回了四个数组

        // (2) ["name", "小米10"]

        // (2) ["color", "红色"]

        // (2) ["size", "1000*200*500"]

        // (2) ["price", "2999"]

        // 第三步:遍历过程中将数组赋值给新数组对象kv(封装起来)

        // 思考:如何才能将属性名与属性值一一对应?

        // 即如何实现将属性值赋值给属性名(下标为1的元素的值赋值给下标为0的元素)

        // 因为最后得返回一个包含四个属性的对象出去

        // 那就需要创建一个对象去接收(封装)这些值

        // 定义一个空对象

        let obj = {}  

        str.split('&').forEach(item =>{

            // 遍历过程中将数组赋值给新对象kv

            let kv = item.split('=')

            // kv中有两个元素,第一位为属性名,第二位为属性值

            obj[kv[0]] = kv[1]

        })

        console.log(obj)

        // {name: "小米10", color: "红色", size: "1000*200*500", price: "2999"}

    </script>

JavaScript将对象转化成字符串,一般是使用JSON.stringify()。

1、JSON.stringify() 方法是将一个JavaScript值(对象或者数组)转换为一个 JSON字符串,如果指定了replacer是一个函数,则可以替换值,或者如果指定了replacer是一个数组,可选的仅包括指定的属性。

2、运行实例图:

扩展资料:

语法:JSON.stringify(value[, replacer [, space]])

参数:

1、value,是将要序列化成 一个JSON 字符串的值。

2、replacer (可选),如果该参数是一个函数,则在序列化过程中,被序列化的值的每个属性都会经过该函数的转换和处理;如果该参数是一个数组,则只有包含在这个数组中的属性名才会被序列化到最终的 JSON 字符串中;如果该参数为null或者未提供,则对象所有的属性都会被序列化;

3、space (可选),指定缩进用的空白字符串,用于美化输出(pretty-print);如果参数是个数字,它代表有多少的空格;上限为10。该值若小于1,则意味着没有空格;如果该参数为字符串(字符串的前十个字母),该字符串将被作为空格;如果该参数没有提供(或者为null)将没有空格。

返回值 :一个表示给定值的JSON字符串。

参考资料来源:MDN web docs—JSON.stringify()

1、字符串转化为对象

很显然这就是一个对象的格式,但如何把文本转为对象呢?—>使用eval(), ⚠️(注意一定要加括号,否则会转换失败 )

2、把文本转化为数组