JavaScript 中的提升：可能会欺骗你的简单概念-js教程-PHP中文网

JavaScript 中的提升：可能会欺骗你的简单概念

霞舞

发布： 2024-12-23 18:49:05

原创

544人浏览过

javascript 中的提升：可能会欺骗你的简单概念

JavaScript 提升是面试中常见的考点，看似简单，实则容易迷惑初学者和经验丰富的开发者。本文将深入浅出地讲解 JavaScript 提升机制，并帮助你避免常见的陷阱。

什么是提升？

JavaScript 的提升机制在编译阶段，也就是代码执行之前，将变量和函数声明移动到其作用域（脚本或函数）的顶部。

需要注意的是，只有声明会被提升，初始化或赋值操作不会被提升。

不同类型的变量（变量、函数和类）提升行为有所不同。让我们分别探讨。

变量提升

var 关键字声明的变量

使用 var 声明的变量会被提升，但其初始化操作仍然保留在原位置。

立即学习“Java免费学习笔记（深入）”；

console.log(a); // 输出: undefined (声明被提升，但未初始化)
var a = 5;
console.log(a); // 输出: 5

登录后复制

let 和 const 关键字声明的变量

let 和 const 声明的变量同样会被提升，但由于“暂时性死区 (TDZ)”的存在，在声明之前访问这些变量会导致错误。

console.log(b); // ReferenceError: Cannot access 'b' before initialization
console.log(c); // ReferenceError: Cannot access 'c' before initialization
let b = 10;
const c = 'alphabet';

登录后复制

函数提升

函数声明会被完整提升，这意味着你可以在声明之前调用它。

greet(); // 输出: hello!
function greet() {
    console.log("hello!");
}

登录后复制

函数表达式（使用 var、let 或 const）则不会被完整提升；只有变量声明会被提升，赋值操作不会被提升。

sayhello(); // TypeError: sayhello is not a function
var sayhello = function() {
     console.log("hello!");
};

登录后复制

类提升

类的提升机制与函数不同。在声明之前使用类会引发错误。

const obj = new MyClass(); // ReferenceError: Cannot access 'MyClass' before initialization
class MyClass {
    constructor() {
        console.log("Hello from MyClass!");
    }
}

登录后复制