瀏覽器控制台中打印對象居然給的是原始數據的引用!!!


春風十里,楊柳淑靜,婀娜身姿藏綿針。

額哼,讓我喝口水再跟你們慢慢道來。好了,這個時候你的要把哪些什么淑靜,什么婀娜給忘了,聽我好好說。

故事要從n年前說起,那是我剛剛學習編程的時候,一個高我一屆的學長跟我安利V8,反正聽得我是暈頭轉向,什么ECMAScript,當時只記得它的什么鬼前身是歐洲計算機制造商協會,聽到這里我就沒興趣了,別問我為什么。你說一個搞硬件生產的什么商會懂什么編程是吧!!!

n年后的今天,我有些后悔,沒跟他老人家多學點就好了,畢竟。。。

人家的技術現在可不是蓋的,丐幫洪幫主估計。。。又扯遠了。

現在開始真正的表演!

Google Chrome對於我們前端編程來說是一個非常友好的工具,日常我也都是采用chrome來測試程序,個人感覺還是它的debug最友好,但是今天出現的一個問題讓我抓狂了。先來看下面這個圖:

接着來看代碼:

從控制台來看,打印的是8個元素的類數組,但是當我點開查看詳情信息時,這明明就是11個元素啊,length數組明明給的就是11啊,為什么打印的時8。

Chrome!!!我還能信任你嗎?

你可是每天比我女朋友和我待在一起的時間還長啊!

哦,忘了我還沒女票呢!

然后,我就想起了度娘,雖然,好多人都嫌棄它,我曾今也因為一些什么不是很喜歡它。但是,誰要“有問題找度娘”那么經典呢?這結果更讓我崩潰:

這里沒答案。。。

相信我,有問題是可以找度娘,但是人家為了接生意,管你喜歡圓的扁的,能讓你掏銀子就是好家伙,立馬給你回頭問“小翠”呢?快叫小翠。

本來想硬着頭皮去一些abcd之類的網頁看看,但是,想想覺得自己的技術這點問題都不能解決嗎?

瞪直眼睛一看,順手抽了趴在桌上的狗子一巴掌,就是欠抽,好好的js操作DOM,你把js放頭部想干啥呢?

看着狗子傻瞪着眼睛,我冷靜下來,怎么能這樣呢?

打印8個元素的數組我能理解,js執行的時候后面的DOM結構還沒解析嘛。為什么我點開后又顯示出11個元素呢?第一反應Chrome太不靠譜了,我打印對象你怎么能給我查看詳情卻是后面被修改的呢?你不應該給我一個打印時的對象嗎?這也特不靠譜了。

於是乎,我去firefox上的控制台測試一把:

我只能說他更不要臉了,這部純屬誤導嗎?Chrome還給了一個代碼執行時的縮寫結果,你打印的去直接就是個時時的引用結果。

所以,我錯了,狗子,Chrome!!!

最后,肺腑之言:

瀏覽器打印的引用值類型並不是准確的,下面再來一段測試:(chrome下測試)

 

打印結果:

這個現象和firefox打印的DOM對象集合的效果一致,所以以后再有遇到打印引用值類型進行debug時,一定注意,瀏覽器在控制台打印出來的是原始數據的引用,每個瀏覽器還都有些差異,打印引用值類型測試時一定注意這個問題,不然估計你翻遍全世界估計都找不到答案,還有少找度娘,小翠五一出去旅游了,其他的都不會是你想要的。

 


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM