吉林省建设集团有限公司网站,大数据开发培训班课程,海北州公司网站建设,漫画驿站网页设计图纸尺寸大小var 、 let 和 const 的差异主要体现在作用域、变量提升、重复声明、重新赋值以及在循环中的行为等。 1. var
作用域#xff1a; var 声明的变量具有函数作用域或全局作用域。在函数内部声明的变量只在函数内部有效#xff0c;而在函数外部声明的变量在整个函数外部都有效。…var 、 let 和 const 的差异主要体现在作用域、变量提升、重复声明、重新赋值以及在循环中的行为等。 1. var
作用域 var 声明的变量具有函数作用域或全局作用域。在函数内部声明的变量只在函数内部有效而在函数外部声明的变量在整个函数外部都有效。变量提升在变量声明之前就可以使用但值为 undefined 。这是因为变量声明会被提升到函数或全局作用域的顶部。重复声明允许多次声明同一个变量后续声明会覆盖前面的声明。重新赋值可以重新赋值。
function example() {console.log(x); // 输出 undefinedvar x 10;console.log(x); // 输出 10
}example();
console.log(x); // 报错因为 x 只在 example 函数内部有效2. let
作用域 let 声明的变量具有块级作用域。在 {} 内部声明的变量只在该块内部有效。变量提升不会发生变量提升如果在声明之前访问变量会报错。重复声明不允许在同一作用域内重复声明同一个变量会报错。重新赋值可以重新赋值但不能重新声明。
function example() {console.log(x); // 报错因为 x 还未声明let x 10;console.log(x); // 输出 10
}example();
console.log(x); // 报错因为 x 只在 example 函数内部有效3. const
作用域 const 声明的变量具有块级作用域和 let 类似。变量提升不会发生变量提升如果在声明之前访问变量会报错。重复声明不允许在同一作用域内重复声明同一个变量会报错。重新赋值不可重新赋值但对于复杂类型的数据如数组或对象虽然不能重新赋值但可以修改其内部的属性或元素。
const PI 3.14;
// PI 3.14159; // 报错因为 const 声明的变量是常量不可重新赋值const arr [1, 2, 3];
arr.push(4);
console.log(arr); // 输出 [1, 2, 3, 4]4. 在循环中的行为
在循环中使用 var 会导致变量的共享问题而使用 let 或 const 可以避免这个问题。
for (var i 0; i 5; i) {setTimeout(function() {console.log(i); // 输出 5, 5, 5, 5, 5}, 100);
}for (let j 0; j 5; j) {setTimeout(function() {console.log(j); // 输出 0, 1, 2, 3, 4}, 100);
}由于 var 声明的变量具有函数作用域循环结束后 i 的值为 5 而在第一个循环中 setTimeout 回调函数是在循环结束后才执行的因此输出的都是 5 。而在第二个循环中 let 声明的变量具有块级作用域每次循环都会创建一个新的作用域因此 setTimeout 回调函数中可以访问到当前循环的 j 的值。
在实际开发中推荐优先使用 let 和 const 来声明变量以避免潜在的问题。
