JavaScript作用域

337 阅读3分钟

作用域

作用域指的是变量能够被访问到的范围

Javascript中作用域分为局部作用域全局作用域以及es6中新增的块级作用域

局部作用域

在js中函数中定义的变量叫做局部变量,这个时候只能在函数内部才能访问到它,所以它的作用域也是函数的内部,称为局部作用域

function getName () {
	var name = '一个奕'
  console.log(name) //一个奕
}
console.log(name)  //undefined

上面例子中 name 这个变量是在函数 getName中进行定义的,所以name是一个局部的变量,它的作用域就是在getName这个函数里边也称作局部作用域,除了这个函数内部,其他地方都是不能访问到它的。同时,当这个函数被执行完之后,这个局部变量也是相应会被销毁了。所以你会看到在getName函数外面的nameundefined的。


全局作用域

在js中,在函数外面定义的变量就称作全局变量,全局变量是挂载在window对象下的变量,所以在网页中的任何位置你都可以访问到这个全局变量

var globalName = '全局的一个奕'
function getName(){
	console.log(globalName)  //全局的一个奕
  var name = '局部的一个奕'
  console.log(name) //局部的一个奕
}
getName()
console.log(name) //undefined
console.log(globalName)  //全局的一个奕


function setName(){
	vName = '没有定义而被直接赋值'
}
setName()
console.log(vName)  //没有定义而被直接赋值
console.log(window.vName)   //没有定义而被直接赋值

从上面的例子中我们可以看到

1、globalName 这个变量它无论在什么地方都是可以被访问到的,所以它就是全局变量,而作为局部变量name 他是不具备这种能力的。

2、在js中所有没有经过定义就直接被赋值的变量它默认就是一个全局变量,就像上面例子中的vName

3、我们可以发现全局变量也是拥有全局的作用域,无论你何处都可以使用它,你可以在浏览器控制台输入window,这个时候就可以看到window的所有全局变量,包括上面我们加入的globalName以及vName

4、全局作用域有相应的缺点,当我们定义很多的全局变量的时候会容易引起命名的冲突,程序具有高度耦合性的缺点,所以我们在定义变量的时候应该注意作用域的问题

块级作用域

在ECMAScript 6(简称e6)中新增了块级作用域,使用let定义的变量只能在块级作用域中被访问,有暂时性死区的特点,也就是说在变量在定义之前是不能被使用的。

什么是块级作用域呢,例如我们的if语句以及for语句中的{...} 这就是块级作用域。

console.log(abc) //abc is not defined
if(true){
   let abc = '嘿嘿~'
   console.log(abc)  //嘿嘿~
}
console.log(abc) //abc is not defined

从上面可以看出变量abc是在if的{...}中由let 进行定义的,所以他的作用域是{...},而在外面进行访问abc是会报错的,因为这里不是他的作用域,所以告诉你这个abc并没有定义。