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

JavaScript025

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>

1、字符串转化为对象

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

2、把文本转化为数组