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

相关推荐
周末程序猿6 分钟前
Linux高性能网络编程十谈|C++11实现22种高并发模型
后端·面试
黑客老李21 分钟前
JavaSec | SpringAOP 链学习分析
java·运维·服务器·开发语言·学习·apache·memcached
开开心心就好30 分钟前
高效Excel合并拆分软件
开发语言·javascript·c#·ocr·排序算法·excel·最小二乘法
難釋懷30 分钟前
Vue解决开发环境 Ajax 跨域问题
前端·vue.js·ajax
特立独行的猫a35 分钟前
Nuxt.js 中的路由配置详解
开发语言·前端·javascript·路由·nuxt·nuxtjs
中微子37 分钟前
小白也能懂:JavaScript 原型链和隐藏类的奇妙世界
javascript
咸虾米38 分钟前
在uniCloud云对象中定义dbJQL的便捷方法
前端·javascript
梨子同志39 分钟前
JavaScript Proxy 和 Reflect
前端·javascript
海的诗篇_41 分钟前
移除元素-JavaScript【算法学习day.04】
javascript·学习·算法
汤圆炒橘子42 分钟前
状态策略模式的优势分析
前端