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

相关推荐
Async Cipher几秒前
CSS 继承 (Inheritance)
前端·css
祈祷苍天赐我java之术8 分钟前
Vue 整体框架全面解析
前端·javascript·vue.js
Pocker_Spades_A1 小时前
Python快速入门专业版(二十六):Python函数基础:定义、调用与返回值(Hello函数案例)
开发语言·python
洛小豆1 小时前
Git 打标签完全指南:从本地创建到远端推送
前端·git·github
island13141 小时前
【C++框架#5】Elasticsearch 安装和使用
开发语言·c++·elasticsearch
世间小小鱼1 小时前
【爬坑指南】亚马逊文件中心 AWS S3 预签名URL 前端直传
前端·云计算·aws
华仔啊1 小时前
前端登录token到底应该存在哪?LocalStorage、SessionStorage还是Cookie?一篇说透!
前端·javascript
9号达人1 小时前
Java 13 新特性详解与实践
java·后端·面试
想用offer打牌1 小时前
线程池踩坑之一:将其放在类的成员变量
后端·面试·代码规范
BeefyBytes1 小时前
动态组件库建设
前端