前端工程师地基 深入理解闭包 作用域 立即执行函数

闭包

一、作用域初探

作用域定义：变量（变量作用于又称上下文）和函数生效（能被访问）的区域
互相嵌套的函数，里面可以访问外面的，外面不能访问里面

外面不访问里面演示：

var a = 123;
function test() {
   
    var b = 123;
}
test();//
document.write(b);

里面能访问外面演示：

var a = 123;
function test() {
    var b = 0;
    function demo() {
        var c = 234;
        console.log(b);//0
        console.log(a);//123
    }
    demo();
    // document.write(c);//报错
}
test();

二、js运行三部曲

JS逼格：单线程；解释性语言

语法分析，通篇扫描----->预编译------->解释执行

1.预编译

引入demo

var a = 123;
console.log(a);//123

console.log(a);
var a = 123;//undefined

函数声明整体提升

function test(){}

变量 声明提升

var a;
document.write(a);
a = 123;
//var a  = 123;相当于var a;a = 123

两句话不能解决的问题

console.log(a);
function a(a){
    var a = 234;
    var a = function(){	
    }
    a();
}
var a = 123;

预编译前奏：

1.imply global 暗示全局变量：即任何变量，如果变量未经声明就赋值，此变量就为全局对象window所有。

function test(){
    var a = b =1;
    //先b赋值1(未声明)，在声明a，在赋值a	
}
test();
//var a = 123;先声明a,后赋值 
console.log(window.a);
console.log(window.b);

2.一切声明的全局变量，全是window的属性。
window就是全局的域；window就是全局：

var a = 123;
console.log(a);//---->window.a等价
var a = 123;
window {
   
    a : 123 //相当
}

经典demo

function test() {    var a = b = 123;}test();console.log(window.b);//undefined，局部，不是全局console.log(a);

声明局部变量不行demo

function test(){    var b = 123;}test();console.log(window.b);console.log(b);

预编译四部曲

预编译发生在函数执行的前一刻

1.创建AO对象(Activation object)执行期上下文
2.找形参和变量声明，将变量和形参名作为AO属性名，值为undefined
3.将实参值和形参统一（GO没有）
4.在函数体里面找函数声明，值赋予函数体

例子1

function fn(a){    console.log(a);    // function a(){}    var a = 123;    // var a看过了不看了 直接a=123;    console.log(a);    // 123    function a(){}    // 早已看过不看了    console.log(a);    // 123    var b=function(){}//叫函数表达式    // var b不用看了，看过了，直接b=function(){}    console.log(b);    // function(){}    function d(){}}fn(1);

例子2

function test(a,b) {    console.log(a);    c = 0;    var c;    a = 3;    b = 2;    console.log(b);    function b() {}    function d() {}    console.log(b);}test(1);// 答案122

例子3

function test(a, b) {    console.log(a);    console.log(b);    var b = 234;    consol