<big>版权声明：本文为 Codeagles 原创文章，可以随意转载，但必须在明确位置注明出处！！！</big>
背景
之前一直没接触过前端，现在工作接触了好多前端代码，身为前端小白的我，调试的时候还在用alert(obj)，但是当括号里面试obj类型的时候，弹出框只能判断这个方法在这个位置是否执行，并不能得出obj对象的内容，尴尬中。。。此时我去找到了我肥而不腻的猪哥@没关系是猪哥啊，他教会我用console.log()打印对象，然后在chrome的开发者模式中调试能看到结果，我感觉如获一宝，接下来的几天疯狂的使用这个东西，结果问题来了。。。。猪哥告诉我这有个坑，然后有了接下来的讨论。。。(测试只在chrome中，其他浏览器没有测试，如果有测试的伙伴，可以留言使用的浏览器和处理结果，让大家都共享一下)
问题
接下来看一段网上的代码，实际测试发现是一样的。
发现问题了吧，第一个a应该是空的，第二个才是打印结果，但是第一个就已经有值了，讨论了很长时间又做了下面的测试。
接下来看一下数组形式，发现依旧如此，通过其他资料发现也有人遇到过这种情况。然后又让猪哥帮我做了最后一个测试，我说不用json对象、数组这类的，直接把a让它成为一个整型的数据在测试一遍，有了如下结果：
这就说明问题了，当是数组和对象的时候，console是不准的，而是整型这类的基本数据类型是准确的，由此结果推断，chrome会记录对象的引用，从而log出来的对象引用应该是都是最新的，那么意味着console.log只是对不可变类型是有效的，而对于引用类型如果连续打印可能不是当时的结果
开始填坑
只能挖坑，不能填坑，那才是真坑。。这个问题也有很多资料可以解决了，不过还是要测试一下。
这样结果就是准确的，console.log(JSON.parse(JSON.stringify(obj)));加上这句话就可以完美的躲避了。
- JSON.stringify 假如obj是个json对象，则用该方法从obj中解析出一个字符串
- JSON.parse 很明显就是将字符串转换成json对象才打印，这样即可。
最后，感谢我肥而不腻的猪哥告诉我这个坑，还提供所有的测试素材。
网友评论