JavaScript——作用域

本文涉及的产品
云解析DNS,个人版 1个月
全局流量管理 GTM,标准版 1个月
公共DNS(含HTTPDNS解析),每月1000万次HTTP解析
简介: JavaScript——作用域

1.JavaScript 作用域的概念

      在JavaScript中,作用域是一个控制变量、函数和类的作用范围的概念 它决定了变量、函数和类的生命周期,以及它们在代码中的可见性。 理解JavaScript中的作用域对于编写高效、可维护的代码至关重要。

ES6 之前作用域有两种 全局作用域 局部作用域 (函数作用域)

全局作用域 作用于所有代码执行的环境(整个 script 标签的内部)或者一个独立的 js 文件中。

局部作用域 作用于函数内部的代码环境,就是局部作用域。因为跟函数有关系,所以也被称为函数作用域

块级作用域:

块级作用域由 {} 包括

ES6 之前 JS 是没有块级作用域这一概念的,在 if 语句中,使用 var 声明的变量在外部依旧可以使用,如下

if(true){
var  num  =  155172444; console.log(num);  //  155172444
}
console.log(num);  //  155172444
在 ES6 中新增块级作用域这一概念,使用 let 声明的变量在外部将不可使用。
if(true){
let  num  =  10000; console.log(num);  //  10000
}
console.log(num);  //  报错

2.JavaScript 变量的作用域

在 JavaScript 中,根据作用域的不同,变量可以分为两种:全局变量局部变量

全局变量 在全局作用域下声明的变量(var 在函数外部定义的变量)。

局部变量 在局部作用域下声明的变量(var 在函数内部或 let 在 {} 中定义的变量)。

全局变量和局部变量的生命周期

全局变量:在任何一个地方都可以使用,只有在浏览器关闭时才会销毁,因此比较占内存。

局部变量:旨在代码块内部使用,当其所在的代码块被执行时,才会被初始化;当代码块运     行结束后,就会被销毁,因此更节省内存空间。

3.JavaScript 作用域链

作用域链:通过上节作用域我们知道,当我们声明一个函数时,程序会生成一个独立的作用域,如果函数中还有函数,那么在这个作用域中就又可以诞生一个作用域;根据 内部函数可以访问外部函数变量 的这种机制,用链式查找决定哪些数据能被内部函数访问,就称为作用域链。

function  f1(){
let  num  =  123;
function  f2()  {
console.log(  num);  //  123
} f2();
}
let  num  =  456; f1();

注意:作用域链采取就近原则的方式来查找变量最终的值。

4.JavaScript 预解析

预解析相关概念:JavaScript 代码是由浏览器中的 JavaScript 解析器来执行的。JavaScript 解析器在运行 JavaScript 代码的时候分为两步:预解析代码执行

预解析 :在当前作用域下,JS 代码执行之前,浏览器会默认把带有 var 和  function 声明的变量在内存中进行提前声明或定义。

代码执行 :从上往下执行 JS 代码。

预解析会把变量和函数的声明在代码执行之前完成,预解析也叫做变量、函数提升。

相关文章
|
1月前
|
JavaScript 前端开发
js变量的作用域、作用域链、数据类型和转换应用案例
【4月更文挑战第27天】JavaScript 中变量有全局和局部作用域,全局变量在所有地方可访问,局部变量只限其定义的代码块。作用域链允许变量在当前块未定义时向上搜索父级作用域。语言支持多种数据类型,如字符串、数字、布尔值,可通过 `typeof` 检查类型。转换数据类型用 `parseInt` 或 `parseFloat`,将字符串转为数值。
22 1
|
6天前
|
存储 JavaScript 前端开发
第五篇-Javascript作用域
第五篇-Javascript作用域
13 2
|
9天前
|
JavaScript 前端开发
JavaScript 作用域
JavaScript 作用域
12 2
|
1月前
|
JavaScript 前端开发
JavaScript 闭包:让你更深入了解函数和作用域
JavaScript 闭包:让你更深入了解函数和作用域
|
3天前
|
自然语言处理 JavaScript 前端开发
JavaScript闭包是函数访问外部作用域变量的能力体现,它用于封装私有变量、持久化状态、避免全局污染和处理异步操作。
【6月更文挑战第25天】JavaScript闭包是函数访问外部作用域变量的能力体现,它用于封装私有变量、持久化状态、避免全局污染和处理异步操作。闭包基于作用域链和垃圾回收机制,允许函数记住其定义时的环境。例如,`createCounter`函数返回的内部函数能访问并更新`count`,每次调用`counter()`计数器递增,展示了闭包维持状态的特性。
17 5
|
1天前
|
JavaScript 前端开发 开发者
JavaScript的变量提升是一种编译阶段的行为,它将`var`声明的变量和函数声明移至作用域顶部。
【6月更文挑战第27天】JavaScript的变量提升是一种编译阶段的行为,它将`var`声明的变量和函数声明移至作用域顶部。变量默认值为`undefined`,函数则整体提升。`let`和`const`不在提升范围内,存在暂时性死区。现代实践推荐明确声明位置以减少误解。
10 2
|
1天前
|
JavaScript 前端开发
JavaScript作用域关乎变量和函数的可见范围。
【6月更文挑战第27天】JavaScript作用域关乎变量和函数的可见范围。全局作用域适用于整个脚本,局部作用域限于函数内部,而ES6引入的`let`和`const`实现了块级作用域。全局变量易引发冲突和内存占用,局部作用域在函数执行后消失,块级作用域提高了变量管理的灵活性。作用域关键在于组织代码和管理变量生命周期。
10 1
|
3天前
|
JavaScript 前端开发
JavaScript中的变量提升(Hoisting)将`var`声明和函数声明提前到作用域顶部,允许在声明前使用
【6月更文挑战第25天】JavaScript中的变量提升(Hoisting)将`var`声明和函数声明提前到作用域顶部,允许在声明前使用。`let`和`const`不完全提升,存在暂时性死区(TDZ),尝试在初始化前访问会出错。函数声明会被提升,但函数表达式不会。
13 3
|
9天前
|
JavaScript
Vue.js中使用.self修饰符来限制事件处理程序的作用域
Vue.js中使用.self修饰符来限制事件处理程序的作用域
|
10天前
|
自然语言处理 JavaScript 前端开发
【JavaScript】JavaScript基础知识强化:变量提升、作用域逻辑及TDZ的全面解析
【JavaScript】JavaScript基础知识强化:变量提升、作用域逻辑及TDZ的全面解析
16 3