JavaScript-applycall

Posted 2020-10-16 万里奔腾

一、方法定义

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

apply方法： 
语法：apply([thisObj[,argArray]]) 
定义：应用某一对象的一个方法，用另一个对象替换当前对象。 
说明： 
如果 argArray 不是一个有效的数组或者不是 arguments 对象，那么将导致一个 TypeError。 

 

注意：总结就是，call方法和apply方法对this的指向进行操作

 

二、

　　call：在call传入参数的时候，需要与函数所接受的参数一一对应

　　apply：在apply传入参数的时候，则以数组的方式传入，数组中的元素需要与函数所接受的参数一一对应

 

************************************

function xiaoHong()
{
　　alert(‘小红‘);
}
function xiaoMing()
{
　　return "小明";
}
alert(xiaoMing());//小明
xiaoHong.call(xiaoMing());//结果:小红
xiaoMing.call(xiaoHong());//小红

//call()用在函数上面

 

***************************************

function xiaoHong()
{
　　alert(‘小红‘);
}
function xiaoMing()
{
　　return "小明";
}
// alert(xiaoMing());//小明
// xiaoHong.call(xiaoMing());//结果:小红
// xiaoMing.call(xiaoHong());//小红


//call()用在函数上面


var Dog=function()
{
　　this.name="汪星人";
　　this.shout=function()
　　{
　　　　alert(this.name);
　　}
}
var Cat=function()
{
　　this.name="猫星人";
　　this.shout=function()
　　{
　　　　alert(this.name);
　　}
}
var dog=new Dog();
dog.shout();

var cat=new Cat();
cat.shout();

 

***************************************

var xh={
　　name:‘小红‘,
　　word:‘web小白‘
};
var xm={
　　name:‘小明‘,
　　word:‘web资深工程师‘
};
var jx={
　　name:‘杰西‘,
　　word:‘web项目总监‘
};

//读取：我的xxx,我的工作是xxxx
console.log("我是"+xh.name+",我的工作是："+xh.word); //我是小红,我的工作是：web小白
console.log("我是"+xm.name+",我的工作是："+xm.word); //我是小明,我的工作是：web资深工程师
console.log("我是"+jx.name+",我的工作是："+jx.word); //我是杰西,我的工作是：web项目总监

//用call的方法
//call调用一个对象的一个方法，以另一个对象替换当前对象。
function myObj()
{
　　console.log("我是"+this.name+",我的工作是"+this.word);
}
myObj.call(xh); //我是小红,我的工作是：web小白
myObj.call(xm); //我是小明,我的工作是：web资深工程师
myObj.call(jx); //我是杰西,我的工作是：web项目总监

//用apply的方法
myObj.apply(xh); //我是小红,我的工作是：web小白
myObj.apply(xm); //我是小明,我的工作是：web资深工程师
myObj.apply(jx); //我是杰西,我的工作是：web项目总监

 

***************************************

var xh={
　　name:"小红",
　　word:"小白"
};
var xm={
　　name:"小明",
　　word:"资深WEB工程师"
};
var jx={
　　name:"杰西",
　　word:"项目总监"
};

//用call()显示：我叫xxx,我是工作是xxx
function obj()
{
　　console.log("我的名字是："+this.name+",我的工作是："+this.word);
}
obj.call(xh);
obj.call(xm);
obj.call(jx);
console.log("call---------------------------------------------------------------------");


//用call()显示：我叫xxx,我是工作是xxx,我的性别是xx,我的年龄是xxx
function obj2(sex,age)
{
　　console.log("我的名字是："+this.name+",我的工作是："+this.word+",我的性别是"+sex+",我的年龄是"+age);
}
obj2.call(xh); //我的名字是：小红,我的工作是：小白,我的性别是undefined,我的年龄是undefined
obj2.call(xm); //我的名字是：小明,我的工作是：资深WEB工程师,我的性别是undefined,我的年龄是undefined
obj2.call(jx); //我的名字是：杰西,我的工作是：项目总监,我的性别是undefined,我的年龄是undefined
console.log("call传参---------------------------------------------------------------------");
obj2.call(xh,"男",21); //我的名字是：小红,我的工作是：小白,我的性别是男,我的年龄是21
obj2.call(xm,"女",22); //我的名字是：小明,我的工作是：资深WEB工程师,我的性别是女,我的年龄是21
obj2.call(jx,"男",21); //我的名字是：杰西,我的工作是：项目总监,我的性别是男,我的年龄是21
console.log("apply传参---------------------------------------------------------------------");
obj2.apply(xh,["男",21]); //我的名字是：小红,我的工作是：小白,我的性别是男,我的年龄是21
obj2.apply(xm,["女",22]); //我的名字是：小明,我的工作是：资深WEB工程师,我的性别是女,我的年龄是21
obj2.apply(jx,["男",21]); //我的名字是：杰西,我的工作是：项目总监,我的性别是男,我的年龄是21

 

 

bind***********************************************

var info=["W3C",‘腾讯‘,‘淘宝‘,‘天猫‘,‘世界‘];
var it={
　　info:[‘万里‘,‘李薇‘,‘手动‘,‘速度‘],
　　getinfo:function(){
　　　　console.log(this.info.join(","));
　　}
}
it.getinfo(); //万里,李薇,手动,速度

var data=it.getinfo;
data(); //W3C,腾讯,淘宝,天猫,世界