JavaScript中使用console调试程序的坑
2016-05-26 12:06
459 查看
上DEMO
通过浏览器打开DEMO,看浏览器的终端,发现
第一次console竟然和第二次的console的值一样,都是已修改后的值,22。。。
研究了很久后,发现问题出在浏览器的终端。
由于a的key2是一个对象,所以在浏览器输出到终端的时候,没有把key2的value输出出来,而且给了一个指针N1。这个指针是指向key2的对象
随后JS代码修改了key2的对象的值,根据JS的内存管理规则,key4的指针指向一块新的内存(存储‘22’字符串的内存),但是key2的对象的指针N1不会变化。
然后JS程序跑完了,我们去终端查看key2这个对象,尽管我们点击的
根本原因是:浏览器输出了对象的指针,而不是对象本身。
这个坑会让我们误以为,第一次console的时候,key4的值是
解决方法就是 在console的时候,不要输出过于复杂的数据结构。例如上面的DEMO改为这样,把
终端:
未经许可请不要转载。
a = {key1: [1, 2], 'key2': {'key4': '11'}, 'key3': [1, 2]} console.info(1,a) a.key2.key4 = '22' console.info(2,a)
通过浏览器打开DEMO,看浏览器的终端,发现
第一次console竟然和第二次的console的值一样,都是已修改后的值,22。。。
研究了很久后,发现问题出在浏览器的终端。
由于a的key2是一个对象,所以在浏览器输出到终端的时候,没有把key2的value输出出来,而且给了一个指针N1。这个指针是指向key2的对象
{'key4': '11'}的。
随后JS代码修改了key2的对象的值,根据JS的内存管理规则,key4的指针指向一块新的内存(存储‘22’字符串的内存),但是key2的对象的指针N1不会变化。
然后JS程序跑完了,我们去终端查看key2这个对象,尽管我们点击的
Object是第一次console的对象,但是指针依然是N1,浏览器的终端通过N1指针,找到内存中key2的对象,由于这时候key2对象已被修改,所以显示的是
‘22’。
根本原因是:浏览器输出了对象的指针,而不是对象本身。
这个坑会让我们误以为,第一次console的时候,key4的值是
‘22’,其实不是的。
解决方法就是 在console的时候,不要输出过于复杂的数据结构。例如上面的DEMO改为这样,把
a改为
a.key2,就不会踩到这个坑。
a = {key1: [1, 2], 'key2': {'key4': '11'}, 'key3': [1, 2]} console.info(1, a.key2) a.key2.key4 = '22' console.info(2, a.key2)
终端:
未经许可请不要转载。
相关文章推荐
- 算是帮华仔写的撸JSON文件,然后发到我的REST接口的PYTHON代码
- 基于Netty5.0高级案例二之WebSocket中关于使用ProtoBuf传输数据介绍js部分
- JS设计模式之单例模式
- JavaScript中0和""比较引发的问题
- js常用事件总结及案例-onFocus、onBlur
- javascript 中的console.log有什么作用啊?
- js三种消息框总结-警告框、确认框、提示框
- js压缩上传的图片,并转化为base64字符串传输
- js报错:Ajax 中onreadystatechange在ie7及以上浏览器兼容吗,为什么没有反应?求大神
- Javascript学习笔记part1(Table单元格相同数据自动合并)补充
- JS常用方法
- 怎么引入(调用)一个JS文件
- 淘宝京东购物车价格计算,商品店铺联动js
- 解析数组json
- JS加载器如何动态加载外部js文件
- JS设计模式之构造函数模式
- 汉字转换为拼音的JavaScript库
- JavaScript 基础
- JS中完美兼容各大浏览器的scrolltop方法
- Data获取字节数据,组成字符串出错 rapidjson解析出错