Es6的let实现原理——代码解析

本质利用的是JS闭包

原始es6代码:

js 复制代码
var funcs = []; 
for (let i = 0; i < 10; i++) { 
  funcs[i] = function () { 
    console.log(i); 
  };
}
funcs[0](); // 0 

babel 编译之后的 es5 代码(polyfill):

js 复制代码
var funcs = [];

var _loop = function _loop(i) {
  funcs[i] = function () {
    console.log(i);
  };
};

for (var i = 0; i < 10; i++) {
  _loop(i);
}
funcs[0](); // 0

其实我们根据 babel编译之后的结果可以看得出来let是借助闭包和函数作用域来实现块级作用域的效果的 在不同的情况下 let 的编译结果是不一样的

相关推荐
技术砖家--Felix6 分钟前
Spring Boot入门篇:快速搭建你的第一个Spring Boot应用
java·开发语言·音视频
国服第二切图仔10 分钟前
Rust开发之使用Trait对象实现多态
开发语言·算法·rust
Yolo566Q13 分钟前
Python驱动的无人机生态三维建模与碳储/生物量/LULC估算全流程实战技术
开发语言·python·无人机
i源27 分钟前
Java语言处理Js文件内容格式化
java·javascript
我不是程序猿儿32 分钟前
【C#】XtraMessageBox(DevExpress)与MessageBox(WinForms 标准库)的区别
开发语言·c#
2501_9387699938 分钟前
React Server Components 进阶:数据预取与缓存
前端·react.js·缓存
“负拾捌”1 小时前
基于NodeJs实现一个MCP客户端(会话模式和无会话模式)
javascript·ai·node.js·大模型·mcp
蒜香拿铁1 小时前
Angular【基础语法】
前端·javascript·angular.js
含目的基因的质粒2 小时前
Python异常、模块、包
服务器·开发语言·python
xiaoxiao无脸男2 小时前
纯css:一个好玩的按钮边框动态动画
前端·css·css3