控制檯詭異錄之展開與縮略不一樣

問題復現

最近朋友發給我這樣的一個串代碼：

var arr = [1, 4, 2, 3 ];
console.log(arr);
arr.sort();

朋友說，這個輸出不正確。我表示不信，就試了下：

從結果看，沒毛病啊。朋友說，你展開看看，一看果真有問題

縮略狀態的顯示與展開的顯示不一樣！！！

問題思考

這個問題的表現是:

縮略狀態下顯示原數組 [1, 4, 2, 3 ]，展開狀態下顯示排序後的數組[1, 2, 3, 4 ]。

這裏的不一致致使咱們比較困惑：

console.log(arr)打印的數組究竟是原數組仍是排序後的數組？

咱們知道的是JS代碼是按照順序執行的，按道理說應該打印[1, 4, 2, 3 ],也就是說縮略狀態的顯示是符合常理的。經過下面的代碼咱們能夠佐證：

var arr = [1, 4, 2, 3 ];
console.log(arr.toString()); // 1,4,2,3
arr.sort();

可是爲何展開後的數組倒是排序後的呢？
咱們思考3秒鐘
1...
2...
3...
我我的理解這個問題是這樣的：
Chrome的展開是一個點擊事件，也就是說這是一個異步，等你點擊的時候arr.sort()
已經執行完畢了，這時候點擊展開arr，其實展開的就是排序後的數組(由於arr是引用類型的)。這樣，就出現了上面這個問題。
除數組外，對象也存在這個問題，換句話說，這個引用類型的應該也都存在這個問題。
至此，這個問題算是有了解釋。
以上，我的理解，若是你有更好的解釋，歡迎提出。