this:this的指向在函數(shù)定義的時(shí)候是確定不了的,只有函數(shù)執(zhí)行的時(shí)候才能確定this到底指向誰(shuí),實(shí)際上this的最終指向的是那個(gè)調(diào)用它的對(duì)象
1.非構(gòu)造函數(shù)版this
1.1?
var user ="hehe";?
function a(){
? ? var user ="追夢(mèng)子";
? ? console.log(this.user); //hehe
????console.log(this); //Window
}
a(); ? 相當(dāng)于window.a()籽暇,因?yàn)閣indow調(diào)用了a()温治,所以a()內(nèi)的this代表window。
1.2 var o = {
? ? user:"追夢(mèng)子",
? ? fn:function(){
? ? ? ? console.log(this.user);//追夢(mèng)子? ??
????????????}
}
o.fn(); o調(diào)用fn戒悠,所以this指向o
1.3 ?var o = {
? ? a:10,
? ? b:{
? ? ? ? a:12,
? ? ? ? fn:function(){
? ? ? ? ? ? console.log(this.a);//undefined ?
????????????console.log(this);//window? ? ? ? }
? ? }
}
var j = o.b.fn;
j(); //此時(shí)this指向window
2.構(gòu)造函數(shù)版this
指向?qū)嵗龑?duì)象
2.1 function Fn(){
? ? this.user = "追夢(mèng)子";
}
var a =new Fn();
console.log(a.user); //追夢(mèng)子 this指向a對(duì)象
2.2?function fn()
{?
? ? this.user = '追夢(mèng)子';?
? ? return {name:"haha"}; //或者:return function(){};
}
var a =new fn;?
console.log(a.user); //undefined ?
console.log(a.name); // haha
由于返回了一個(gè)新對(duì)象,這個(gè)對(duì)象不是fn構(gòu)造出來(lái)的熬荆,所以不具有fn的特性;
2.3?function fn()
{?
? ? this.user = '追夢(mèng)子';?
? ? return 1; //或者:return undefined;
}
var a =new fn;?
console.log(a.user); //追夢(mèng)子
3.call和apply
相同點(diǎn):改變函數(shù)內(nèi)部的this指向
不同點(diǎn):接收參數(shù)方式不同?
3.1 apply(obj,[argArray]), call(obj,arg1,arg2,arg3...)
function add(c,d){?
?????return this.a + this.b + c + d;
}
var s = {a:1, b:2};
console.log(add.call(s,3,4)); // 1+2+3+4 = 10? ??
console.log(add.apply(s,[5,6])); // 1+2+5+6 = 14
3.2? window.firstName = "Cynthia";
? ? ? ? window.lastName = "_xie";
? ? ? ? var myObject = {firstName:'my', lastName:'Object'};
? ? ? ? function getName(){? ? ? ? ? ??
????????????????console.log(this.firstName + this.lastName);
? ? ? ? }
? ? ? ? function getMessage(sex,age){? ? ? ? ? ??
????????????????console.log(this.firstName + this.lastName + " 性別: " + sex + " age: " + age );
? ? ? ? }
? ? ? ? getName.call(window); // Cynthia_xie? ? ? ?
?????????getName.call(myObject); // myObject? ? ? ??
????????getName.apply(window); // Cynthia_xie? ? ? ??
????????getName.apply(myObject);// myObject? ? ? ??
????????getMessage.call(window,"女",21); //Cynthia_xie 性別: 女 age: 21? ? ? ??
????????getMessage.apply(window,["女",21]); // Cynthia_xie 性別: 女 age: 21? ? ? ??
????????getMessage.call(myObject,"未知",22); //myObject 性別: 未知 age: 22? ? ? ?
?????????getMessage.apply(myObject,["未知",22]); // myObject 性別: 未知 age: 22
4.Bind
改變函數(shù)的this指向不同的是產(chǎn)生了新的函數(shù)對(duì)象
????????? var bar= function(){
? ? ? ? ? ????? console.log(this.x);
? ? ? ? ?}
? ? ? ? varfoo={
? ? ? ? x:3
? ? ? ? }
? ? ? ? bar() ? //undefined
? ? ? ? bar.bind(foo)()//3
5.argument
1救崔、我們可以借用arguments.length可以來(lái)查看實(shí)參和形參的個(gè)數(shù)是否一致:
function add(a,b){
? ? var reallyLen = arguments.length; //實(shí)參
? ? console.log("really arg len",reallyLen);
? ? var funcLen = add.length; //形參
? ? console.log("func arg len",funcLen);
}
add(1,2,3,4,5)
// [Log] really arg len – 5
// [Log] func arg len – 2
2.我們可以借用arguments.callee來(lái)讓匿名函數(shù)實(shí)現(xiàn)遞歸:
var?sum?=?function(n)?{??
if(n?==?1)?{??
return?1;??
}else?{??
return?n?+?arguments.callee(n-1);??
}??
}??
console.log("sum?=",?sum(5));?