以下代码,那一部分运行快

上半部分代码块:

javascript复制代码

ini 复制代码
const arr1 = [];
for (let i = 0; i < 1000000; ++i) {
  arr1[i] = 1;
}

下半部分代码块:

javascript复制代码

ini 复制代码
const arr2 = [];
arr2[1000000 - 1] = 1;
for (let i = 0; i < 1000000; ++i) {
  arr2[i] = 1;
}

总结:

  • 上半部分代码效率更高,因为它利用了数组的快速模式。
  • 下半部分代码 由于先设置了 arr2[1000000 - 1],导致数组失去了快速模式的优势,降低了效率。

测试代码:

javascript复制代码

ini 复制代码
// 测试代码
console.time('a');
const arr1 = [];
for (let i = 0; i < 1000000; ++i) {
  arr1[i] = 1;
}
console.timeEnd('a');

console.time('b');
const arr2 = [];
arr2[1000000 - 1] = 1;
for (let i = 0; i < 1000000; ++i) {
  arr2[i] = 1;
}
console.timeEnd('b');

JS运行机制:

浏览器 内核 JS解析引擎
Chrome 早期 WebKit,现目前 Blink V8
Mozilla Firefox Gecko SpiderMonkey
Edge Chromium Chakra / V8
Safari Webkit JavascriptCore

补充说明:

  • 比较主流的JS引擎是V8,这里假设是跑在Chrome或Node上,用的是V8引擎。
  • V8引擎利用隐藏类(Hidden Class)的方式来存放JS对象,并且数组有快速模式(Fast Mode)和字典模式(Dictionary Mode)。
  • 在快速模式下,数组的索引是连续的,并且类型是一致的,这样可以提高访问和赋值的效率。
  • 一旦数组的索引不连续(如 arr2[1000000 - 1] = 1),数组就会失去快速模式的优势,转而使用字典模式,效率降低。
  • 因此,左边代码生成的数组保持在快速模式,而右边代码生成的数组由于索引不连续而失去了快速模式的优势,导致左边代码性能更好。
  • 指导代码编写习惯:定义数组时,尽可能保持索引连续,避免使用非连续索引赋值。
相关推荐
王码码20353 分钟前
Flutter for OpenHarmony:Flutter 三方库 algoliasearch 毫秒级云端搜索体验(云原生搜索引擎)
android·前端·git·flutter·搜索引擎·云原生·harmonyos
发现一只大呆瓜7 分钟前
深入浅出 AST:解密 Vite、Babel编译的底层“黑盒”
前端·面试·vite
天天鸭25 分钟前
前端仔写了个 AI Agent,才发现大模型只干了 10% 的活
前端·python·ai编程
发现一只大呆瓜1 小时前
前端模块化:CommonJS、AMD、ES Module三大规范全解析
前端·面试·vite
IT_陈寒1 小时前
一文搞懂JavaScript的核心概念
前端·人工智能·后端
IT_陈寒1 小时前
Java开发者必看!5个提升开发效率的隐藏技巧,你用过几个?
前端·人工智能·后端
前端Hardy1 小时前
Wails v3 正式发布:用 Go 写桌面应用,体积仅 12MB,性能飙升 40%!
前端·javascript·go
Laurence1 小时前
Qt 前后端通信(QWebChannel Js / C++ 互操作):原理、示例、步骤解说
前端·javascript·c++·后端·交互·qwebchannel·互操作
Pu_Nine_91 小时前
JavaScript 字符串与数组核心方法详解
前端·javascript·ecmascript
码云数智-园园1 小时前
从输入 URL 到页面展示:一场精密的互联网交响乐
前端