javaScript高级（一）

从这周开始，我们开始学习JavaScript高级程序设计的内容，对于本周所学的内容，我做了以下总结。
原型与原型链
原型
1.函数的prototype属性

• 每个函数都有一个prototype属性，它默认指向一个Object空对象（即原对象）
• 原型对象中有一个属性constructor，它指向函数对象
  2.给原型对象添加属性（一般都是方法）
  作用：函数的所有实例对象自动拥有原型中的属性（方法）
  

显式原型和隐式原型
1.每个函数function都有一个portotype，即显式原型（属性）
2.每个实例对象都有一个__proto__,可称为隐式原型（属性）
3.对象的隐式原型的值为其对应构造函数的显式原型的值
4.作用：

• 函数的prototype属性：在定义函数时自动添加的，默认值是一个空Object对象
• 对象的__proto__属性：创建对象时自动添加的，默认值为构造函数的prototype属性值
  
  显示原型与隐式原型的关系
  
  原型链（别名：隐式原型链）
  访问对象属性时，先在自身属性中查找，找到返回如果没有，再沿着__proto__这条链向上查找，找到返回如果最终没有找到，则返回undefined
  原型链的图解
  
  执行上下文与执行上下文栈
  变量提升与函数提升
  1.变量的声明提升
  通过var定义（声明）的变量，在定义语句之前就可以访问到，值为：undefined
  2.函数声明提升
  通过function声明的函数，在之前就可以直接调用，值为：函数定义（对象）
  执行上下文
  1.代码分类（位置）
• 全局代码
• 函数（局部）代码

2.全局执行上下文

• 在执行全局代码前将window确定为全局执行上下文
• 对全局数据进行预处理

• var 定义的全局变量–>undefined,添加为window的属性
• function声明的全局函数–>赋值（fun），添加为window的方法
• this–>赋值（window）

• 开始执行全局代码

3.函数执行上下文

• 在调用函数，准备执行函数体之前，创建对应的函数执行上下文对象（虚拟的，存在于栈中）
• 对局部数据进行预处理

• 形参变量–>赋值（实参）–>添加为执行上下文的属性
• arguments–>赋值（实参列表），添加为执行上下文属性
• var 定义的局部变量–>undefined，添加为执行上下文的属性
• function声明的函数–>赋值（fun），添加为执行上下文的方法
• this–>赋值（调用函数的对象）
  执行上下文栈
  1.在全局代码执行前，js引擎就会创建一个栈来存储管理所有的执行上下文对象
  2.在全局执行上下文（window）确定后，将其添加到栈中（压栈）
  3.在函数执行上下文创建后，将其添加到栈中（压栈）
  4.在当前函数执行完后，将栈顶的对象移除（出栈）
  5.当所有的代码执行完之后，栈中只剩下window
  作用域与作用域链
  作用域

• 指一块空间，代码所在的区域
• 它是静态的（相对于上下文对象），在编写代码时就确定了

分类：

• 全局作用域
• 函数作用域
• 没有块作用域（ES6开始有了）

3.作用：

• 隔离变量，不同作用域下同名变量不会有冲突

作用域与执行上下文的区别
区别1

• 全局作用域之外,每个函数都会创建自己的作用域,作用域在函数定义时就已经确定了,而不是在函数调用时,
• 全局执行上下文环境是在全局作用域确定之后,js代码马上执行之前创建
• 函数执行上下文是在调用函数时,函数体代码执行之前创建

区别2

• 作用域是静态的,只要函数定义好了就一直存在,且不会再变化
• 执行上下文是动态的,调用函数时创建,函数调用结束时就会自动释放

联系

• 上下文环境(对象)是从属于所在的作用域
• 全局上下文环境–>全局作用域
• 函数上下文环境–>对应的函数作用域
  作用域链
  1.理解
• 多个上下级关系的作用域形成的链,它的方向是从下向上的(从内到外)
• 查找变量时就是沿着作用域链来查找的

2.查找一个变量的查找规则

• 在当前作用域下的执行上下文中查找对应的属性,如果有直接返回,否则进入2
• 在上一级作用域的执行上下文中查找对应的属性,如果有直接返回,否则进入3
• 再次执行2的相同操作,知道全局作用域,如果还找不到就抛出找不到的异常

<script>
        /* 作用域链 */
        var a = 1;
        function fn1(){
            var b = 2;
            function fn2(){
                var c = 3;
                console.log(c);
                console.log(b);
                console.log(a);
                console.log(d);  //d未定义,会报错
            }
            fn2();
        }
        fn1();
    </script>

以上为本周我所学内容，下周将继续学习JavaScript高级程序设计的内容，希望能顺利学完。