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 的编译结果是不一样的

相关推荐
Access开发易登软件几秒前
Access 怎么做前后端分离?用 Web API 读写 SQL Server
前端·数据库·人工智能·microsoft·excel·access
10share9 分钟前
React 新一代样式隔离方案 —— 编译时、零运行时、原生写法
前端·react.js
upgrador18 分钟前
桌面应用开发:Electron 与 NSIS 的关系、打包流程及 Windows 本地构建实战
javascript·windows·electron
Revolution6119 分钟前
Node.js 是什么:前端项目里哪些事情由它完成
前端·面试·node.js
Richard.Wong32 分钟前
qt生成dll供C#调用
开发语言·qt
我要两颗404西柚37 分钟前
Stage three:VUE工程化与实战工具
前端·javascript·vue.js
光影少年42 分钟前
RN 的EventEmitter 双向通信
前端·react native·react.js
wang_xin_88844 分钟前
PHP函数
开发语言·php
Immortal__y1 小时前
php函数
开发语言·php
AI砖家1 小时前
多商户多租户系统架构设计文档(Java版)
java·开发语言·系统架构·多租户·多商户