一.简介
本文结合基本javascript的权威书籍中的内容,根据自己的理解,通过相关示例向大家展示了javascript中call,apply使用及区别,希望大家能够喜欢,如有不足,也希望提出建议,大家共同进步。
call()
方法在使用一个指定的this值和若干个指定的参数值的前提下调用某个函数或方法.
apply()
方法在指定 this值和参数(参数以数组或伪数组的形式存在)的情况下调用某个函数。
二.基础语法
fun.call(thisArg,arg1,arg2...)
fun.apply(thisArg,[argArray1, argArray2...])
三.参数
1.call()的参数:
1).thisArg
- 在函数运行时第一个参数是指定的this的值。
需要注意的是,指定的
this
值并不一定是该函数执行时真正的this值,如果这个函数处于非严格模式下,则指定为null和undefined的this值会自动指向
全局对象(浏览器中就是window对象),同时值为基本数据类型时(数字,字符串,布尔值)的this会指向该基本数据类型的自动包装对象。 2).arg1, arg2, ...
- 2.apply()的参数:
1).
thisArg- 在函数运行时第一个参数是指定的this的值。需要注意的是,指定的this值并不一定是该函数执行时真正的this值,如果这个函数处于非严格模式下,则指定为null或undefined时
会自动指向
全象 - 浏览器中就是(window对象),同时值为基本数据类型时(数字,字符串,布尔值)的this会指向该基本数据类型的自动包装对象。
2).
argsArray- 一个数组或者是伪数组,其中的数组元素将作为单独的参数传给函数。如果该参数的值
为
null或undefined,则表示不需要传入任何参数。但是使用伪数组时,要考虑兼容性问题。
四.返回值
返回结果包括制定的this值和参数。
五.示例
下面列举一下这两种方法的常用场景。
1.使用call方法调用构造函数
在一个子构造函数中,你可以通过调用父构造函数的call方法来实现继承.下例中,使用Student构造函数创建的对象实例都会拥有在Person构造函数中添加的name属性和age属性,但study属性是在构造函数中定义的。
function Person(name,age){
this.name=name;
this.age=age;
}
function Student(name,age){
Person.call(this,name,age);
this.study="math";
}
var excellent=new Student("李四",20)
console.log(excellent) // Student {name: "李四", age: 20, study: "math"}
2.使用apply和内置对象
聪明的apply用法允许你在某些本来需要写成遍历数组变量的任务中使用内建的函数(内置对象)。在接下里的例子中我们会使用Math.max/Math.min来找出一个数组中的最大/最小值。
var numbers=[2,3,7,8,6]
var max=Math.max.apply(,null,numbers)
var min=Math.min.apply(,null,numbers)
console.log(max) //8
console.log(min) //2