zoukankan      html  css  js  c++  java
  • JS之apply,call,bind区别

    为了加深对基础知识的理解,今天再复习下js中的apply,call,bind的区别和用法。整理笔记的过程也是一个再次学习的过程。

    apply和call

    js中的调用apply和call方法可以改变某个函数执行的上下文环境,也就是可以改变函数内this的指向值。

    例子:

    var person={
        name:'aa',
        getName:function(){
            console.log(this.name);
        }
    }
    var person2 = {
        name:'bb'
    }
    
    person.getName();
    person.getName.call(person2);
    person.getName.apply(person2);

    person2中没有getName()方法,但是person2想执行getName()方法,就可以使用apply或call方法来借用person中的getName()方法。

    当一个对象A没有某个方法时,其他对象B有该方法,就可以使用call或apply来借用对象B中的这个方法。这个时候就动态的改变了this的值。

    apply,call二者区别

    二者作用相同,区别是传入参数的方法不同。

    例子:

    var person={
        name:'aa',
        getName:function(){
            console.log(this.name);
        },
        getPerson:function(age,sex){
            this.age = age;
            this.sex = sex;
            console.log(this)
        }
    }
    var person2 = {
        name:'bb'
    }
    
    person.getName();
    person.getName.call(person2);
    person.getName.apply(person2);
    
    person.getPerson.call(person2,'1','男');
    person.getPerson.apply(person2,['2','女']);

    call()和apply()方法的参数中,第一个参数是指定的上下文环境或者指定的对象,call()方法中后面的所有参数都是用逗号表示,apply()方法中所有参数都是用数组表示。如果参数数量确定,可以使用call方法,如果数量不确定,则使用apply方法。

    bind()方法

    bind() 方法与 apply 和 call 很相似,也是可以改变函数体内 this 的指向。

    MDN的解释是:bind()方法会创建一个新函数,称为绑定函数,当调用这个绑定函数时,绑定函数会以创建它时传入 bind()方法的第一个参数作为 this,传入 bind() 方法的第二个以及以后的参数加上绑定函数运行时本身的参数按照顺序作为原函数的参数来调用原函数。

    语法:

    var bound = fun.bind(this,arg1,arg2...);

    如果只是想改变上下文环境,而非执行该函数,则使用bind方法。apply/call会马上执行该函数。

    总结:

    apply,call,bind都是改变函数的this指向的,改变函数执行的上下文环境。

    apply,call,bind第一个参数指this需要指向的对象,也就是函数运行时所处的对象环境。

    bind返回新的函数,但是不执行,apply/call会立即执行该函数。

    参考:

    http://www.cnblogs.com/coco1s/p/4833199.html

  • 相关阅读:
    android中文件操作的四种枚举
    【第4节】索引、视图、触发器、储存过程、
    【第3篇】数据库之增删改查操作
    【第2篇】基本操作和存储引擎
    【第1篇】数据库安装
    123
    111
    1111111
    源码
    【COLLECTION模块】
  • 原文地址:https://www.cnblogs.com/zourong/p/4875548.html
Copyright © 2011-2022 走看看