javascript中的call()和apply()的理解

在学习javascript的时候,对于call()和apply()的用法总是难以理解,相信很多小伙伴和我又一样的想法。最近在看犀牛书,对这两个函数又狠狠地理解了一下,总算有些眉目,了解了两个函数的基本用法,现在和小伙伴们分享一下,说的不对还望纠正。

一、call

语法:call([thisObj[,arg1[, arg2[,   [,.argN]]]]])
   
定义:调用一个对象的一个方法,以另一个对象替换当前对象。

看完语法和定义还是难以理解,call函数可以接受若干个参数,其中第一个参数为当前操作的对象,后面几个参数为调用的方法的参数,这么说还是难以理解,直接上代码:

 1 function Teacher(name, age) {  //定义一个构造函数Teacher
 2     this.name = name;
 3     this.age = age;
 4     this.intro = function() {
 5         alert("My name is " + this.name + "," + "I‘m " + this.age)
 6     }
 7 }
 8
 9 function Student(name, age) {  //定义一个构造函数Student
10     Teacher.call(this, name, age);  //Student调用了Teacher的方法
11 }
12 var studentA = new Student("Lily", 19); //实例化一个studentA,传入参数
13 studentA.intro(); //调用studentA的intro方法 输出:My name is Lily,I‘m 19

上例中,studentA是通过构造函数Student实例化的,本应该继承Student构造函数的所有可继承方法,但我们看到Student函数并没有任何方法,但是Student调用了,可以说是继承了Teacher的方法,故studentA也就有了intro()方法。其中代码第十行起到了关键作用Teacher.call(this, name, age),此句的作用是令当前对象调用另一个对象的方法,this关键字在这里指代Student()对象,实例化以后this指代studentA对象,而后面的参数分别为Teacher传入的参数。可能上面的例子不是很常见,但是我们经常见到这样的代码:

1 var str="你好美女";
2 Array.prototype.join.call(str,"!");    //你!好!美!女

join方法是数组特有的方法,它是定义在Array()构造函数的原型中的方法,所以我们实例化的数组就都继承了这个方法,但是字符串str是没有join方法,但此处我们就借用了数组的join方法来处理字符串。在call左边的表达式为借用的对象的方法,call()中的第一个参数对象借用call左边表达式对象的方法(不知道这样说能不能理解,将就吧)。

二、apply

apply()方法的作用和call方法是一样的,只是传入的参数不同。

语法:apply([thisObj[,argArray]])
    
定义:应用某一对象的一个方法,用另一个对象替换当前对象。

apply的第一个参数和call一样,第二个参数是一个数组对象(类数组也可以),他不再是以单个参数列表的形式传入参数,而是把所有参数都放到一个数组中,一起传入。这里就不得不说到arguments对象,它存在于每个函数中,是函数所有实参组成的一个类数组对象。所以apply的第二个参数传入arguments对象。看下面示例:

1 var arr=[2,3,12,5,234,199,21,1000,2432];
2 var max=Math.max.apply(Math,arr);
3 console.log(max); //2432

数组中没有求最大值得方法,但是Math对象里面有max可以求出最大值,因此我们使用apply方法让数组继承Math的max()方法,从而求出数组中的最大值,同样上面的方法也可以用call()方法代替,只不过书写较为麻烦,不便于阅读,代码为:

1 var max=Math.max.call(Math,2,3,12,5,234,199,21,1000,2432);
2 console.log(max); //2432

关于call和apply最基本的用法就是这些,当然这两个函数的妙处远远不止这些,欢迎大神们补充。

时间: 2024-07-29 05:59:51

javascript中的call()和apply()的理解的相关文章

浅谈javascript中的call、apply、bind

