首先说说call、apply和bind的作用吧：

它们的作用都是相同的，都是动态的修改当前函数内部环境对象this的指向。

call、apply和bind区别：

        相同点：

                作用相同，都是动态修改this指向；都不会修改原先函数的this指向。

        异同点：

（1)执行方式不同：

        call和apply是改变后页面加载之后就立即执行，是同步代码。

        bind是异步代码，改变后不会立即执行；而是返回一个新的函数。

  

（2)传参方式不同：

        call和bind传参是一个一个逐一传入，不能使用剩余参数的方式传参。

        apply可以使用数组的方式传入的，只要是数组方式就可以使用剩余参数的方式传入。

  <script>
    const arr = [1, 2, 3, 4, 5, 6];
    function fn(...b) {
      let a = b.reduce((sum, item) => sum += item, 0);
      console.log(this, b, a);
    };
    fn(...arr); //window

    const obj = {
      name: '张三',
    };

    fn.call(obj, 1, 2); //obj
  </script>

  <script>
    function fn(a, b) {
      console.log(this, a + b);
    };
    fn(1, 2); //window

    const obj = {
      name: '张三',
    };

    fn.apply(obj, [3, 4]); //obj
  </script>

  <script>
    function fn(a, b) {
      console.log(this, a + b);
    };
    fn(1, 2); //window

    const obj = {
      name: '张三',
    };

    let newfn = fn.bind(obj); //obj
    newfn(5, 6);
  </script>

(3)修改this的性质不同：

        call、apply只是临时的修改一次，也就是call和apply方法的那一次；当再次调用原函数的时候，它的指向还是原来的指向。

  <script>
    function fn() {
      console.log(this);
    };
    fn(); //window

    const obj = {
      name: '张三',
    };

    fn.call(obj);
    fn.apply(obj);
    fn();
  </script>

        bind是永久修改函数this指向，但是它修改的不是原来的函数；而是返回一个修改过后新的函数，此函数的this永远被改变了，绑定了就修改不了。

  <script>
    function fn() {
      console.log(this);
    };
    fn(); //window

    const obj = {
      name: '张三',
    };

    let newfn = fn.bind(obj); //obj
    newfn();
    fn();
  </script>