Javascript call和apply區別及使用方法_基礎知識

一、方法的定義
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 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( );

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

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

2.2、apply方法：

2.2、apply方法：複製程式碼

程式碼如下:


function Product(name, price) {
this. = name ;
this.price = price;
if (price throw RangeError('Cannot create product "' name '" with a negative price');

return this;
}

function Food(name, price) {
Product.apply(this, arguments);

this.category = 'food';

}
Food.prototype = new Product();

function Toy(name, price) {
Product.apply(this, arguments);

this.category = 'toy';

}
Toy.prototype = new Product();

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

三、作用實例

3.1.類別的繼承複製程式碼

程式碼如下:



程式碼如下:


function Person( ,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();//24test .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/' this.owner_id, function (data) {callback && callback .call(self, data.name);});};var album = new Album(1, '設計蜂巢', 2);album.get_owner(function (owner ) {alert('The album' this.name ' belongs to ' owner);});