ES6的let命令实现猜想

时间:2021-12-14 16:14:36

今天看了看阮一峰的《ECMAScript 6入门》的let和const命令,看完let之后自己测试了一把,仿佛处在云里雾里之中。代码如下:

"use strict";

let o = {};
for (let i=0; i<10; i++) {
var j = i;
console.log('for before ... i: ' + j);
o[j] = function(){
i ++;
console.log('func one ... i: ' + i);
var f = function(){
i ++;
console.log('func two ... i: ' + i);
};
f();
};
o[j]();
console.log('for end ... i: ' + i);
console.log();
} console.log('------------'); for (var key in o) {
var fn = o[key];
console.log('key: ' + key);
fn();
fn();
console.log();
}

运行结果如下:

for before ... i: 0
func one ... i: 1
func two ... i: 2
for end ... i: 2 for before ... i: 3
func one ... i: 4
func two ... i: 5
for end ... i: 5 for before ... i: 6
func one ... i: 7
func two ... i: 8
for end ... i: 8 for before ... i: 9
func one ... i: 10
func two ... i: 11
for end ... i: 11 ------------
key: 0
func one ... i: 3
func two ... i: 4
func one ... i: 5
func two ... i: 6 key: 3
func one ... i: 6
func two ... i: 7
func one ... i: 8
func two ... i: 9 key: 6
func one ... i: 9
func two ... i: 10
func one ... i: 11
func two ... i: 12 key: 9
func one ... i: 12
func two ... i: 13
func one ... i: 14
func two ... i: 15

从结果中我总结出如下规律:

1.let变量会隐式传递到下层函数里面;

2.函数接收到上层传递来let变量后,会开辟一块新的内存,用以保存该变量;

3.函数处理完上层传递来的let变量后,会隐式返回给上层并更新上层的let变量。

那么该如何实现呢?我是这样想的:

1.在每个函数(包括顶层(函数))里面都设置一张let表;

2.在定义函数的时候拷贝一份let表数据,添加到函数的let表里面,并标记来源;

3.当函数执行结束,将let表中从上层传递过来的变量用新值更新回上层的let表中