在for循环中使用const作为循环变量

时间:2019-05-09 11:53:35

标签: javascript angular typescript ecmascript-6

我了解在var / let的{​​{1}}循环中使用fortypescript的行为,但是有人可以解释const变量的原因和方式为一个循环变量的行为?

javascript

据我了解,当您将变量声明为for (const i = 0; i < 5; i++) { setTimeout(function() { console.log(i) }, 100 * i); } 并初始化其值时,该值无法更改

但是您可以看到const中的值正在更改。编译正确时必须抛出错误?我在这里缺少什么?

我为此行为创建了2个示例。

Loop variable as a const

Const variable re assignment

有人可以帮助我理解吗?

2 个答案:

答案 0 :(得分:6)

它在Stackblitz中工作,因为它正在运行经过翻译的代码:

AppComponent.prototype.test = function () {
    var _loop_1 = function (i) {
        setTimeout(function () {
            console.log(i);
        }, 100 * i);
    };
    for (var i = 0; i < 5; i++) {
        _loop_1(i);
    }
};

如果您在此处添加代码段,则该代码将无法转载,将无法正常工作

for (const i = 0; i < 5; i++) {
  setTimeout(function() {
    console.log(i)
  }, 100 * i);
}

enter image description here

答案 1 :(得分:0)

回答您的问题,

  test(){
    for(const i =0 ; i< 5; i++){
      setTimeout(function(){
        console.log(i)
      },100*i);
    }
  }

这段代码实际上变成了

  test(){

    // can be only initialized once
    const i;
    for(i = 0 ; i< 5; i++){
      setTimeout(function(){
        console.log(i)
      },100*i);
    }
  }

因为每个JavaScript变量都位于其作用域的顶部hoisted,所以在这种情况下,将test()作为其const变量,这就是为什么它将JavaScript悬挂在该块中并且无法在其外部访问的原因

要更正这段代码:

  test(){

    // can be only multiple times in that block
    for(let i = 0 ; i< 5; i++){
      setTimeout(function(){
        console.log(i)
      },100*i);
    }
  }

成为哪个人

  test(){

    let i;
    // can be only multiple times in that block
    for(i = 0 ; i< 5; i++){
      setTimeout(function(){
        console.log(i)
      },100*i);
    }
  }

由于constlet都具有block scope并被吊在其定义的块的顶部,因此constlet之间的唯一区别是是声明为const的变量无法重新初始化。