javascript call() 方法详细讲解-js教程-PHP中文网

javascript call() 方法详细讲解

php中文网

发布： 2016-06-01 09:54:26

原创

1640人浏览过

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

call()基本语法

<code class="javascript">fun.call(thisArg[, arg1[, arg2[, ...]]])</code>

登录后复制

立即学习“Java免费学习笔记（深入）”；

call()参数介绍：

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

立即学习“Java免费学习笔记（深入）”；

call()基本功能说明

当调用一个函数时，可以赋值一个不同的 this 对象。this 引用当前对象，即 call 方法的第一个参数。

通过 call 方法，你可以在一个对象上借用另一个对象上的方法，比如Object.prototype.toString.call([])，就是一个Array对象借用了Object对象上的方法。

立即学习“Java免费学习笔记（深入）”；

call()实例一：使用call方法调用父构造函数

在一个子构造函数中，你可以通过调用父构造函数的 call 方法来实现继承，类似于Java中的写法。下例中，使用 Food 和 Toy 构造函数创建的对象实例都会拥有在 Product 构造函数中添加的 name 属性和 price 属性,但 category 属性是在各自的构造函数中定义的。

《PHP程序设计》第二版

本书图文并茂，详细讲解了使用LAMP（PHP）脚本语言开发动态Web程序的方法，如架设WAMP平台，安装与配置开源Moodle平台，PHP程序设计技术，开发用户注册与验证模块，架设LAMP平台。　本书适合计算机及其相关专业本、专科学生作为学习LAMP（PHP）程序设计或动态Web编程的教材使用，也适合对动态Web编程感兴趣的读者自觉使用，对LAMP（PHP）程序设计人员也具有一定的参考价值。

713

查看详情

<code class="javascript">function Product(name, price) {
  this.name = name;
  this.price = price;

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

  return this;
}

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

Food.prototype = Object.create(Product.prototype);
Food.prototype.constructor = Food; // Reset the constructor from Product to Food

function Toy(name, price) {
  Product.call(this, name, price);
  this.category = 'toy';
}

Toy.prototype = Object.create(Product.prototype);
Toy.prototype.constructor = Toy; // Reset the constructor from Product to Toy

var cheese = new Food('feta', 5);
var fun = new Toy('robot', 40);</code>

登录后复制

立即学习“Java免费学习笔记（深入）”；

call()实例二：使用call方法调用匿名函数

在下例中的for循环体内，我们创建了一个匿名函数，然后通过调用该函数的call方法，将每个数组元素作为指定的this值执行了那个匿名函数。这个匿名函数的主要目的是给每个数组元素对象添加一个print方法，这个print方法可以打印出各元素在数组中的正确索引号。当然，这里不是必须得让数组元素作为this值传入那个匿名函数（普通参数就可以），目的是为了演示call的用法。

<code class="javascript">var animals = [
  {species: 'Lion', name: 'King'},
  {species: 'Whale', name: 'Fail'}
];

for (var i = 0; i < animals.length; i++) {
  (function (i) { 
    this.print = function () { 
      console.log('#' + i  + ' ' + this.species + ': ' + this.name); 
    } 
    this.print();
  }).call(animals[i], i);
}</code>

登录后复制

立即学习“Java免费学习笔记（深入）”；

call()实例三：使用call方法调用匿名函数并且指定上下文的'this'

在下面的例子中，当调用 greet 方法的时候，该方法的 this 值会绑定到 i 对象。

<code class="javascript">function greet() {
  var reply = [this.person, 'Is An Awesome', this.role].join(' ');
  console.log(reply);
}

var i = {
  person: 'Douglas Crockford', role: 'Javascript Developer'
};

greet.call(i); // Douglas Crockford Is An Awesome Javascript Developer</code>

登录后复制

立即学习“Java免费学习笔记（深入）”；

注意：该方法的作用和apply()方法类似，只有一个区别，就是call()方法接受的是若干个参数的列表，而apply()方法接受的是一个包含多个参数的数组。