详解js中call与apply关键字的作用

javascript call与apply关键字的作用

apply接受两个参数。第一个参数指定函数体内this对象的指向，第二个参数为一个带下标的集合。

call则是apply的语法糖，如果参数数量固定，则可以不用带下标的集合传第二个参数。

var func = function(a,b,c)
{
 alert(a + b + c);
}
func.apply(null,[1,2,3]);//弹出6
func.call(null,1,2,3);//弹出6

当apply与call传入的第一个参数为null时，函数体内的this会指向window。

当apply与call传入的第一个参数为null时，函数体内的this会指向window。

call与apply的用途

1、改变this的指向

var obj1 = {
 name = '刘备'
}

var obj2 = {
 name = '曹操'
}
var getName = function(){
 alert(this.name);
}

window.name = '三国';
getName();//弹出"三国"
getName.call(obj1);//弹出"刘备"
getName.call(obj2);//弹出"曹操"

所以，当在一些情况下this被莫名改变指向之后，可以使用call或apply来进行修正this的指向。

document.getElementById('div1').onclick = function(){
 alert(this.id);//div1
 var fun1 = function(){
  alert(this.id);//window.id 即undefined
 }
 fun1();//普通函数的方式调用，this指代window,相当于window.id 即 undefined
}

由于是普通函数的方式调用，所以上面的例子中，this已经变成了window。下面看看如何使用call进行修正。

document.getElementById('div1').onclick = function(){
 alert(this.id);
 var fun1 = function(){
  alert(this.id);
 }
 fun1.call(this);//强制函数内的this为外层的this，
}

2、调用其他对象的函数

示例1：

var obj1 = {
 a:1,
 b:2,
 add:function()
 {
  return this.a + this.b;
 }
}
var obj2 = {
 a:1,
 b:2,
}
var result = obj1.add.call(obj2);//用obj1的函数来计算obj2的两个属性的和
alert(result);//输出3

示例2：借用构造函数实现类似继承的效果

var A = function(name)
{
 this.name = name;
};
var B = function(){
 A.apply(this,arguments)
}
B.prototype.getName = function(){
 return this.name;
}
var b = new B('刘备');
alert(b.getName());

以上就是本文的内容，有问题可以和小编联系，谢谢对我们的支持！

赞 (0)

相关推荐

  • JS中改变this指向的方法(call和apply、bind)

    this是javascript的一个关键字,随着函数使用场合不同,this的值会发生变化.但是总有一个原则,那就是this指的是调用函数的那个对象. this一般指向的是当前被调用者,但也可以通过其它方式来改变它的指向,下面将介绍三种方式: 1.call用作继承时: function Parent(age){ this.name=['mike','jack','smith']; this.age=age; } function Child(age){ Parent.call(this,age);

  • 详解js中的apply与call的用法

    前言 call 和 apply 都是为了改变某个函数运行时的 context 即上下文而存在的,换句话说,就是为了改变函数体内部 this 的指向. call 和 apply二者的作用完全一样,只是接受参数的方式不太一样. 方法定义 apply Function.apply(obj,args)方法能接收两个参数: obj:这个对象将代替Function类里this对象 args:这个是数组或类数组,apply方法把这个集合中的元素作为参数传递给被调用的函数. call call方法与apply方

  • 浅谈javascript的call()、apply()、bind()的用法

    JavaScript中的函数不仅是一种类似于Java中方法的语言功能,它还可以作为对象而存在. 本文将要探讨JavaScript中函数的一些特殊用法,包括call.apply.bind三个原型方法. 一.函数基础 JavaScript中的函数是一种类似于Java中方法的语言功能,不过它可以独立于类进行定义. 函数式编程:由于JavaScript支持匿名函数,因此可以将函数作为对象来使用, 所以JavaScript不仅支持过程式编程(面向对象也是过程式编程的一种),还支持函数式编程. 上下文 函数

  • 实例讲解JavaScript中call、apply、bind方法的异同

    实例讲解JavaScript中call、apply、bind方法的异同

    以实例切入,讲解JavaScript中call,apply,bind方法,供大家参考,具体内容如下 <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title></title> <script type="text/javascript"> function MAN(name, sex, age) { this.name =

  • js继承call()和apply()方法总结

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

  • 从JQuery源码分析JavaScript函数的apply方法与call方法

    从JQuery源码分析JavaScript函数的apply方法与call方法

    最近在使用jQuery的$.each方法时很,突然想到$.each($('div'),function(index,entity){});中的这个index和entity是哪冒出来的,而且可有可无的,而且这么高大上的能告诉我们当前遍历的下标和实例.所以看了一下jQuery源代码,是这么写的: 调试的时候走的是标红的这段代码,然后用到了callback.call这个函数,于是翻看了一下<js高级程序设计>,其中有比较深的解释. 首先,function是一个指向Function对象,函数名是一个指

  • Function.prototype.apply()与Function.prototype.call()小结

    老是忘掉这两个东东的用下,写下来做个记录吧. 他们作用是一模一样的,只是传入的参数不一样 apply apply接受两个参数,第一个制定了函数体内this对象的指向,第二个参数为一个带下标的集合(可遍历对象),apply方法把这个集合中的元素作为参数传递给被调用的函数: var func = function(a, c, c){ alert([a,b,c]); //[1,2,3] } func.apply(null, [1,2,3]); call call传入的参数不固定,和apply相同的是,

  • JS中call/apply、arguments、undefined/null方法详解

    JS中call/apply、arguments、undefined/null方法详解

    a.call和apply方法详解 -------------------------------------------------------------------------------- call方法: 语法:call([thisObj[,arg1[, arg2[, [,.argN]]]]]) 定义:调用一个对象的一个方法,以另一个对象替换当前对象. 说明: call 方法可以用来代替另一个对象调用一个方法.call 方法可将一个函数的对象上下文从初始的上下文改变为由 thisObj 指

  • 关于JS中的apply,call,bind的深入解析

    在Javascript中,Function是一种对象.Function对象中的this指向决定于函数被调用的方式.使用apply,call 与 bind 均可以改变函数对象中this的指向,在说区别之前还是先总结一下三者的相似之处: 1.都是用来改变函数的this对象的指向的. 2.第一个参数都是this要指向的对象. 3.都可以利用后续参数传参. call方法: 语法:call([thisObj[,arg1[, arg2[,   [,.argN]]]]]) 定义:调用一个对象的一个方法,以另一

  • 浅谈javascript中call()、apply()、bind()的用法

    call(thisObj,arg1,arg2...).apply(thisObj,[obj1,obj2...])这二个方法是每个函数都包含的非继承的方法 call(thisobj[, args])和apply(thisobj[, args]) 作用都是一样的,简单来说就是改变当前使用该方法的对象中的this指向,指向调用方法中的thisObj对象二者的区别(第一个参数是相同的)就是call方法中传入的参数是是一个个列举出来的,而apply方法中的参数二是一个数组 还是举例说明比较直观: wind

随机推荐