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

相关推荐
枫叶丹41 小时前
【Qt开发】Qt窗口(九) -> QFontDialog 字体对话框
c语言·开发语言·数据库·c++·qt
海上彼尚2 小时前
Go之路 - 7.go的结构体
开发语言·后端·golang
源代码•宸7 小时前
分布式缓存-GO(分布式算法之一致性哈希、缓存对外服务化)
开发语言·经验分享·分布式·后端·算法·缓存·golang
云和数据.ChenGuang7 小时前
PHP-FPM返回的File not found.”的本质
开发语言·php·运维工程师·运维技术
R.lin8 小时前
Java 8日期时间API完全指南
java·开发语言·python
哆啦A梦15888 小时前
商城后台管理系统 03 登录布局
javascript·vue.js·elementui
yangpipi-8 小时前
《C++并发编程实战》 第4章 并发操作的同步
开发语言·c++
火钳游侠8 小时前
java单行注释,多行注释,文档注释
java·开发语言
曼巴UE58 小时前
UE FString, FName ,FText 三者转换,再次学习,官方文档理解
服务器·前端·javascript
有趣的我8 小时前
C++ 多态介绍
开发语言·c++