zoukankan      html  css  js  c++  java
  • call()、apply()、bind()

    1.均可以改变函数的执行上下文,也就是this值;

    2.call()  apply()

    1 function apply(num1, num2){
    2     return sum.apply(this, [num1,num2]);
    3     }
    4 function call(num1, num2){
    5     return sum.call(this, num1, num2);
    6     }

    参数的第一部分:执行上下文,就是this;

    参数的第二部分:需要传递的参数,可以是一个,也可以为多个;

    apply第二部分需要的是一个数组作为参数;

    call第二部分的参数是数组里面的元素,需要一个一个传,用逗号隔开;

    但是第二部分均可以传arguments;

    如果call和apply的第一个参数写的是null,那么this指向的是window对象。

    1  var a = {
    2        user:"zhangsan",
    3        fn:function(){
    4          console.log(this);//Window {speechSynthesis: SpeechSynthesis, caches: CacheStorage, localStorage: Storage, sessionStorage: Storage, webkitStorageInfo: DeprecatedStorageInfo…}
    5      }
    6  }
    7  var b = a.fn;
    8  b.apply(null);

    3.bind()

    属于es5中的方法,也是用来实现上下文绑定,但是它是新创建一个函数,称为绑定函数,然后把它的上下文绑定到bind()括号中的参数上,然后将它返回;

    4.bind()与call()、apply()最大的区别:bind()不会立即调用,需要加上()来执行,其他两个会直接调用;

    bind方法可以让对应的函数想什么时候调就什么时候调用,并且可以将参数在执行的时候添加,视情况而定。


    1.第一个参数均是this要指向的对象;

    2.都是用来改变函数this对象的指向;

    3.都可以继续传递参数.

    看代码:

    var person = {
        name: 'zhangsan',
        sex: '男',
        say: function(){
            console.log(this.name + ',' + this.sex);
        }
    }
    var other = {
        name: 'lili',
        sex: '女',
    }
    person.say.call(other);//lili,女
    person.say.apply(other);//lili,女
    person.say.bind(other)();//lili,女

    带参数形式:

     1 var person = {
     2     name: 'zhangsan',
     3     sex: '男',
     4     say: function(school,grade){
     5         console.log(this.name + ',' + this.sex + ';' + school + grade);
     6     }
     7 }
     8 var other = {
     9     name: 'lili',
    10     sex: '女',
    11 }
    12 person.say.call(other,'北京大学','2');//lili,女;北京大学2
    13 person.say.apply(other,['清华大学','3']);//lili,女;北京大学3
    14 person.say.bind(other,'南开大学',4)();//lili,女;北京大学4
  • 相关阅读:
    51nod-1420-贪心
    51nod-1455-dp/缩小范围
    51nod-1574-排列转换
    简单的鼠标滚轮事件
    数组去重
    模仿jq里的选择器和color样式
    在页面里写个动态本地时间
    使用css中的flex布局弹性手风琴效果
    bootstrap中如何多次使用一个摸态框
    使用css让文字两端对齐
  • 原文地址:https://www.cnblogs.com/zhengyeye/p/9011197.html
Copyright © 2011-2022 走看看