首页  >  文章  >  web前端  >  Javascript call和apply区别及使用方法

Javascript call和apply区别及使用方法

高洛峰
高洛峰原创
2017-01-12 11:40:001086浏览

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

apply方法:
语法:fun.apply(thisArg[, argsArray])
定义:应用某一对象的一个方法,用另一个对象替换当前对象。
说明:
如果 argArray 不是一个有效的数组或者不是 arguments 对象,那么将导致一个 TypeError。
如果没有提供 argArray 和 thisArg 任何一个参数,那么 Global 对象将被用作 thisArg, 并且无法被传递任何参数。

二、两者区别
两个方法基本区别在于传参不同
2.1、call方法:

function Product(name, price) {
this.name = name;
this.price = price;
if (price < 0)
throw RangeError(&#39;Cannot create product "&#39; + name + &#39;" with a negative price&#39;);
return this;
}
function Food(name, price) {
Product.call(this, name, price);
this.category = &#39;food&#39;;
}
Food.prototype = new Product();
function Toy(name, price) {
Product.call(this, name, price);
this.category = &#39;toy&#39;;
}
Toy.prototype = new Product();
var cheese = new Food(&#39;feta&#39;, 5);
var fun = new Toy(&#39;robot&#39;, 40);

2.2、apply方法:

function Product(name, price) {
this.name = name;
this.price = price;
if (price < 0)
throw RangeError(&#39;Cannot create product "&#39; + name + &#39;" with a negative price&#39;);
return this;
}
function Food(name, price) {
Product.apply(this, arguments);
this.category = &#39;food&#39;;
}
Food.prototype = new Product();
function Toy(name, price) {
Product.apply(this, arguments);
this.category = &#39;toy&#39;;
}
Toy.prototype = new Product();
var cheese = new Food(&#39;feta&#39;, 5);
var fun = new Toy(&#39;robot&#39;, 40);

三、作用实例

3.1、类的继承

function Person(name,age){
this.name = name;
this.age=age;
this.alertName = function(){
alert(this.name);
}
this.alertAge = function(){
alert(this.age);
}
}
function webDever(name,age,sex){
Person.call(this,name,age);
this.sex=sex;
this.alertSex = function(){
alert(this.sex);
}
}
var test= new webDever(“设计蜂巢”,24,”男”);
test.alertName();//设计蜂巢
test.alertAge();//24
test.alertSex();//男

3.2、回调函数

function Album(id, title, owner_id) {
this.id = id;
this.name = title;
this.owner_id = owner_id;
};
Album.prototype.get_owner = function (callback) {
var self = this;
$.get(‘/owners/&#39; + this.owner_id, function (data) {
callback && callback.call(self, data.name);
});
};
var album = new Album(1, ‘设计蜂巢&#39;, 2);
album.get_owner(function (owner) {
alert(‘The album&#39; + this.name + ‘ belongs to ‘ + owner);
});

更多Javascript call和apply区别及使用方法相关文章请关注PHP中文网!

声明:
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系admin@php.cn