专注WEB开发 分享经验,沉淀知识

分析console.log输出和预期的不一致问题

 作者:chenxing  时间:2017-12-15 09:42  评论:

虽然这种情况很少见,对于正常的普通变量的输出不影响。写此文章的目的在意,要提醒自己console.*存在的这种现象,避免在js调试过程中带来困扰。

js调试console.log是再常见不过的命令了,然而就是这样一个命令有时候往往会给我们造成困扰,在遇到输出对象时console.log和我们预期的不一样。

举个例子下面的代码:

ovar obj = {a:1};
oconsole.log(obj);
oobj.a = 2; 
oconsole.log(obj);

我们所预想的是obj输出应该是{a:1},但是我们看看chrome控制台输出效果:

console.log输出

好像没问题,我们点那个箭头展开看数据:

json对象展开查看

对象obj中a键值发生了变化。我们来看看《你不知道的JavaScript》这本书是如何解释这一现象的。

并没有什么规范或一组需求指定console.* 方法族如何工作——它们并不是JavaScript正式的一部分,而是由宿主环境(请参考本书的“类型和语法”部分)添加到JavaScript中的。因此,不同的浏览器和JavaScript环境可以按照自己的意愿来实现,有时候这会引起混淆。尤其要提出的是,在某些条件下,某些浏览器的console.log(..)并不会把传入的内容立即输出。出现这种情况的主要原因是,在许多程序(不只是JavaScript)中,I/O是非常低速的阻塞部分。所以,(从页面/UI的角度来说)浏览器在后台异步处理控制台I/O能够提高性能,这时用户甚至可能根本意识不到其发生。

当然书中作者也给出了解决意见:

如果遇到这种少见的情况,最好的选择是在JavaScript调试器中使用断点,而不要依赖控制台输出。次优的方案是把对象序列化到一个字符串中,以强制执行一次“快照”,比如通过JSON.stringify(..)。

我自己在实践中的体会在需要输出json对象的时候,在预料到可能后面的代码会修改这个json对象,我会在后面直接跟一个return。

虽然这种情况很少见,对于正常的普通变量的输出不影响。写此文章的目的在意,要提醒自己console.*存在的这种现象,避免在js调试过程中带来困扰。

除特别注明外,本站所有文章均为作者原创。 或分享自己的编程经验,或探讨工作中的问题,或聊以人生趣事。 转载请注明出处来自 http://www.qiusuoweb.com/106.html

发布评论

 提交评论
有人回复时邮件通知我

 评论(0)

站长头像
chenxing(PHP攻城狮)

运营天数

总访问量

文章数量

-

-

-

交流群:157451741

新浪微博:草莽兴

 近期文章

PHP一个接口如何批量请求第三方接口

 2022-08-08 22:47  233

Mac目录如何快速返回上一级?

 2022-07-21 17:27  431

Mac目录和终端如何快速切换

 2022-07-21 17:11  167

phpstorm一个窗口打开多个项目?

 2022-07-20 17:15  234

 最新评论

 诚心: 09月29日 23:01
学到了
来源: 如何一次性推送百万级别的消息
 Nick: 04月14日 12:26
网上的资料还是太老,都只是取一个元素,解决了一大难题
来源: redis set集合取出一组数据并删除
 skywalker: 11月03日 18:21
简洁明了
来源: mysql 获取某个日期的前一天或后一天
 lisheng: 05月09日 19:26
兴哥牛B加油哈兴哥成功的道路上你又进了一步 哈哈
来源: 一年时间又回到这里
 心态炸裂: 03月24日 10:54
No3.blindcomfirm 多了一个l,望改正!!!
来源: 微信小程序获取input值的总结
 666666: 11月08日 13:49
66666
来源: 一年时间又回到这里