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

UnixAgain 发布于2019-08-21 17:15 / 2732人阅读

摘要：可能上面的例子不是很常见，但是我们经常见到这样的代码你好美女你好美女方法是数组特有的方法，它是定义在构造函数的原型中的方法，所以我们实例化的数组就都继承了这个方法，但是字符串是没有方法，但此处我们就借用了数组的方法来处理字符串。

在学习javascript的时候，对于call()和apply()的用法总是难以理解，相信很多小伙伴和我又一样的想法。现在和小伙伴们分享一下。

call

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

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

function Teacher(name, age) {  //定义一个构造函数Teacher
    this.name = name;
    this.age = age;
    this.intro = function() {
        alert("My name is " + this.name + "," + "I"m " + this.age)
    }
}

function Student(name, age) {  //定义一个构造函数Student
    Teacher.call(this, name, age);  //Student调用了Teacher的方法
}
var studentA = new Student("Lily", 19); //实例化一个studentA,传入参数
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传入的参数。可能上面的例子不是很常见，但是我们经常见到这样的代码：

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

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

apply

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

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

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

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

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

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

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

文章版权归作者所有，未经允许请勿转载,若此文章存在违规行为，您可以联系管理员删除。

转载请注明本文地址：https://www.ucloud.cn/yun/89302.html

理解 JavaScript call()/apply()/bind()

摘要：理解文章中已经比较全面的分析了在中的指向问题，用一句话来总结就是的指向一定是在执行时决定的，指向被调用函数的对象。与和直接执行原函数不同的是，返回的是一个新函数。这个新函数包裹了原函数，并且绑定了的指向为传入的。理解 JavaScript this 文章中已经比较全面的分析了 this 在 JavaScript 中的指向问题，用一句话来总结就是：this 的指向一定是在执行时决定的，...

duan199226 2019-08-23 14:27 评论0 收藏0
理解JavaScript中的call,apply和bind方法

摘要：输出的作用与和一样，都是可以改变函数运行时上下文，区别是和在调用函数之后会立即执行，而方法调用并改变函数运行时上下文后，返回一个新的函数，供我们需要时再调用。前言 js中的call(), apply()和bind()是Function.prototype下的方法，都是用于改变函数运行时上下文，最终的返回值是你调用的方法的返回值，若该方法没有返回值，则返回undefined。这几个方法...

chaosx110 2019-08-26 12:23 评论0 收藏0
Javascript中call和apply的理解

摘要：剩下的两个，我们分别改变了他们的执行环境，分别指向了和，于是结果就是显示对象各自的值。如果你仍然对和没有清晰的认识，可以试着这样理解。在Javascript中，每个函数都包含两个非继承而来的方法，call和apply。这两个方法的用途都是在特定的作用域中调用函数，实际上等于设置函数体内的this对象的值。摘自《JavaScript高级程序设计》 apply方法接收两个参数，第一个参数...

mrcode 2019-08-21 12:23 评论0 收藏0
如何理解和熟练运用js中的call及apply

摘要：用的比较多的，通过选择的节点是一种类似的。它不能应用下的等方法。和都是为了改变某个函数运行时的即上下文而存在的，换句话说，就是为了改变函数体内部的指向。这些的话也就能明白它俩的用处以及它们定义。要明白call以及apply 首先得知道他们的用法如何有什么用 function cat() {} cat.prototype = { foo...

kuangcaibao 2019-08-20 14:14 评论0 收藏0
深入理解JavaScript（三）：获取数组中的最大值方法（this,apply）

摘要：三个方法的作用，都是改变的指向，只是用法稍微有些区别什么是既不指向函数自身，也不指函数的词法作用域。它在函数定义的时候是确定不了的在函数被调用时才发生的绑定，也就是说具体指向什么，取决于你是怎么调用的函数。 1.排序法思路：给数组先排序(由大到小排序),第一项就是最大值 let arr = [1,5,6,7,9,20,40,2,3]; let max1 = arr.sort(func...

canopus4u 2019-08-26 10:42 评论0 收藏0