apply.call 在 javascript 中,call 和 apply 都是为了改变某个函数运行时的上下文(context)而存在的,换句话说,就是为了改变函数体内部 this 的指向. JavaScript 的一大特点是,函数存在「定义时上下文」和「运行时上下文」以及「上下文是可以改变的」这样的概念. 先来一个栗子: function fruits() {} fruits.prototype = { color: "red", say: function() { console

移花接木—— 再谈javascript中的 call 与 apply

在JavaScript中,call 和 apply 是Function对象自带的两个方法,这两个方法的主要作用是改变函数中的this指向,从而可以达到`接花移木`的效果.本文将对这两个方法进行详细的讲解,并列出几个关于call和apply的经典应用场景. call(thisArgs [,args...]) 该方法可以传递一个thisArgs参数和一个参数列表,thisArgs指定了函数在运行期的调用者,也就是函数中的this对象,而参数列表会被传入调用函数中.thisArgs的取值有以下4种情况

Javascript中call方法和apply方法用法和区别

第一次在博客园上面写博客,知识因为看书的时候发现了一些有意思的知识,顺便查了一下资料,就发到博客上来了,希望对大家有点帮助. 连续几天阅读<javascript高级程序设计>这本书了,逐渐发现了以前很多自己完全没有用过甚至见过的神奇知识点.今天在阅读到有关函数的属性和方法的时候,略感高级,于是乎,查阅了不少他人的博客,在此总结一下这两个方法的以下几个方面: 1.call()和apply()的作用和用法 2.什么时候用apply(),什么时候用call() 书上提到,每个函数都包含两个非继承而来

Javascript中call函数和apply函数的使用

Javascript 中call函数和apply的使用: Javascript中的call函数和apply函数是对执行上下文进行切换,是将一个函数从当前执行的上下文切换到另一个对象中执行,例如: sourceObj.method.call(destObj,params1,params2) 是将sourceObj中的method函数放在destObj中执行 call函数还有另外一种重要的作用,在Javascript面向对象编程中实现多继承的作用,例如: function parentClass()

JavaScript中的call、apply

JavaScript中的call.apply call JavaScript中的call是调用一个函数,在调用函数时,将this的值绑定为call参数中的第一个参数. var bye = function(param, param2){ console.log(this); console.log(param); console.log(param2); console.log("bye"); console.log(this.x) } t = {'x': 1}; bye.call(t

javascript中的call()和apply()方法的使用

1.方法定义 call方法: 语法:call([thisObj[,arg1[, arg2[,   [,.argN]]]]]) 定义:调用一个对象的一个方法,以另一个对象替换当前对象. 说明: call 方法可以用来代替另一个对象调用一个方法.call 方法可将一个函数的对象上下文从初始的上下文改变为由 thisObj 指定的新对象. 如果没有提供 thisObj 参数,那么 Global 对象被用作 thisObj. apply方法: 语法:apply([thisObj[,argArray]])

理解和运用javascript中的call及apply

call是为了改变函数上下文context而存在的,换言之,就是改变函数内部this的指向.因为javascript存在[定义时上下文],[运行时上下文]及[上下文]是可以改变的.例如:var func1 = function(arg1, arg2) {}; 就可以通过 func1.call(this, arg1, arg2); 或者 func1.apply(this, [arg1, arg2]); 来调用.其中 this 是你想指定的上下文,他可以任何一个 JavaScript 对象(Java

简单理解Javascript中的call 和 apply

javascript中面向对像的能力是后来加进来的, 为了兼容性, 所以整出了很多奇特的东西, function Animal(){ this.name = "Animal"; this.showName = function(){ alert(this.name); } } function Cat(){ this.name = "Cat"; } var animal = new Animal(); var cat = new Cat(); //通过call或ap

JavaScript中的call()、apply()与bind():

关于call()与apply(): 在JavaScript中,每个函数都有call与apply(),这两个函数都是用来改变函数体内this的指向,并调用相关的参数. 看一个例子: 定义一个animal对象,该对象有一个jump()方法: var animal = { type:'animal', jump:function(name){ return this.type + ' is ' + name; } } some_animal.jump('dog'); **"animal is dog&