脚本之家 服务器常用软件
快捷导航
您的位置：首页 → 网络编程 → JavaScript → javascript技巧 → Javascript call()方法

Javascript中的call()方法介绍

 更新时间：2015年03月15日 10:25:09   投稿：junjie  
这篇文章主要介绍了Javascript中的call()方法介绍,本文讲解了Call() 语法、Call() 参数、Javascript中的call()方法、Call()方法的实例等内容,需要的朋友可以参考下

在Mozilla的官网中对于call()的介绍是:

复制代码 代码如下:

call() 方法在使用一个指定的this值和若干个指定的参数值的前提下调用某个函数或方法.

Call() 语法
复制代码 代码如下:

fun.call(thisArg[, arg1[, arg2[, ...]]])

Call() 参数

thisArg

复制代码 代码如下:

在fun函数运行时指定的this值。需要注意的是，指定的this值并不一定是该函数执行时真正的this值，如果这个函数处于非严格模式下，则指定为null和undefined的this值会自动指向全局对象(浏览器中就是window对象)，同时值为原始值(数字，字符串，布尔值)的this会指向该原始值的自动包装对象。

arg1, arg2, ...
复制代码 代码如下:

指定的参数列表。

Javascript中的call()方法

先不关注上面那些复杂的解释，一步步地开始这个过程。

Call()方法的实例

于是写了另外一个Hello,World:

复制代码 代码如下:

function print(p1, p2) {
    console.log( p1 + ' ' + p2);
}
print("Hello", "World");
print.call(undefined, "Hello", "World");

两种方式有同样的输出结果，然而，相比之下call方法还传进了一个undefined。

接着，我们再来看另外一个例子。

复制代码 代码如下:

var obj=function(){};
function print(p1, p2) {
    console.log( p1 + ' ' + p2);
}

print.call(obj, "Hello", "World");

只是在这里，我们传进去的还是一个undefined，因为上一个例子中的undefined是因为需要传进一个参数。这里并没有真正体现call的用法，看看一个更好的例子。

复制代码 代码如下:

function print(name) {
    console.log( this.p1 + ' ' + this.p2);
}

var h={p1:"hello", p2:"world", print:print};
h.print("fd");

var h2={p1:"hello", p2:"world"};
print.call(h2, "nothing");

call就用就是借用别人的方法、对象来调用，就像调用自己的一样。在h.print，当将函数作为方法调用时，this将指向相关的对象。只是在这个例子中我们没有看明白，到底是h2调了print，还是print调用了h2。于是引用了Mozilla的例子

复制代码 代码如下:

function Product(name, price) {
    this.name = name;
    this.price = price;

    if (price < 0)
        throw RangeError('Cannot create product "' + name + '" with a negative price');
    return this;
}

function Food(name, price) {
    Product.call(this, name, price);
    this.category = 'food';
}
Food.prototype = new Product();

var cheese = new Food('feta', 5);
console.log(cheese);


在这里我们可以真正地看明白，到底是哪个对象调用了哪个方法。例子中，使用Food构造函数创建的对象实例都会拥有在Product构造函数中添加的 name 属性和 price 属性,但 category 属性是在各自的构造函数中定义的。

复制代码 代码如下:

function print(name) {
    console.log( this.p1 + ' ' + this.p2);
}

var h2= function(no){
    this.p1 = "hello";
    this.p2 = "world";
    print.call(this, "nothing");
};
h2();

这里的h2作为一个接收者来调用函数print。正如在Food例子中，在一个子构造函数中，你可以通过调用父构造函数的 call 方法来实现继承。

至于Call方法优点，在《Effective JavaScript》中有介绍。

1.使用call方法自定义接收者来调用函数。
2.使用call方法可以调用在给定的对象中不存在的方法。
3.使用call方法可以定义高阶函数允许使用者给回调函数指定接收者。

您可能感兴趣的文章:

相关文章

  • Web技术实现移动监测的介绍

    Web技术实现移动监测的介绍

    移动侦测，一般也叫运动检测，常用于无人值守监控录像和自动报警。通过摄像头按照不同帧率采集得到的图像会被 CPU 按照一定算法进行计算和比较，当画面有变化时，如有人走过，镜头被移动，计算比较结果得出的数字会超过阈值并指示系统能自动作出相应的处理
    2017-09-09
  • JavaScript做大整数加法计算的代码实现

    JavaScript做大整数加法计算的代码实现

    这篇文章主要带大家去了解前端如何做大整数加法计算,文中通过代码示例介绍的非常详细,对大家的学习或工作有一定的帮助,需要的朋友可以参考下
    2024-09-09
  • javascript数字数组去重复项的实现代码

    javascript数字数组去重复项的实现代码

    console.log 不支持ie，下面的代码需要在火狐中测试，不然会有问题。
    2010-12-12
  • 浅析Javascript ES6新增值比较函数Object.is

    浅析Javascript ES6新增值比较函数Object.is

    在Javascript中判断相等是很常见的，常用的判断有“==”，“===”，“！=”，“！==”，今天这篇文章我们来学习ES6中的一个方法Object.is()，有需要的可以参考学习。
    2016-08-08
  • js密码强度检测

    js密码强度检测

    这篇文章主要介绍了js密码强度检测的相关资料，并给出了详细代码，需要的朋友可以参考下
    2016-01-01
  • 微信小程序滑块验证实现方法

    微信小程序滑块验证实现方法

    这篇文章主要介绍了微信小程序滑块验证方法,本文通过实例代码给大家介绍的非常详细，对大家的学习或工作具有一定的参考借鉴价值，需要的朋友可以参考下
    2022-01-01
  • JS中some和every的区别和用法详解

    JS中some和every的区别和用法详解

    every 和 some 都是数组迭代方法,都可以遍历数组,这篇文章主要介绍了JS中some和every的区别和用法,需要的朋友可以参考下
    2023-05-05
  • javascript 计算两个整数的百分比值

    javascript 计算两个整数的百分比值

    用来计算两个整数的百分比值的代码，需要的可以看看。
    2009-12-12
  • 浅析Bootstrap验证控件的使用

    浅析Bootstrap验证控件的使用

    这篇文章主要介绍了浅析Bootstrap验证控件的使用 的相关资料,非常不错具有参考借鉴价值，需要的朋友可以参考下
    2016-06-06
  • 使用json对象转化为key,value的对象数组

    使用json对象转化为key,value的对象数组

    这篇文章主要介绍了使用json对象转化为key，value的对象数组方式，具有很好的参考价值，希望对大家有所帮助。如有错误或未考虑完全的地方，望不吝赐教
    2022-06-06

最新评论