变量的作用域

Posted

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了变量的作用域相关的知识,希望对你有一定的参考价值。

参考技术A

变量的作用域由声明它的位置决定。如果在过程中声明变量,则只有该过程中的代码可以访问或更改变量值,此时变量具有局部作用域并被称为过程级变量。如果在过程之外声明变量,则该变量可以被Script中所有过程所识别,称为Script级变量,具有Script级作用域。

JavaScript 作用域作用域链变量提升

JavaScript 作用域、作用域链、变量提升

作用域、作用域链、自由变量和变量提升
作用域
作用域的定义:所谓作用域就是一个变量可以使用的范围

作用域又分多种

全局作用域
函数作用域
块级作用域(ES6新增)

js中首先有一个最外层的作用域,称为全局作用域
js中可以可以通过函数来创建一个独立的作用域,称为函数作用域,函数可以嵌套,所以作用域也可以嵌套

示例:
let a = 0
function fn1(){
	let a1 = 100 
	function fn2(){
		let a2 = 200
		function fn3(){
			let a3 = 300
			return a + a1 + a2 + a3
		}
		fn3()
	}
	fn2()
}
fn1()

es6中新增了块级作用域(大括号,比如if{}、for(){})

块级作用域只适用于const、let
自由变量
自由变量的概念:当前作用域没有没有定义的变量

一个变量再当前作用域没有定义,但被使用了
向上级作用域一层一层的一次寻找,直至找到为止
如果全局作用域都没有找到,则会报错
示例:(a和b为自由变量)

var a = 100
function fn1(){
	var b = 200
	function fn2(){
		var c = 300
		console.log(a)
		console.log(b)
		console.log(c)
	}
	fn2()
}
fn1()

作用域链
自由变量向上级一层一层的找,直到找到为止,一直找到全局作用域,就形成了作用域链

变量提升(预解析)
var声明的变量,function声明的函数存在变量提升
let和const不会变量提升

js中声明并定义一个变量时,会把声明提前,以下会先打印出undefined,再打印出10

console.log(a)
var a = 10
console.log(a)

相当于

var a
console.log(a)//undefined
a = 10
console.log(a) //10

函数声明也是,以下函数相当于把整个fn提到作用域的最上面,所以调用fn时会正常打印jack

fn('jack')//jack
function fn (name){
console.log(name)
}

不过函数表达式不行,以下是一个函数表达式,JavaScript会把var fn提到作用域最上面,没有吧函数提上去,所以会报错。

fn("jack");//报错
var fn = function(name) {
console.log(name);
};

示例:

  var x = 30;
  function test(){
      console.log(x);
      var x = 10;
      console.log(x);
      x=20;
      function x(){

      };
      console.log(x);
  }
  test();

从上往下,逐步执行:
第一个log(x)中的x向上查找,直至找到预解析池,function x(){},
第二个log(x)中的x向上查找,找到var x=10;, 弹出 10;
第三个log(x)中的x向上查找,找到 x=20;, 弹出 20;

以上是关于变量的作用域的主要内容,如果未能解决你的问题,请参考以下文章

JavaScript 作用域作用域链变量提升

变量的作用域

JavaScript作用域:全局作用域局部作用域块级作用域作用域链变量提升

js 静态作用域和动态作用域

作用域作用域链自由变量变量提升

变量的作用域