在Chrome中JavaScript數組到底占用了多少內存

這期內容當中小編將會給大家帶來有關在Chrome中JavaScript數組到底占用了多少內存，文章內容豐富且以專業的角度為大家分析和敘述，閱讀完這篇文章希望大家可以有所收獲。

因為我（原作者）的代碼使用的很大的內存，所以我看了一下字符串、對象、數字和數組分別占用了多少內存。

結果如下：

我覺得這些數據最大的挑戰是，空數組或者空列表占用的內存太小了。

因此我創建了大量空列表，而不是每次重新使用相同的空列表。

我不完全理解這些結果。它們依賴于 JavaScript 引擎的內部結構。

空字段的大小是有道理的。每一項正好占用 8 個字節。（整個數組實際上占用了 8,000,048 個字節，因此有 48 個字節是數組本身的開銷。）

但是，數字的數組卻不符合我的期望。JavaScript 使用雙精度（64 位）浮點數。64 位是 8 字節，但是每個數字平均占用了 9.7 字節。

同樣，Chrome 將每個空數組的大小顯示為 32 字節，每個空對象的大小為 56 字節。然而，整個數組的平均大小分別為 39.8 和 62.7。

我猜測之所以造成這個差異，一部分來自于 V8 存儲數組項的元數據（例如類型信息），并且 Chrome 為數組提供的空間比實際最低要求的空間要多一些。另外，并不是所有的數組在 V8 內部都是相同的。2011 年的這篇博文（value representation in javascript implementations）也很不錯。

（譯注：以后有時間再寫一篇關于 V8 數組內部存儲原理的文章，by justjavac）

    
  
  
  // Inheritance hierarchy:// - Object//   - Smi          (immediate small integer)//   - HeapObject   (superclass for everything allocated in the heap)//     - JSReceiver  (suitable for property access)//       - JSObject//         - JSArray//         - JSArrayBuffer//         - JSArrayBufferView//           - JSTypedArray

如果要在 Chrome 中使用內存分析器（Profiler），可以使用此 CodePen 或從 Github 獲取代碼。

It’s also interesting to see what the table looks like with only item in each array:

譯文完。

補充一些相關知識點，關于 Chrome 內存分析器（Profiler）的使用。

當我們使用內存分析器時，要先創建一個純凈的環境，可以在新建標簽頁時選擇隱身模式或者訪客模式。再高級點的用法就是自己新建一個 Chrome 桌面快捷方式并配置相關的命令行參數。

如果你查看了之前的文章，文中提到“打開 Profiles 面板”時，你可能在你的 Chrome 中找不到這個面板，因為 Profiles 已經改名了，現在是 Memory 面板。

在 Memory 面板中，選擇 Take Heap Snapshot，可以制作一個堆內存快照。Google 開發者中心有一篇非常不錯的文章（有中文版），“如何記錄堆快照”：https://developers.google.com/web/tools/chrome-devtools/memory-problems/heap-snapshots

上述就是小編為大家分享的在Chrome中JavaScript數組到底占用了多少內存了，如果剛好有類似的疑惑，不妨參照上述分析進行理解。如果想知道更多相關知識，歡迎關注億速云行業資訊頻道。