摘要:严格模式下有自己的作用于,直接接受是获取不到值的,需要挂载再全局下面方式二标签直接插入标签,同时把字符串拼接一个接受的变量进去。方式三标签字符串通过可以转二进制,再通过转。
经常我们会遇到后端返回的数据JSON的格式不正常,会出现key没有引号的情况,如:
var str = "{a: 1, b: 2}";
当然,这种情况可以让后端修改返回数据格式,但是往往再面试或则其他时候有可能会问道:如何去解析这种类型的字符串?
毕竟分类是在奇技淫巧中,那常规的eval和new Function这里就不多说。
方式一:[native code].constructor使用JS内置对象的任意原型方法,如:Object.prototype.toString,Array.prototype.push,RegExp.prototype.test等等,其实这里的实质原理还是new Function。
Object.prototype.toString.constructor === Function // true Array.prototype.push.constructor === Function // true RegExp.prototype.test.constructor === Function // true
var json = "{a: 1, b: 2}"; json = "window.result = " + json; // 严格模式下eval有自己的作用于,直接var接受JSON是获取不到值的,需要挂载再window全局下面 Object.prototype.toString.constructor(json)(); // 1 console.log(result); // {a: 1, b: 2}方式二:script标签 + innerHTML
直接插入script标签,同时把字符串拼接一个接受的变量innerHTML进去。
var json = "{a: 1, b: 2}"; var script = document.createElement("script"); script.innerHTML = "var result = " + json; document.body.appendChild(script); console.log(result); // {a: 1, b: 2}方式三:script标签 + src
字符串通过blob可以转二进制,再通过window.URL.createObjectURL转url。
var json = "{a: 1, b: 2}"; var blob = new Blob(["var result = " + json]); var src = window.URL.createObjectURL(blob); var script = document.createElement("script"); script.src = src; document.body.appendChild(script); script.onload = function(){ console.log(result); // {a: 1, b: 2} }
PS:由于是src加载的,需要再onload才能获取到数据,同时有blob转的url,需要在有服务器的条件下才能测试,直接打开一个本地html文件无法测试,需要测试的可以直接打开一个百度什么的网站,F12在控制台测试。
方式四:Worker同上一条一样创建url,然后通过Worker运行,但是这里接受数据就只能通过postMessage和onmessage:
var json = "{a: 1, b: 2}"; var blob = new Blob(["postMessage(" + json + ")"]); var src = window.URL.createObjectURL(blob); var worker = new Worker(src); worker.onmessage = function(e){ console.log(e.data); // {a: 1, b: 2} }
PS:同上,需要再服务器的条件下测试。
方式五:location.href经常我们再写点击事件的时候会这样写:
同时随便打开一个页面,再地址栏输入:javascript:alert(1),可以看到,代码执行了,并且页面并没有跳转变化,SO,我们可以利用这一点。
PS:复制到地址栏默认会去掉javascript:,需要手动补上。
var json = "{a: 1, b: 2}"; location.href = "javascript:var result = " + json; setTimeout(function(){ console.log(result); // {a: 1, b: 2} }, 0);
文章版权归作者所有,未经允许请勿转载,若此文章存在违规行为,您可以联系管理员删除。
转载请注明本文地址:https://www.ucloud.cn/yun/91754.html
摘要:由很多令人兴奋的功能,如对象的解析与剩余,异步迭代器,方法和更好的正则表达式支持。迭代可以是任何遵循迭代器协议的对象。迭代器方法应该返回一个具有方法的对象。 原文:TC39, ECMAScript, and the Future of JavaScript作者:Nicolás Bevacqua 译者序 很荣幸能够和 Nicolás Bevacqua 同台分享。Nicolás Beva...
摘要:使用了一个事件驱动非阻塞式的模型,使其轻量又高效。依赖就近,延迟执行。使用错误处理中间件默认情况下,给出的响应是状态码,包含文本以及错误自身详细信息的响应主体。 Node.js是什么 官网定义: Node.js 是一个基于 Chrome V8 引擎的 JavaScript 运行环境。 Node.js 使用了一个事件驱动、非阻塞式I/O 的模型,使其轻量又高效。 非阻塞 I/O 模型(...
摘要:同源策略指的是当前页面和目标协议域名和端口均相同。发出请求的页面所在域。响应的头部信息在后端处理,不在此处讲解。该事件会在数据接收期间不断触发,但间隔不确定。服务器确认允许之后,才发起实际的请求。 ajax作为前端开发必需的基础能力之一,你可能会使用它,但并不一定懂得其原理,以及更深入的服务器通信相关的知识。在最近两天的整理过程中,看了大量的文章,发现自己的后端能力已经限制自己在网络通...
格式化输出: let obj = { a: a1, b: b1 }; JSON.stringify(obj, null, 2); //{ a: a1, b: b1 } 巧用深拷贝: let obj = { a: a1, b: b1 }; let copy = JSON.stringify(obj); let copyObj = JSON.parse(cop...
阅读 944·2023-04-25 15:42
阅读 3563·2021-11-02 14:38
阅读 2872·2021-09-30 09:48
阅读 1391·2021-09-23 11:22
阅读 3361·2021-09-06 15:02
阅读 3173·2021-09-04 16:41
阅读 590·2021-09-02 15:41
阅读 1992·2021-08-26 14:13