1. 使用隐式函数参数

函数中的两个隐含的参数：this、arguments
这两个参数可以像函数体内显示声明的参数一样被正常访问。

• this
  • 表示被调用函数的上下文对象。
• arguments
  • 表示函数调用过程中传递的所有实参

arguments

• arguments是函数的所有实参。
• arguments有数组的特性，但不是真正数组，不可用数组方法,（类数组？NodeList属于类数组）
  • length属性，表示实参的具体个数。
  • arguments[0]，可以用数组下标获取实参的值
  • 转换为数组
    • [...arguments]
    • Array.from(arguments)
• 箭头函数中没有arguments，可以用...params代替

    var s=(...args)=>{ 
        console.log(args)
    } 
    s(1,2,3) // [1, 2, 3]

• arguments作为函数参数的别名
  • 非严格模式
    • 可以作为行参params的别名，修改行参值

    function init(params){
        arguments[0] = 1;
    }
    init(3,4);  //arguments是一个非数组的结构 3，4
    //params原本为3，arguments[0]改为1，则最后params为1
    

  • 严格模式
    • arguments[index]会打印出对应的参数和行参，
    • 修改arguments[index]不会改变行参对应的params值。打印arguments[index]倒是会改变。
    • 只有params自己可以改变自己。
    • use strict开启严格模式

函数上下文：this

代表函数调用相关联的对象，称之为函数上下文。

• this的指向
  • 定义函数的方式
  • 定义函数的位置
  • 函数的调用方式!!!!!!!!!
    • 直接调用
    • 对象方法
    • 构造函数
    • apply和call方法

1. 作为函数直接调用

• 如果一个函数没有作为方法，构造函数、apply、call调用的话，我们称之为函数直接调用。
• 直接调用的this指向
  • 严格模式下，直接调用的this为unfined
  • 非严格模式下，this => window
• 直接调用的表现形式

  //函数声明
  function a(){}; 
  a();
  //函数定义
  var b=funcgtion(){}; 
  b()；
  //函数表达式
  (function (){} ) ()
  //立即执行函数
  

2. 作为方法调用

• 作为某个对象的方法|属性被调用。
• this指向：
  • 当对象是字面量创建，且方法函数为普通函数
    • 事件回调中
      • 方法调用时this应该是当前对象，但在事件回调中，回调函数的this为触发当前事件的元素，所以该回调函数中的方法调用的普通函数被传入隐式this，改变为当前元素。而非对象
        • 此时可以用apply/call/bind来改变回调函数中的this指向
    • 非回调情况下
      • 一般this指向该对象。
  • 当对象是字面量创建，且方法函数为箭头函数时
    • 箭头函数本身没有this，依靠上下文环境
• 方法调用的表现形式

  function afun(){
      return this;//window
  }; 
  afun();//window
  var obj = {
     b : afun
  }
  obj.b();//obj
  //obj的属性引用了全局变量的函数体，但是是通过方法掉用的，所以this为该对象obj，所以可以在对象的属性中引用函数。
  //所以 函数不看定义，看调用！
  

3. 作为构造函数调用

• 目的是创建空对象，将其作为this对象传递给构造函数，初始化对象后作为构造函数的返回值。也称构造函数实例化对象。
• this指向（构造函数实例化对象）：
  • 若构造函数显示返回了一个原始值，实例化对象后，返回该对象。
  • 若构造函数显示返回了一个对象，实例化对象后，返回return的对象，当前对象的this失效

function a(){
    return 'a'
}
const ao=new a()
ao //a {}

function v(){
    return {a:1}
}
new v() //{a: 1}

function v(){
    return {
            a:1,
            b:function(){
                    console.log(this)
            }}
}
const obj=new v() 
obj // {a: 1, b: ƒ}
obj.b() // {a: 1, b: ƒ}

• 构造函数调用的表现形式

  function afun(){
      return 1;//window
  }; 
  afun();//1 构造函数作为普通函数调用，正常返回1，没什么意义
  var obj = new afun(); //obj{} 构造函数实例化对象，返回该对象
  //注意：
  //构造函数显式的返回原始值，对实例化对象没有影响。
  //但显式的返回对象，实例化对象后的变量，返回是return的对象。
  //构造函数只有在实例化对象后，才有意义，将构造函数直接调用没意义。
  
  //构造函数实例化对象时发生了什么：
  //创建空对象
  //this指向为空对象
  //对象实例化并返回，除了上述的构造函数显式的返回了一个对象的情况外。
  
  

• 构造函数的命名约定
  • 通常以描述所构造的对象的名词命名
  • 大写字母开头，例：Ninja；
  • 但这只是约定。

4. 使用apply/call调用

显式的修改函数的上下文，将this赋给指定对象。我们可以使每个函数上用apply和call完成。
二者唯一区别是，参数列表的形式。

• apply方法调用
  • 传参2个：function.apply(指定this的对象，传参数组)
• call调用
  • 传参n个：function.call(指定this的对象，params1，params2，params2)

p75例子，构造函数实例化对象后，对象方法在调用时，修改不了对象的属性。
原因是对象方法是在[事件回调函数中被调用的，this被改变为触发事件的元素]。（对象方法是普通函数定义）

注意：p80实现foreach迭代方法展示如何设置函数上下文例子

【构造函数实例化对象】后，对象方法若是箭头函数定义。
箭头函数没有单独的this，在定义时与上下文this一致。
故，构造函数中的箭头函数在被实例化后，this被定义为实例化后的对象。
无论怎么调用箭头函数的这个方法，都不会被传入和改变this对象。

注意区分，【对象方法】而非【构造函数实例化对象】，中定义箭头函数时，此时的this为window

5. 解决函数this上下文的问题

• 使用箭头函数
  • 箭头函数没有单独的this，在定义时与上下文this一致。
  • 调用箭头函数时，不会隐式传入this
  • 箭头函数的this
    • 对象中，window
    • 实例化的对象，是对象。且不会隐式传入this
• 使用bind
  • 创建并返回一个与原函数相同的新函数，并指定新函数的this上下文。
    • button.click.bind(button)将button.click方法copy一份，将this改为button对象。
      `

回到本章的问题，为一个或多个按钮设置是否单击的状态。【单击意味着事件回调，会隐式的传入this】

• 一个 =>【对象】
  • 对象的方法要用普通函数，而不是箭头函数，箭头函数的this不知道是否可以被改变，因为他不会隐式传入this
  • 对象的方法用普通函数，会被事件回调更改this指向，可以用apply、call、bind改变this指向。
• 多个 =>【构造函数】
  • 箭头函数，因为实例化时被定义好了this，并且不会被隐式传入this，可以规避被事件回调改变this的问题。
  • 普通函数，可以用apply、call、bind改变this指向。
    • apply、call改变原来函数的this，bind创建一个与原来一样的函数，并指定this对象