1. var
var 语句 用于声明一个函数范围或全局范围的变量，并可将其初始化为一个值（可选）。
var是在ES5及之前的JavaScript版本中用于声明变量的关键字。下面是对var的详细解释：
1.变量提升（Variable Hoisting）：
- 使用
var声明的变量会发生变量提升，即在代码执行之前就可以访问该变量，但其值为undefined。 - 这意味着你可以在变量声明之前使用变量，而不会报错。
2.函数作用域（Function Scope）：
- 使用
var声明的变量具有函数作用域，即变量的可见范围限定在声明它的函数内部。 - 如果在函数内部声明的变量在函数体外访问，将会得到
undefined或全局作用域中具有相同名称的变量（如果存在）。
3.全局作用域（Global Scope）：
- 在全局作用域中使用
var声明的变量是全局变量，可以在代码的任何地方访问。 - 全局作用域中的变量会成为
window对象的属性，可以通过window.variableName的方式访问。
4.变量重复声明：
- 使用
var关键字可以重复声明同一个变量，而不会报错。这可能会导致意外的错误和变量覆盖。
5.没有块级作用域：
- 在使用
var声明的变量中，没有块级作用域的概念。 - 即使在
if语句、for循环等代码块中声明的变量，在块外部仍然可见。
console.log(x); // 输出 undefined，变量提升
var x = 10;
function example() {
var y = 20;
if (true) {
var z = 30;
console.log(y); // 输出 20，y 在函数作用域内可见
}
console.log(z); // 输出 30，z 在函数作用域内可见
}
example();
console.log(x); // 输出 10，全局作用域中的变量
console.log(window.x); // 输出 10，全局变量是 window 对象的属性
console.log(y); // 报错，y is not defined，y 在函数作用域外不可见
console.log(window.y); // 输出 undefined，函数作用域中的变量不是全局变量2. let
let是ES6（ECMAScript 2015）引入的关键字，用于声明块级作用域的变量。下面是对let的详细解释：
1.块级作用域（Block Scope）：
- 使用
let声明的变量具有块级作用域，即变量的可见范围限定在声明它的块内部（一对花括号{}）。 - 在块级作用域中声明的变量在外部是不可见的，可以避免变量污染和意外的变量覆盖。
2.不存在变量提升（No Variable Hoisting）：
- 与使用
var声明的变量不同，使用let声明的变量不存在变量提升。 - 在声明之前访问
let变量会导致ReferenceError。
3.重复声明错误（Redeclaration Error）：
- 在同一作用域内重复使用
let声明同一个变量会导致语法错误。 - 这有助于避免意外的变量重复声明。
4.循环中的块级作用域：
- 在
for循环中使用let声明的变量具有块级作用域，每次循环都会创建一个新的变量实例。 - 这解决了使用
var在循环中常见的问题，即循环迭代变量泄漏到外部作用域的情况。
以下是一个示例代码，展示了let的特性：
function example() {
let x = 10; // 块级作用域变量
if (true) {
let y = 20; // 块级作用域变量
console.log(x); // 输出 10
console.log(y); // 输出 20
}
// console.log(y); // 报错，y is not defined，y 不在作用域内
}
example();
// console.log(x); // 报错，x is not defined，x 不在作用域内
// 重复声明错误
// let z = 30;
// let z = 40; // 报错，Identifier 'z' has already been declared
// 循环中的块级作用域
for (let i = 0; i < 3; i++) {
setTimeout(function () {
console.log(i); // 输出 0, 1, 2
}, 1000);
}
3. 直接赋值
在JavaScript中，直接赋值是指将一个值直接赋给一个变量，而无需使用关键字进行声明。直接赋值可以用于创建新的变量或更新已存在的变量。下面是对直接赋值的详细解释：
1.创建新变量：
- 如果直接赋值语句中的变量尚未被声明，赋值操作将创建一个新的变量，并将指定的值分配给该变量。
- 例如：
myVariable = 10;，这将创建一个名为myVariable的全局变量，并将其值设置为10。
2.更新已存在的变量：
- 如果直接赋值语句中的变量已经存在，赋值操作将更新该变量的值。
- 例如：
myVariable = 20;，这将更新myVariable的值为20。
需要注意以下几点：
- 全局变量：如果在任何函数内部或代码块中直接进行赋值，且未使用关键字声明变量，将创建一个全局变量。这会将变量添加到全局对象（例如，在浏览器环境中，它将成为
window对象的属性）。 - 隐式声明：直接赋值语句中未使用关键字声明变量，这会导致变量隐式声明。这样的隐式声明可能会导致意外的结果和难以调试的问题。建议始终使用关键字（如
var、let或const）明确声明变量。
以下是一些示例代码，演示了直接赋值的用法：
myVariable = 10; // 创建一个全局变量 myVariable，并赋值为 10
console.log(myVariable); // 输出 10
myVariable = 20; // 更新 myVariable 的值为 20
console.log(myVariable); // 输出 20
function example() {
anotherVariable = 30; // 创建一个全局变量 anotherVariable，并赋值为 30
console.log(anotherVariable); // 输出 30
}
example();
console.log(anotherVariable); // 输出 30，在全局作用域内可见
4. const 属性
const是ES6（ECMAScript 2015）引入的关键字，用于声明一个常量（不可变的值）。下面是对const的详细解释：
1.常量的赋值：
- 使用
const声明的变量必须在声明时进行初始化，并且不能再次赋值。 - 一旦为常量赋予了初始值，就无法再改变它的值。
2.块级作用域：
const声明的常量具有块级作用域，类似于使用let声明的变量。- 常量只在声明它的块内部可见，尝试在块外部访问常量会导致
ReferenceError。
3.保留其值：
const声明的常量的值在声明后不能被修改。- 这意味着不能对常量进行重新赋值操作。
4.对象和数组的注意事项：
const声明的常量不能被重新赋值，但如果它引用的是一个对象或数组，那么对象或数组的属性或元素是可以被修改的。- 这是因为
const保护的是常量的绑定（引用），而不是绑定的值本身。
以下是一些示例代码，展示了const的特性：
const PI = 3.14159; // 声明常量 PI，并赋值为 3.14159
console.log(PI); // 输出 3.14159
// PI = 3.14; // 报错，Assignment to constant variable
function example() {
const x = 10; // 声明块级作用域的常量 x，并赋值为 10
console.log(x); // 输出 10
// x = 20; // 报错，Assignment to constant variable
}
example();
// console.log(x); // 报错，x is not defined
const person = {
name: "John",
age: 30,
};
person.age = 40; // 可以修改对象的属性
console.log(person); // 输出 { name: 'John', age: 40 }
const numbers = [1, 2, 3];
numbers.push(4); // 可以修改数组的元素
console.log(numbers); // 输出 [1, 2, 3, 4]
需要注意以下几点：
const声明的常量必须在声明时进行初始化，并且不能再次赋值。- 尽管
const声明的常量的值不可变，但对于引用类型（对象和数组），其属性或元素是可以修改的。 - 使用
const可以提高代码的可读性和维护性，并避免无意间修改常量的错误。 - 如果需要声明一个不可修改的变量，且不需要引用类型的特性，可以使用
const来明确表达意图。
总结：const关键字用于声明常量，它的值在声明后不可修改。常量具有块级作用域，并且保留其绑定（引用）。对于引用类型的常量，其属性或元素是可以修改的。使用const可以提高代码的可读性、减少错误，并明确表达变量的不可变性。
const关键字确实保护的是常量的绑定（引用），而不是绑定的值本身。这是由于JavaScript中的对象和数组是引用类型。
当使用const声明一个对象或数组时，实际上创建的是一个指向该对象或数组的引用。这个引用是不可变的，也就是说不能将它指向另一个对象或数组。但是，通过这个引用，仍然可以访问和修改对象或数组的属性或元素。
这是因为对象和数组本身是可变的数据结构。const只限制了对变量的重新赋值，但并不限制对对象或数组内部的属性或元素进行修改。因此，可以通过const声明的常量引用对象或数组，并在引用上进行属性或元素的修改。
这种设计是为了在保护常量的引用不被修改的同时，允许对对象或数组进行更改，以便在程序的不同部分共享和修改数据。
5. 变量提升
变量提升是JavaScript中的一种行为，它使得可以在变量声明之前访问这些变量。这意味着无论变量声明在哪个作用域内，它们都会在代码执行之前被“提升”到作用域的顶部。
在JavaScript中，变量提升只适用于使用var关键字声明的变量，而不适用于使用let和const声明的变量。下面是关于变量提升的一些重要概念和规则：
- 变量声明的提升：在一个作用域内，使用
var声明的变量会在代码执行前被提升到该作用域的顶部。这意味着你可以在变量声明之前访问这些变量。 - 变量初始化的位置：尽管变量声明会被提升，但变量的赋值操作并不会提升。变量的初始化（赋值）仍然会在代码中的实际位置执行。
- 变量提升的作用域：变量提升适用于包含变量声明的整个作用域。如果变量在某个作用域内声明，它会被提升到该作用域的顶部，并且在该作用域内的任何位置都可以访问。
下面是一个示例，演示了变量提升的行为：
console.log(x); // 输出 undefined，变量声明被提升，但未初始化 var x = 10; console.log(y); // 报错，y is not defined，let声明的变量不会提升 let y = 20;
在上述示例中，使用var声明的变量x会被提升到作用域的顶部，因此在变量声明之前就可以访问它。但是，由于变量初始化的位置在声明之后，所以在第一个console.log语句中，变量x的值为undefined。
另一方面，使用let声明的变量y不会被提升，因此在第二个console.log语句中，尝试访问y会导致ReferenceError。
需要注意的是，尽管变量提升使得在变量声明之前可以访问变量，但最佳实践是在使用变量之前显式地声明和初始化它们，以提高代码的可读性和可维护性。
总结：变量提升是JavaScript中的一种行为，使得使用var声明的变量在作用域的顶部被提升，可以在声明之前访问。但是变量的赋值操作不会被提升，变量的初始化仍然发生在代码中的实际位置。变量提升不适用于使用let和const声明的变量。
到此这篇关于JavaScript常用变量声明方式总结的文章就介绍到这了,更多相关JavaScript变量声明内容请搜索好代码网以前的文章或继续浏览下面的相关文章希望大家以后多多支持好代码网！