call(), .apply() .bind() 的区别和作用?bind 方法如何来实现?

call、apply、bind都可以改变this指向,区别在于 参数传递方式不同,call、apply是立即执行bind不是立即执行。

 function fn(...args){

        console.log(this,args);

    }

 

    fn(1,2);  // fn函数默认this指向是 window对象

    let obj = {

        myname:"张三"

    }

    fn.call(obj,1,2);  // this 会变成 传入的obj ,args 会变成[1,2];

    fn.apply(obj,[1,2]); // this会变成传入的obj ,传入的参数必须是一个数组;

    fn.bind(obj)(1,2); // this 也会变成传入的obj ,bind不是立即执行需要执行一次

bind实现如下:

Function.prototype.myBind = function (context) {

   // 判断调用对象是否为函数

   if (typeof this !== "function") {

     throw new TypeError("Error");

   }

 

   // 获取参数

   var args = [...arguments].slice(1),

     fn = this;

 

   return function Fn() {

 

     // 根据调用方式,传入不同绑定值

     return fn.apply(this instanceof Fn ? new fn(...arguments) : context, args.concat(...arguments));

   }

 

 }

上一篇:bind函数详解


下一篇:vue基本语法1