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

相关推荐
star010-14 分钟前
【视频+图文详解】HTML基础4-html标签的基本使用
前端·windows·经验分享·网络安全·html·html5
engchina19 分钟前
CSS Display属性完全指南
前端·css
engchina23 分钟前
详解CSS `clear` 属性及其各个选项
前端·css·css3
沈韶珺23 分钟前
Elixir语言的安全开发
开发语言·后端·golang
go54631584651 小时前
python 从知网的期刊导航页面抓取与农业科技相关的数据
开发语言·python·科技
m0_699659561 小时前
QT知识点复习
开发语言·qt
南玖yy1 小时前
C语言:数组的介绍与使用
c语言·开发语言·算法
小菜鸟博士1 小时前
手撕Vision Transformer -- Day1 -- 基础原理
人工智能·深度学习·学习·算法·面试
米码收割机1 小时前
【python】tkinter实现音乐播放器(源码+音频文件)【独一无二】
开发语言·python·pygame
yashunan2 小时前
Web_php_unserialize
android·前端·php