js中改变this的指向，有apply，call和bind这三种方法

最新推荐文章于 2024-07-20 23:54:17 发布

YuTao_X

最新推荐文章于 2024-07-20 23:54:17 发布

阅读量54

点赞数 1

文章标签： javascript 开发语言前端 vscode

本文链接：https://blog.csdn.net/YuTao_X/article/details/131361141

版权

这三个方法的主要目的都是改变this指针的指向。

apply和call都是在调用函数本身的同时把要付给this指针的对象传递进去，不过他两的语法不同。

apply的使用语法
- 函数名字.apply(对象,[参数1,参数2,...]);
- 方法名字.apply(对象,[参数1,参数2,...]);
call的使用语法
- 函数名字.call(对象,参数1,参数2,...);
- 方法名字.call(对象,参数1,参数2,...);

/函数的调用,改变this的指向
    //    function f1(x,y) {
    //      console.log((x+y)+":===>"+this);
    //      return "这是函数的返回值";
    //    }
    //    //apply和call调用
    //    var r1=f1.apply(null,[1,2]);//此时f1中的this是window
    //    console.log(r1);
    //    var r2=f1.call(null,1,2);//此时f1中的this是window
    //    console.log(r2);
    //    console.log("=============>");
    //    //改变this的指向
    //    var obj={
    //      sex:"男"
    //    };
    //    //本来f1函数是window对象的,但是传入obj之后,f1函数此时就是obj对象的
    //    var r3=f1.apply(obj,[1,2]);//此时f1中的this是obj
    //    console.log(r3);
    //    var r4=f1.call(obj,1,2);//此时f1中的this是obj
    //    console.log(r4);


//方法改变this的指向

    //    function Person(age) {
    //      this.age = age;
    //    }
    //    Person.prototype.sayHi = function (x, y) {
    //      console.log((x + y) + ":====>" + this.age);//是实例对象
    //    };
    //
    //    function Student(age) {
    //      this.age = age;
    //    }
    //    var per = new Person(10);//实例对象
    //    var stu = new Student(100);//实例对象
    //    //sayHi方法是per实例对象的
    //    per.sayHi.apply(stu, [10, 20]);
    //    per.sayHi.call(stu, 10, 20);

而bind则是复制函数并改变this指向

bin的使用语法

函数名字.bind(对象,参数1,参数2,...);---->返回值是复制之后的这个函数
方法名字.bind(对象,参数1,参数2,...);---->返回值是复制之后的这个方法

function Person(age) { 
     this.age=age;
    }
    Person.prototype.play=function () {
      console.log(this+"====>"+this.age);
   }; 

function Student(age) {
     this.age=age; 
   }
 var per=new Person(10);
 var stu=new Student(20); 
   //复制了一份
 var ff=per.play.bind(stu); 
  ff();