改变this指向的三种方法,call()、apply()、bind()

this指向的疑难点
改变this指向的三种方法,call()、apply()、bind()及各自的用法和应用场景

<script>
   //1 call()方法
   const obj={
    name:'张三',
    age:18
   }
   function fn(a,b){
     console.log("call方法de this指向",this);//Object
     console.log(a+b);//9
   }
   fn.call(obj,3,6)//调用函数并改变this指向

   // call 的主要作用可以实现继承
   function Person(name,age,gender){
     this.name=name;
     this.age=age;
      this.gender=gender
   }
   function Student(name,age,gender){
     Person.call(this,name,age,gender)
   }
   var s=new Student("张三",18,"male");
   console.log(s,typeof s);//Student {name: "张三", age: 18, gender: "male"}   "object"
/* ---------------------------------------------------------------- */
   //2 apply()方法
   function fn2(arr){
    console.log(this);//Object   
    console.log(arr,typeof arr);//1 "number"注意此处*****************************
    console.log([1,2,3]);//(3) [1, 2, 3]
   }
   fn2.apply(obj,[1,2,3]) // (1). 也是调用函数 第二个可以改变函数内部的this指向
                          // (2). 但是他的参数必须是数组(伪数组)

    // (3). apply 的主要应用 比如说我们可以利用 apply 借助于数学内置对象求数组最大值******** 
        // Math.max();
        var numarr=[3,6,8,68,86]
        var max=Math.max.apply(Math,numarr)
        var min = Math.min.apply(Math,numarr)
        console.log(max,min);//86 3
/* ---------------------------------------------------------------- */
        //3 bind()方法
        function fn3(a,b){
          console.log(this);//{name: "张三", age: 18}
          console.log(a+b);//9
        }
        //1. 不会调用原来的函数   可以改变原来函数内部的this 指向
        // 2. 返回的是原函数改变this之后产生的新函数
        var newfn=fn3.bind(obj,3,6);//用一个新函数来接收
        newfn();
        // 应用:3. 如果有的函数我们不需要立即调用,但是又想改变这个函数内部的this指向此时用bind
 </script> 

【call apply bind 总结】
【相同点: 】
都可以改变函数内部的this指向.
【区别点: 】
call 和 apply 会调用函数, 并且改变函数内部this指向.
call 和 apply 传递的参数不一样, call 传递参数 aru1, aru2…形式 apply 必须数组形式[arg]
bind 不会调用函数, 可以改变函数内部this指向.
【主要应用场景: 】
call 经常做继承.
apply 经常跟数组有关系. 比如借助于数学对象实现数组最大值最小值
bind 不调用函数,但是还想改变this指向. 比如改变定时器内部的this指向.

  • 1
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值