call，apply 和bind 的区别

     //call
const obj = {
  uname: 'pink'
}
function fn(x, y) {
  console.log(this) // 指向window
  console.log(x + y);
}
//  让他指向obj
// fn()
fn.call(obj, 1, 2)
//可以让fn函数里面this指向obj
// console.log('-----------------------------');
 // apply 
   const obj1 = {
     age: 18
   }
   function fn1(x, y) {
     console.log(this);  // 改变this指向obj1
     console.log(x + y);
   }
   fn1.apply(obj1, [1, 2])

   // 3. 返回值 本身就是在调用函数，所以返回值就是函数得返回值

   // 使用场景：可以借助apply 求数组得最大值
   // const max = Math.max(1, 2, 3)

   const max = Math.max.apply(Math, [1, 5, 6])
   const min = Math.min.apply(Math, [1, 5, 6])

   console.log(max, min);

   // 展开运算符求最大值
   const arr = [2, 4, 5, 5454, 656, 23]
   console.log(Math.max(...arr)); 

// bind（） 改变this指向 不会调用函数 
const obj = {
  name: 'pink'
}
function fn() {
  console.log(this);
}

// 1.不会调用函数
// 2.能改变this指向
// fn.bind()

// 3.返回值是个函数 但是这个函数里面this是更改过得obj
const fun = fn.bind(obj)
fun()

// 需求：有一个按钮，点击立马禁用 2秒钟后开启
const btn = document.querySelector('button')
btn.addEventListener('click', function () {
  // 禁用按钮
  btn.disabled = true

  // 2秒钟后开启 这里如果用this，就不能用普通函数 

  // setTimeout(() => {
  //   // btn.disabled
  //   this.disabled = false
  // }, 2000)

  // 用bind改变this指向 如果用call 或者apply 会立刻调用函数
  setTimeout(function () {
    this.disabled = false
  }.bind(this), 2000)
})

// 相同点：都可以改变函数内部的this指向

//  三个方法得区别：
// 1.call 和apply 会调用函数 ，并且改变函数内部this指向
// 2. call 和apply 传递的参数不一样，call传递参数aru1,形式，apply必须用数组形式[arr]
// 3.bind 不会调用函数，可以改变函数内部的this指向


// 主要应用场景：
//  call 调用函数并且可以传递参数
//  apply 经常和数组有关系，比如借助数学对象Math 求最大值或最小值
// bind 不会调用函数，可以改变函数内部的this指向比如定时器内部的this指向