JavaScript:实现一个JSON.parse

🔗https://juejin.im/post/5c9c3989e51d454e3a3902b6

JSON.parse(text[, reviver])

用来解析 JSON 字符串,构造由字符串描述的 JavaScript 值或对象。提供可选的 reviver 函数用以在返回之前对所得到的对象执行变换(操作)。

第一种:直接调用 eval

function jsonParse(opt) {
    return eval('(' + opt + ')');
}
jsonParse(jsonStringify({x : 5})) // Object { x: 5}
jsonParse(jsonStringify([1, "false", false])) // [1, "false", falsr]
jsonParse(jsonStringify({b: undefined})) // Object { b: "undefined"}

⚠️ 避免在不必要的情况下使用 evaleval() 是一个危险的函数, 它执行的代码拥有着执行者的权利。如果你用 eval() 运行的字符串代码被恶意方(不怀好意的人)操控修改,他可能会在你写的的网页/扩展程序的权限下,在用户计算机上运行恶意代码。

它会执行 JS 代码,有 XSS 漏洞。

如果想用这个方法,就得对参数 json 做校验:

var rx_one = /^[\],:{}\s]*$/;
var rx_two = /\\(?:["\\\/bfnrt]|u[0-9a-fA-F]{4})/g;
var rx_three = /"[^"\\\n\r]*"|true|false|null|-?\d+(?:\.\d*)?(?:[eE][+\-]?\d+)?/g;
var rx_four = /(?:^|:|,)(?:\s*\[)+/g;
if (
    rx_one.test(
        json
            .replace(rx_two, "@")
            .replace(rx_three, "]")
            .replace(rx_four, "")
    )
) {
    var obj = eval("(" +json + ")");
}

🔧 正则可视化工具:https://regexper.com/

第二种:Function

核心Functioneval 有相同的字符串参数特性。

var func = new Function(arg1, arg2, ..., functionBody);

在转换 JSON 的实际应用中,只需要:

var jsonStr = '{ "age": 20, "name": "jack" }'
var json = (new Function('return ' + jsonStr))();

eval 与 Function 都有着动态编译 js 代码的作用,但是在实际的编程中并不推荐使用。


至于第三,第四种,涉及到繁琐的递归和状态机相关原理,具体可以看:👇

《JSON.parse 三种实现方式》

发布了128 篇原创文章 · 获赞 50 · 访问量 14万+
展开阅读全文

没有更多推荐了,返回首页

©️2019 CSDN 皮肤主题: 大白 设计师: CSDN官方博客

分享到微信朋友圈

×

扫一扫,手机浏览