apply()和call()

这两个方法的用途都是在特定的作用域中调用函数,实际上等于设置函数体内this对象的值

(1) apply()

接收两个参数:
a. 第一个是在其中运行函数的作用域
b. 参数数组:可以是Array实例,也可以是arguments对象

比如:

function sum(num1, num2){
    return num1 + num2;
}

function callSum1(num1, num2){
    return sum.apply(this, arguments);
}

function callSum2(num1, num2){
    return sum.apply(this, [num1, num2])
}

callSum1(10,10)   // 20
callSum2(10,10)   // 20

(2) call()

call()和apply()作用相同,区别仅仅在于接收参数的方式不同,call()第二个参数必须逐个列举出来

function sum(num1, num2){
    return num1 + num2;
}

function callSum(num1, num2){
   return sum.call(this, num1, num2);
}

alert(callSum(10,10))

其实,这两个方法真正强大之处,是可以扩充函数赖以运行的作用域

window.color = 'red';

var o = {
    color: 'blue'
}

function sayColor(){
    alert(this.color)
}

sayColor();             // red
sayColor.call(this)     // red
sayColor.call(window)   // red
sayColor.call(o);       // blue,将 sayColor() 函数放在对象o中,然后再通过o来调用它

ES5还创建了一个方法:bind(),这个方法会创建一个函数的实例,其this值会被绑定到传给bind()函数的值

window.color = 'red';
var o = {
    color: 'blur'
}
function sayColor(){
    alert(this.color);
}

var objectSayColor = sayColor.bind(o)
objectSayColor()
最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • call 和 apply EC3给Function的原型定义了两个方法,它们是 Function.prototyp...
    WeekOne阅读 465评论 0 0
  • 我在一开始看到javascript的函数apply和call时,非常的模糊,看也看不懂,最近在网上看到一些文章对a...
    Joe_Somebody阅读 423评论 0 0
  • 函数和对象 1、函数 1.1 函数概述 函数对于任何一门语言来说都是核心的概念。通过函数可以封装任意多条语句,而且...
    道无虚阅读 4,664评论 0 5
  •   引用类型的值(对象)是引用类型的一个实例。   在 ECMAscript 中,引用类型是一种数据结构,用于将数...
    霜天晓阅读 1,098评论 0 1
  • 说点题外话 本文仅仅适用于新手,我是说很新的手哟,旨在和大家共同了解js的call和apply方法。笔者水平有限,...
    码农小圈圈阅读 614评论 4 4