彻底理解了call()方法,apply()方法和bind()方法

javascript中的每一个作用域中都有一个this对象,它代表的是调用函数的对象。在全局作用域中,this代表的是全局对象(在web浏览器中指的是window)。如果包含this的函数是一个对象的方法,this指向的就是这个对象。因此在上面例子中就不用直接写对象的名字,而是使用this代替它,例如:

var human = {
    name: ‘霍林林‘,
    sayName: function(){
        console.log(this.name);

    }
}

human.sayName();

下面这个例子中,我们直接使用person.name,这种做法会增加方法与对象之间的耦合度(它们之间的依赖性变强了)。这样写是有问题的 ,如果我们的变量名修改了,我们必须同时修改方法中的变量名。幸运的是,JavaScript给我们提供了解决这个问题的方法。

var person = {
        name: ‘霍林林‘,
        sayName: function(){
            console.log(person.name);
        }
    }

    person.sayName();

1.改变this

this通常是被自动赋值的,但是我们可以改变this的指向。JavaScript给我们提供了 3 中 函数方法 来改变this的指向。

2.call()方法

这个方法的第一个参数表示this指向的对象,后面的所有参数都是函数的参数。例如:

function sayName(label) {

    console.log(label+‘--->‘+this.name);

}

var name = ‘张三‘;

var person1 = {
    name: ‘李四‘
};

var person2 = {
    name: ‘王二‘

};
sayName.call(window,‘global‘);      //‘global--->张三‘
sayName.call(person1,‘person1‘);    //‘person1--->李四‘
sayName.call(person2,‘person2‘);    //‘person2--->王二‘

3.apply()方法

這個方法和call方法的作用都是相同的,只不过在传递参数时候,call方法可以传递多个参数,而apply方法只能传递一个方法,并且要求是一个数组。

function sayName(label) {

    console.log(label);
    console.log(this.name);

}

var name = ‘张三‘;

var person1 = {
    name: ‘李四‘
};

var person2 = {
    name: ‘王二‘

};
sayName.apply(window,[‘global‘]);   //‘global--->张三‘
sayName.apply(person1,[‘person1‘]); //‘person1--->李四‘
sayName.apply(person2,[‘person2‘]); //‘person2--->王二‘

4.bind()方法

bind()方法第一个参数是我们希望函数中this指向的对象,后面的参数是我们希望给函数的参数绑定的值。

var obj = {
              name:‘小明‘
              age:23
            };
function myName(age,gender){
              console.log(this.name,age,gender);
            }
var newName = myName.bind(obj);
            newName();  //小明 undefined undefined

            var newName2 = myName.bind(obj,18);
            newName2();  //小明 18 undefined

            var newName3 = myName.bind(obj,18,‘女‘);
            newName3();  //小明 18 女

            var newName4 = myName.bind(obj);
            newName4(18,‘女‘);  //小明 18 女
时间: 2024-10-08 09:04:18

彻底理解了call()方法,apply()方法和bind()方法的相关文章

JavaScript中的apply()方法和call()方法使用介绍

javascript中apply和call方法的作用及区别说明 call和apply的说明 call,apply都属于Function.prototype的一个方法,它是JavaScript引擎内在实现的,因为属于Function.prototype,所以每个Function对象实例(就是每个方法)都有call,apply属性.既然作为方法的属性,那它们的使用就当然是针对方法的了,这两个方法是容易混淆的,因为它们的作用一样,只是使用方式不同. 语法:foo.call(this, arg1,arg

javascript中apply()方法和call()方法有什么区别?

JavaScript作为web前端开发的必用技术之一,在前端编写的过程中,都会涉及到.但在编写JavaScript的过程中,有一些方法却让人很是纳闷,比如apply()和call()方法. 存在即是合理的,很多时候在编程中,我们不得不用apply()和call()方法的场景,下面我们就通过代码来看看这两种方法的应用. <html> <body> <script> var product = "house"; var boss = { chooseWo

JavaScript的apply()方法和call()方法

1 <script type="text/javascript"> 2 /*定义一个人类*/ 3 function Person(name,age) 4 { 5 this.name=name; 6 this.age=age; 7 } 8 /*定义一个学生类*/ 9 functionStudent(name,age,grade) 10 { 11 Person.apply(this,arguments); 12 this.grade=grade; 13 } 14 //创建一个学

apply()方法和call()方法

obj.func.call(obj1)       //是将obj1看做obj,调用func方法,将第一个参数看做函数调用的对象,可以看做,将obj的方法给obj1使用 ECMAScript规范给所有函数都定义了call()与apply()方法. 注意:call()与apply()的第一个参数都是需要调用的函数对象.    在函数体内this的值就是指向这个调用者,也就是第一个参数,剩余的参数都是需要传递给函数的值    call()与apply()的不同在于,剩余的参数,call(),剩余的参

angularJS学习小结——$apply方法和$watch方法

引言 最近在项目中封装控件的时候用到了$watch方法来监听module中的值的变化,当时小编对这个方法不是很了 解,所以在网上找了一些资料来学习一下,下面小编就给大家简单介绍一些angularJS中Scope 提供$apply 方法传播 Model 的变化和$watch方法监听module变化. $apply使用情景 AngularJS 外部的控制器(DOM 事件.外部的回调函数如 jQuery UI 空间等)调用了AngularJS 函数之后,必 须调用$apply.在这种情况下,你需要命令

apply方法和call方法。

每个函数都有length属性哥prototype属性. length属性表示的是函数接入参数的个数 在es引用类型语言中,prototype是保存它们所有实例方法的真正所在.换句话来说,类似于toString()和valueOf()等方法实际上都存在prototype名下,只不过是通过各自对象的实例访问罢了.在创建自定义类型以及实现继承时,prototype属性的作用是极为重要的.在es5中prototype属性是不可以枚举的,因此使用for-in无法发现. apply属性和call属性都是用来

wait方法和sleep方法的区别

一.概念.原理.区别 Java中的多线程是一种抢占式的机制而不是分时机制.线程主要有以下几种状态:可运行,运行,阻塞,死亡.抢占式机制指的是有多个线程处于可运行状态,但是只有一个线程在运行. 当有多个线程访问共享数据的时候,就需要对线程进行同步.线程中的几个主要方法的比较: Thread类的方法:sleep(),yield()等 Object的方法:wait()和notify()等 每个对象都有一个机锁来控制同步访问.Synchronized关键字可以和对象的机锁交互,来实现线程的同步. 由于s

java为什么要重写hashCode方法和equals方法?

之前发布过一篇文章说的是关于 equals方法重写 http://www.cnblogs.com/aL0n4k/p/4777333.html 下面就hashCode方法发表一下本人的理解,仅供参考,交流. 在 关于java重写equals方法 已经提及说,比较2个对象的时候,要比较他们各自的属性. 那么重写hashCode方法是因为我们在接触到集合的时候,里面有个Set接口,他只能添加无序以及不重复的对象元素. 那有人会问,既然是这样我们直接用equals判断不就完了么? 实际上对Set集合而言

Hibernate中Session.get()方法和load()方法的详细比较(转)

一.get方法和load方法的简易理解 (1)get()方法直接返回实体类,如果查不到数据则返回null.load()会返回一个实体代理对象(当前这个对象可以自动转化为实体对象),但当代理对象被调用时,如果没有数据不存在,就会抛出个org.hibernate.ObjectNotFoundException异常 (2)load先到缓存(session缓存/二级缓存)中去查,如果没有则返回一个代理对象(不马上到DB中去找),等后面使用这个代理对象操作的时候,才到DB中查询,这就是我们常说的 load