1. /**
    2.  * call实现
    3.  * 实现原理：方法内部的this一般在调用时确定，将fn赋值给thisArg的一个方法，
    4.  * 然后执行，之后再将thisArg上的fn删除，最后返回结果
    5.  * apply与此相似
    6.  */
    7. // fn.call(thisArg, 其他参数)
    9. Function.prototype.myCall = function () {
    10.   // 判断拥有myCall的方法是不是函数
    11.   if (typeof this !== 'function') {
    12.     throw new TypeError(`${this} is not a function`)
    13.   }
    15.   const args = [...arguments]
    16.   const thisArg = args.shift() || window
    18.   // 方法内部的this指向在方法调用时确定，指向方法所属的对象thisArg
    19.   thisArg.fn = this
    20.   const result = thisArg.fn(...args)
    22.   // 删除fn
    23.   delete thisArg.fn
    25.   return result
    26. }
    30. /**
    31.  * aplly实现
    32.  */
    35. Function.prototype.myApply = function () {
    36.   // 判断拥有myApply的方法是不是函数
    37.   if (typeof this !== 'function') {
    38.     throw new TypeError(`${this} is not a function`)
    40.   }
    42.   const args = [...arguments]
    43.   const thisArg = args.shift() || window
    45.   // 方法内部的this指向在方法调用时确定，指向方法所属的对象thisArg
    46.   thisArg.fn = this
    47.   const result = thisArg.fn(...args[0])
    49.   // 删除fn
    50.   delete thisArg.fn
    52.   return result
    53. }
    57. /**
    58.  * bind实现
    59.  * 注意：bind最终返回一个函数，作为构造函数使用new调用时，不应该改变this指向，
    60.  *      因为new绑定优先级高于显示绑定和硬绑定，    
    61.  *       new > 显示绑定 > 隐式绑定 > 默认绑定
    62.  * 
    63.  * 实现原理：bind实现依赖于call或者apply，绑定过程分三个步骤
    64.  * 1、返回一个函数
    65.  * 2、参数绑定
    66.  * 3、使用new
    67.  * 
    68.  */
    70. // 效果
    71. function foo(x, y) {
    72.   console.log(this)
    73.   this.x = x
    74.   this.y = y
    75. }
    77. const obj = {
    78.   props: '007'
    79. }
    82. const bindFoo = foo.bind(obj, 'hello')
    84. foo(1, 2) // window
    85. bindFoo('world') // obj
    86. new bindFoo('newWorld')
    88. // 解释：
    89. // a步骤：const bindFoo = foo.bind(obj)相当于指定foo内部的this为obj，并返回一个函数
    90. // b步骤：new bindFoo()，因为new的优先级高于aplly，所以a步骤绑定的this失效，this现在指向new创建的实例
    95. // 实现
    96. Function.prototype.myBind = function () {
    97.   if (typeof this !== 'function') {
    98.     throw new TypeError('Bind must be called on a function')
    99.   }
    100.   const args = [...arguments]
    101.   const thisArg = args.shift()
    102.   console.log('外层', args)
    103.   const selfFn = this
    104.   return function F(...innerArgs) {
    105.     const concatArgs = [...args, ...arguments]
    106.     console.log(this instanceof F)
    107.     return this instanceof F
    108.       ? new selfFn(...concatArgs)
    109.       : selfFn.apply(thisArg, concatArgs)
    110.   }
    111. }
    115. // 测试代码
    116. function foo(x, y) {
    117.   this.x = x
    118.   this.y = y
    119. }
    121. const obj = {
    122.   props: '007'
    123. }
    126. const bindFoo = foo.myBind(obj, 'hello')
    128. foo(1, 2) // window
    129. bindFoo('world') // obj
    130. new bindFoo('newWorld')