JavaScript中的变量提升(Hoisting)将`var`声明和函数声明提前到作用域顶部,允许在声明前使用

简介: 【6月更文挑战第25天】JavaScript中的变量提升(Hoisting)将`var`声明和函数声明提前到作用域顶部,允许在声明前使用。`let`和`const`不完全提升,存在暂时性死区(TDZ),尝试在初始化前访问会出错。函数声明会被提升,但函数表达式不会。

变量提升(Hoisting)是JavaScript中的一个特性,它涉及到变量和函数声明的处理方式。在JavaScript中,所有在函数作用域内的变量和函数声明都会被提升到当前作用域的顶部。这意味着你可以在声明之前使用它们。

然而,这只是表面上的现象,实际上,JavaScript引擎并不真的将变量或函数移动到代码的顶部。而是先创建了一个变量或函数的引用,在执行阶段再给它们赋值或定义内容。

有两种类型的变量声明:varletconst。其中,只有var声明的变量会发生变量提升。letconst 声明的变量也会经历所谓的“暂时性死区”(Temporal Dead Zone, TDZ),在这个区域内,虽然变量已经声明但还没有初始化,尝试访问这些变量会导致错误。

以下是一个关于变量提升的例子:

console.log(myVar); // 输出: undefined

var myVar = 5;

console.log(myVar); // 输出: 5

在这个例子中,尽管myVar是在console.log之后声明的,但是由于变量提升,这个声明被移到了顶部。因此,第一个console.log输出的是undefined,因为在真正赋值之前,变量已经被声明了。

注意:虽然函数声明也被提升,但函数表达式不会被提升。例如:

console.log(myFunction); // 输出: undefined

// 函数声明被提升
function myFunction() {
   
    console.log('Hello');
}

// 而函数表达式不会被提升
var myOtherFunction = function() {
   
    console.log('World');
};

console.log(myOtherFunction); // 输出: function() {...}

在这个例子中,myFunction是通过函数声明创建的,所以它的声明被提升到了顶部,而myOtherFunction是通过函数表达式创建的,因此不会被提升。

相关文章
|
2天前
|
JavaScript 前端开发
js 变量作用域与解构赋值| 22
js 变量作用域与解构赋值| 22
|
1天前
|
缓存 JavaScript 前端开发
了解js基础知识中的作用域和闭包以及闭包的一些应用场景,浅析函数柯里化
该文章详细讲解了JavaScript中的作用域、闭包概念及其应用场景,并简要分析了函数柯里化的使用。
了解js基础知识中的作用域和闭包以及闭包的一些应用场景,浅析函数柯里化
|
25天前
|
JavaScript 前端开发
JavaScript基础知识-作用域(action scope)
关于JavaScript基础知识中作用域的介绍。
26 1
JavaScript基础知识-作用域(action scope)
|
23天前
|
JavaScript 前端开发
JavaScript 作用域
JavaScript 作用域
23 9
|
29天前
|
JavaScript 前端开发
使用 let 将有助于避免 JavaScript 中各种 var 引起的作用域问题。
这段内容介绍了JavaScript编程时的一系列最佳实践,包括使用`===`而非`==`进行比较、以`let`和`const`取代`var`定义变量、始终使用分号、采用合适的命名规范、利用模板字符串拼接、偏好ES6箭头函数、在控制结构中使用大括号、减少代码嵌套、应用默认参数、正确使用`switch`语句中的`break`与`default`分支、避免通配符导入以及简化布尔判断和避免不必要的三元运算符。遵循这些规则有助于提升代码的清晰度和可维护性。
16 2
|
28天前
|
JavaScript 前端开发
|
前端开发 JavaScript 编译器
|
2月前
|
JavaScript Java 测试技术
基于springboot+vue.js+uniapp的客户关系管理系统附带文章源码部署视频讲解等
基于springboot+vue.js+uniapp的客户关系管理系统附带文章源码部署视频讲解等
73 2
|
2月前
|
JavaScript Java 测试技术
基于springboot+vue.js+uniapp的宠物援助平台附带文章源码部署视频讲解等
基于springboot+vue.js+uniapp的宠物援助平台附带文章源码部署视频讲解等
65 4
|
2月前
|
JavaScript Java 测试技术
基于springboot+vue.js+uniapp的宠物交易平台附带文章源码部署视频讲解等
基于springboot+vue.js+uniapp的宠物交易平台附带文章源码部署视频讲解等
58 4