作用域，作用域链&&闭包
作用域&&作用域链
作用域
全局作用域: 最外层函数定义的变量拥有全局作用域，即对任何内部函数来说，都是可以访问的
var outerVar = "outer";
function fn(){
console.log(outerVar);
}
fn();//输出：outer
|注意： 只要函数内定义了一个局部变量，函数在解析的时候都会将这个变量“提前声明”
var scope = "global";
function fn(){
console.log(scope);//undefined 没有输出global是因为下面定义的scope变量提升了
var scope = "local";
console.log(scope);//result:local;
}
fn();
局部作用域： 局部作用域一般只在固定的代码片段内可访问到，而对于函数外部是无法访问的。
|注意： 函数内部声明变量的时候，一定要使用var，否则实际上声明了一个全局变量
function fn(){
var inner = "inner";
}
fn();
console.log(innerVar);//inner is not defined =>inner在函数内部被定义
作用域与执行上下文的区别
|局部作用域在函数定义时就确定了；函数执行上下文是在调用函数时，函数体代码执行时确定
|作用域是静态的，只要函数定义好了就一直存在，且不会再发生变化；上下文环境是动态的，函数调用结束后上下文环境会被释放
|上下文环境（对象）从属于所在的作用域
作用域链
首先在当前作用域下的执行上下文查找，若没有则在上一级作用域的执行上下文查找，没有找到则重复此操作，直到全局作用域，全局也没有则报错
var x = 10
function fn(){
console.log(x) //在fn里找x fn里没有在全局找 =>10 与show里的20无关
}
function show(f){
var x= 20
f()
}
show(fn) //传函数fn
var fn = function(){
console.log(fn)
}
fn() //可以输出fn函数
var obj = {
fn2:function(){
console.log(fn2)
}
}
obj.fn2() //报错：fn2 is not defined => 需要修改成this.fn2才可以找到fn2这个函数
闭包
定义
当一个内部函数被调用，就会形成闭包，闭包就是能够读取其他函数内部变量的函数 （内部函数引用了外部函数的数据/函数）； 可以理解成“函数中的函数“
function f1(){
var m = 10;
function f2(){
console.log(m); // 10
}
f2()
}
f1()
使用
1.可以读取自身函数外部的变量（沿着作用域链寻找）
2.让外部变量始终保存在内存中 （用一个变量指向它）
常见的闭包
1.将函数作为另一个函数的返回值（不知道我的理解对不对）
function fn1(){
var a=2
console.log('111')
function fn2(){
a++
console.log(a)
}
return fn2
}
var f = fn1() //只会输出111
//加上这两行代码 => 产生两个闭包
f() //3 相当于将fn2 return了给f =>fn1()() 不会输出111
f() //4 闭包不会消失(因为f指向了fn2) 在原来的基础上+1
2.将函数作为实参传递给另一个函数调用
function showDelay(msg,time){
setTimeout(function(){
alert(msg) //可以alert
},time)
}
showDelay('qwq',1000)
生命周期
产生：在嵌套内部函数定义执行完时产生（不是调用）
死亡：嵌套的内部函数成为垃圾对象（上述例子，令f = null ）
应用：自定义JS模块
var myfun = fn1()
function fn1() {
var m='我的模块1';
function a() {
console.log(m+'：a函数');
}
function b() {
console.log(m+'：b函数');
}
return {
a:a,
b:b
};
}
myfun.a()
myfun.b()
(function(){
var m='我的模块1';
function a() {
console.log(m+'：a函数');
}
function b() {
console.log(m+'：b函数');
}
window.myfun = {
a:a,
b:b
}
})()
myfun.a()
myfun.b()
以上两种方式都可以建立模块，第二种方式更加简单一些，不需要执行函数（fn1）就能得到闭包
内存溢出与内存泄漏
闭包缺点：函数执行完后，局部变量未释放，占用内存时间变长，容易造成内存泄漏
内存泄漏程序还能正常运行，内存溢出会崩溃
内存溢出
程序运行需要的内存超过了剩余的内存
内存泄漏
|占用的内存没有及时释放
|内存泄漏积累过多 => 内存溢出
|常见的内存泄漏：
1.意外的全局变量
2.没有及时清理计时器或回调函数
3.闭包
测试题
var name = "window"
var object = {
name:"my object",
getName: function(){
return function(){
return this.name
}
}
}
alert(object.getName()()) //window 直接执行return function那个函数 相当于window调用 =>this是window
var name = "window"
var object = {
name:"my object",
getName: function(){
var that = this
return function(){
return that.name
}
}
}
alert(object.getName()()) //my object this依旧是window 但return的是that => object
一道面试题
function fun(n,o){
console.log(o);
return {
fun:function(m){
return fun(m,n);
}
};
}
//问:三行a,b,c的输出分别是什么？
var a = fun(0); a.fun(1); a.fun(2); a.fun(3);//undefined 0 0 0
var b = fun(0).fun(1).fun(2).fun(3);////undefined 0 1 2
var c = fun(0).fun(1); c.fun(2); c.fun(3);//undefined 0 1 1
/*当调用函数的时候，传入的实参比函数声明时指定的形参个数少时，剩下的形参都被设定为undefined
所以调用函数var a=fun(0) o未被定义输出undefined*/
//a的值是调用fun(0)后返回的对象
fun:function(m){
return fun(m,0);
}
//a.fun(1); a.fun(2); a.fun(3) o都为0 所以都输出0
/*b和a的不同在于，var a = fun(0); 之后一直用的是a这个对象，而b每次用的都是上次返回的对象*/
//b = fun(0).fun(1)
function fun(n,o){ //n的值为1，o的值为0
console.log(o);
return {
fun:function(m){
return fun(m,n);//n的值为1
}
};
}
fun(1,0); //输出0，并返回一个对象，这个对象有一个fun的方法,这个方法调用后，会返回外层fun函数调用的结果，并且外层函数的第二个参数是n的值，也就是1 之后同理 返回fun(2,1) fun(3,2)
/*c 与他们的不同，只是var c = fun(0).fun(1); 之后用的是同一个对象罢了,c相当于b与a的结合*/
本文地址：https://blog.csdn.net/YogaLin_qwq/article/details/107544401