//同事讨论遇到一个很有意思的话题
//for循环里面的i循环第二次是赋值还是重新声明
for(let i=0;i<100;i++){
console.log(i)
}
//对于这个问题正常解释
//如果是var了
for(var i=0;i<100;i++){
console.log(i)
}
/*
那么这样的肯定毫不犹豫的说 第二次循环是赋值,但是let了,毕竟let是块级作用域。因为没办法去解释,
想到用babel转换成ES5
https://babeljs.io/repl/#?babili=false&browsers=&build=&builtIns=false&spec=false&loose=false&code_lz=GYewTgFANgpgLgAgJYF4AMBuJAeAjGzJAaiIEoBvAKAQQGMQA7AZxFgDooQBzCJUjSgF9K9ZqxgduvUkA&debug=false&forceAllTransforms=false&shippedProposals=false&circleciRepo=&evaluate=false&fileSize=false&timeTravel=false&sourceType=module&lineWrap=true&presets=es2015%2Creact%2Cstage-2&prettier=false&targets=&version=7.4.5&externalPlugins=
*/
//转换代码让我大吃一惊
//源代码
let arr = []
for(let i=0;i<100;i++){
arr[i] = function(){
console.log(i)
}
}
console.log(i)
//babel转换后的
"use strict";
var arr = [];
var _loop = function _loop(_i) {
arr[_i] = function () {
console.log(_i);
};
};
for (var _i = 0; _i < 100; _i++) {
_loop(_i);
}
console.log(i);
//看着一脸懵逼 这就换了个变量名啊,算也是解决了一系列问题
//如果按照这个来说 那肯定依旧是赋值操作而非声明
//看来这个是没办法证明了 那就用支持es6的浏览器试一下
//于是我就在chrome控制台敲入代码
for(let i=0;i<100;i++){
debugger
}
//单步调试 依旧是赋值操作 let i只运行了一次
//但是依旧说服不了自己
//于是想到什么东西可以监听到赋值还是声明了 忽然想到const特性 修改就报错
//于是写下
for(const i=0;i<100;i++){
console.log(i)
}
//支持就报错
//VM66:1 Uncaught TypeError: Assignment to constant variable.
// at <anonymous>:1:22
//至此应该完全证明了猜想 此循环第二次是赋值操作
//那又有同事好奇 这个key第二次循环是赋值还是声明新的变量
for(let key in {id:1,name:'2'}){
console.log(key)
}
for(const key in {id:1,name:'2'}){
console.log(key)
}
//以上两个运行都正常 初步证明是声明了新变量
//还有个疑问 竟然let是块 到底作用到什么地方
for(let i=0;i<100;i++){
let i = 1000;
console.log(i);
}
console.log(i)
//看完这个结果 应该有答案了
boost log 能不能循环覆盖_记一次for循环中let是声明还是赋值
最新推荐文章于 2022-12-09 11:18:31 发布