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

JavaScript035

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>

使用js的 eval()方法var code1='"a" + 2' //表达式

varcode2='{a:2}' //语句

alert(eval(code1)) //->'a2'

alert(eval(code2)) //->undefined

alert(eval('(' + code2 + ')')) //->[object Object]

可以这样转换(兼容性较好的做法):

var msg = '{A:[{name:"阿克苏",spell:"akesu"}]}' // 字符串类型的 JSON 数据

var json = null

try {

    json = (new Function('return ' + msg))()

} catch(e) {

    // 如果 JSON 数据格式有错误,进行错误处理

    console.log('数据错误')

}

---------

利用现代浏览器的特性的另一种做法是:

var msg = '{A:[{name:"阿克苏",spell:"akesu"}]}' // 字符串类型的 JSON 数据

var json = JSON.parse(msg) // 直接利用 JSON 对象进行解析

缺点就是某些浏览器不一定支持

---------

反过来,如果要将对象转换成字符串,可以这样做,见下面代码(适用于现代浏览器,几十年前的IE6什么的运行不起来):

var jsons ={A:[{name:"阿克苏",spell:"akesu"}]} // JS 对象

var str = JSON.stringify(jsons) // 转化对象为字符串

console.log(str) // 测试 - 输出字符串