前端基础知识总结---JS高级篇(2)_函数高级

缺乏、安全感 2022-09-10 15:13 253阅读 0赞

# 1. 原型与原型链 #

## 1). 什么是原型对象: ##

1. 每个函数都有一个prototype属性，该属性指向的是原型对象(显示原型对象)
    2. 每个实例对象身上都有一个__proto__属性，该属性指向的也是原型对象(隐式原型对象)
    3. 构造函数的显示原型 === 当前构造函数实例对象的隐式原型对象
    4. 原型对象的本质： 普通的Object实例

## 2). 什么是原型链 ##

1. 查找对象的属性的时候现在自身找，如果自身没有沿着__proto__找原型对象
    2. 如果原型对象上还没有，继续沿着__proto__,直到找到Object的原型对象
    3. 如果还没有找到返回undefined
    4. 原型链： 沿着__proto__查找属性(方法)的这条链就是原型链

# 2. 执行上下文与执行上下文栈 #

## 1). 变量提升与函数提升 ##

1. js引擎在js代码正式执行之前会做一些预解析的工作
    2. 找关键字： var， function
    3. 找到var以后将var后边的变量提前声明，但是不赋值 var a;
    4. 找到function以后定义对应的函数，也就是说函数在预解析的时候已经定义完毕
    5. 预解析： 全局预解析，局部预解析
    6. 注意：
        - 全局预解析在定义函数的时候不关心函数是否被使用
        - 函数局部预解析的时候如果内部函数没有被使用就不会提前定义

## 2). 理解 ##

1. 理解： 
        - 执行上下文抽象的概念，代表了代码执行的环境，包含： 执行环境，变量对象，this，作用域链
    2. 流程：
        - js引擎在js代码正式执行之前会先创建一个执行环境(开发商批的地，工程队施工的环境)
        - 进入该环境以后创建一个变量对象(打地基)，该对象用于收集当前环境下的： 变量，函数，函数的参数，this
            - 找关键字var ，function
        - 确认this的指向
        - 创建作用域链
    3. 重点：
        - 执行上下文是动态创建的
        - 尤其是针对函数，每调用一次函数都会创建一次执行上下文
    执行上下文栈: 用来管理产生的多个执行上下文

## 3). 分类: ##

全局: window
    函数: 对程序员来说是透明的

## 4). 生命周期 ##

全局 : 准备执行全局代码前产生, 当页面刷新/关闭页面时死亡
    函数 : 调用函数时产生, 函数执行完时死亡

## 5). 包含哪些属性: ##

全局 : 
        用var定义的全局变量  ==>undefined
        使用function声明的函数   ===>function
        this   ===>window
    函数
        用var定义的局部变量  ==>undefined
        使用function声明的函数   ===>function
        this   ===> 调用函数的对象, 如果没有指定就是window 
        形参变量   ===>对应实参值
        arguments ===>实参列表的伪数组

## 6). 执行上下文创建和初始化的过程 ##

全局:
        在全局代码执行前最先创建一个全局执行上下文(window)
        收集一些全局变量, 并初始化
        将这些变量设置为window的属性
    函数:
        在调用函数时, 在执行函数体之前先创建一个函数执行上下文
        收集一些局部变量, 并初始化
        将这些变量设置为执行上下文的属性

# 3. 作用域与作用域链 #

## 1). 理解: ##

作用域:    
       - 抽象的概念
       - 用来决定代码执行的范围， 变量所属的范围
       - 作用域是代码定义的时候决定的
       - 作用域作用：
         - 隔离变量
         - 规定其之后的作用域链是什么样的，体现： [[scopes]]: 上一级作用域链
    作用域链: 
       - 作用域链是一个链表结构
       - 该结构内保存的是一个个的变量对象
       - 作用域链什么时候创建的：在js代码正式执行之前创建的

## 2). 分类: ##

全局
    函数
    js没有块作用域(在ES6之前)

## 3). 作用 ##

作用域: 隔离变量, 可以在不同作用域定义同名的变量不冲突
    作用域链: 查找变量

## 4). 区别作用域与执行上下文 ##

作用域: 静态的, 编码时就确定了(不是在运行时), 一旦确定就不会变化了
    执行上下文: 动态的, 执行代码时动态创建, 当执行结束消失
    联系: 执行上下文环境是在对应的作用域中的

# 4. 闭包 #

## 1). 闭包形成的条件: ##

- 函数嵌套
       - 内部函数引用外部函数的局部变量
       - 内部函数被使用，注意： 函数变量提升的时候如果内部函数没有被使用，在预解析的过程中不会定义内部函数

## 2). 什么是闭包: ##

- 闭包是一个存在内部函数的引用关系
       - 该引用指向的是外部函数的局部变量对象(前提是内部函数使用了外部函数的局部变量)

## 3). 写一个闭包程序 ##

function fn1() {
      var a = 2;
      function fn2() {
        a++;
        console.log(a);
      }
      return fn2;
    }
    var f = fn1();
    f();
    f();

## 4). 闭包的作用： ##

- 延长外部函数变量对象的生命周期
       - 使用闭包能够间接的从函数外部访问函数内部的私有变量

## 5). 闭包应用: ##

循环遍历加监听: 给多个li加点击监听, 读取当前下标
    模块化: 封装一些数据以及操作数据的函数, 向外暴露一些行为
    JS框架(jQuery)大量使用了闭包

## 6). 闭包的优缺点: ##

- 优点： 延长外部函数变量对象的生命周期
       - 缺点： 延长外部函数变量对象的生命周期(占内存，如果不及时清除容易造成内存溢出，泄漏)
    	 解决: 及时清除闭包 : f = null; //让内部函数对象成为垃圾对象( 内部函数身上没有指针指向)

## 7). 闭包的生命周期： ##

- 产生：在嵌套的内部函数定义执行完时就产生（不是在调用）
       - 死亡：在嵌套的内部函数成为垃圾对象时

# 5. 内存溢出与内存泄露 #

## 1). 内存溢出 ##

一种程序运行出现的错误
    当程序运行需要的内存超过了剩余的内存时, 就出抛出内存溢出的错误

## 2). 内存泄露 ##