js 知识点 实用 与面试汇总

作用域 scope

 

什么是作用域 ？

某个方法或者变量，可以在特定的区域内才能起到作用（够被访问或调用 ）。而这个范围，就是这个方法或者变量的作用域。

分类：

全局作用域

局部作用域

W3C的解释是

全局 JavaScript 变量

函数之外声明的变量，会成为全局变量。

全局变量的作用域是全局的：网页的所有脚本和函数都能够访问它。

但是博主感觉。全局变量和局部变量，可以理解为两个相对概念。而真正意义上的全局变量，只有程序创建时的初始对象上，所挂载的变量。（浏览器的windows对象下的属性 vue中的Vue对象下的属性。。。）而在日常交流中，大家会根据自己的理解去定义和阐述全局和局部两个概念。

如：在页面开发过程中。我们会把页面最外层的变量说成全局变量。其实真正的意义是相对本页面内的全局变量，只是临时挂在到了windows上 ，在页面跳转 刷新等操作时都会改变，所以这种变量只能停留在当前页面。在页面更新或者销毁时他也会随之消失。即使 本页面使用window.XXX 创建变量 也是一样 或者可以叫他临时全局变量。这样解释可能更加明确，当然也更加矫情。

 

上面主要是阐述了一些作用域的一些基本概念

下面我们开始用一些实例阐述和验证一些知识点

var a="测试变量A"
	b="测试变量B"
function test(){
	console.log("这是变量a--",a)
	console.log("这是变量b--",b)
	console.log("这是变量win.a--",window.a)
	console.log("这是变量win.a--",window.b)
}
test()

打印结果：

由此可见其实在当前页面是被window对象包裹的，内部创建的变量也会直接挂在到，当前页面的window对象上的临时全局变量，可以在本页直接使用。当跳转以后统一销毁。

 

 var a="测试变量A"
function test(){
    console.log("这是变量a--",a)
	console.log("这是变量win.a--",window.a)
	a=5
	console.log("这是变量a--",a)
	console.log("这是变量win.a--",window.a)
	var a=""
	console.log("这是变量a--",a)
	console.log("这是变量win.a--",window.a)
}
test()

打印结果：

这就是作用域和变量提升的的典型表现。其实上面的代码最后的表现形式是

当局域变量内有同名变量时，（根据就近原则）优先使用局域变量。类似于css的权重 。而第一次的打印之所有没有打印是因为在局域变量内的a还未定义，但是在代码预编译阶段会识别到在同层作用域内有同名变量从而舍弃了最外层的全局变量。

 

 

 

function a1(){
		a=100
}
a1()
console.log(a)

特性 从外向内传递  同级相互协调  变量有先后顺序 函数一般没有先后顺序（里面涉及到预编译/预加载的相关知识以后作者会更新相关文章）

 

函数调用有效

function a(){
    console.log("aaaa")
    b()
}
function b(){
    console.log("bbbbbbbbbb")
}
a()

//aaaa
// bbbbbbbbbb

 

利用let特性定义所有 局部变量互不影响

let a=10
function ac(){
	let a=1
	console.log(a)
}
{
	let a=100
	console.log(a)
}
ac()
console.log(a)


//100
//1
//10

作用域的提升 let局部变量提升只可以提升一次  而且不可能超过最初定义范围

 

防抖和节流