this和物件原型
this是一個很特別的關鍵字，被自動定義在所有函數的作用域中
# // foo.count 是0，字面理解是錯的
function foo(num) {
console .log("foo:"+ num);
this.count++;
}
foo.count = 0;##o.
## for(i=0;i<10;i++){
if(i>5){
# }
console.log(foo.count) //0
//
使用詞法作用域解決問題
function foo(num) {
console.log("foo:"+ num); data.count++;
#}
# data.count++;
#}
#var data = {
count:0
};
var i;
for(i=0;i<10;i++){
if(i>5){
foo(i)
## }
}
console.log(data.count. ); // 4
//
用
foo標識符來取代this來引用函數物件,迴避了this 的問題，完全依賴變數foo的詞法作用域。 function foo(num) {
console.log("foo:"+ num);
foo.count++;
#}
foo.count = 0
var i;
##for(i=0;i<10;i++){
if(i>5 ){
foo(i)
}
}
#console.log(foo.count) //4
#
console.log(foo.count) //4
#
//強制#this 指向foo
函數物件
###################################################都##### function foo(num) {###### console.log("foo:"+num);###### # foo.count = 0;###### var i;###### for(i=0; i< 10; i++){##### #### foo.call(foo,i);###### foo.call(foo,i);###### }###############
}
console.log(foo.count) //4
this是運作是綁定的，並不是寫時所綁定的，它的上下文取決於函數呼叫時的各種條件，this的綁定和和函數宣告的位置沒有任何關係，只取決於函數呼叫的方式。
this全面解析
呼叫堆疊與呼叫位置
function baz(){
//目前呼叫堆疊是：baz
// 因此，目前的呼叫中位置是全域作用域
console.log("baz");
bar(); // <--bar的呼叫位置
##}
function bar(){
//
目前的呼叫堆疊是： baz-> bar//
因此，目前呼叫位置在baz
console.log("bar);
foo(); // <-- foo
的呼叫位置
}
function foo(){
//
目前的呼叫堆疊是： baz-> bar->foo//
因此，目前呼叫位置在bar##console.log( "foo");
}
baz(); // <-- baz
的呼叫位置
##
只有運行在非
strict mode
下，預設綁定才能綁定到全域物件。一層灰影響呼叫位置。 obj2 = {a: 42,foo:foo
};var obj1 = {
a:2,
obj2: obj2
};
obj1.obj2.foo(); // 42
硬綁定的典型應用場景就是建立一個包裹函數，傳入所有的函數並傳回接收到的所有的值。 );
return this.a + something;
};
#var obj = {
a:2
};
var bar = function() {
return foo.apply(obj,arguments);
};
#var b = bar(3) ; // 2 3
console.log(b) // 5
另一種方法是建立一個
i
可以重複使用的輔助函數
function foo(something){
console.log(this.a, something);
#return this.a + something;
}
//
簡單的輔助綁定函數
function bind(fn,obj){
return function(){
return fn.apply(obj,arguments);};
}
var obj = {
a:2
}
var bar = bind(foo,obj);
var b = bar(3); // 2 3
console.log(b) // 5
ES5 中提供了內建的方法Function.prototype.bind, bind(..) #會回傳一個硬編碼的新函數，它會
把參數設定為this的上下文並呼叫原始函數。
function foo(something){
console.log(this.a, something);
return this.a + something;
}
var obj = {
a:2
}
var bar = foo.bind(obj);
# var b = bar(3); // 3 5
console.log(b) // 5
API 呼叫的上下文
function foo(el){
console.log(el,this.id);
}
var obj = {
id: "awesome'
}
// 呼叫#foo(..)時把 this 綁定到obj
[1,2,3].forEach(foo,obj);
// 1 awesome 2 awesome 3 awesome
new可以影響函數呼叫時this 綁定行為的方法。 (a){
this.a = a;
}
var bar = new foo(2);
console.log(bar. a); // 2
判斷
this
1.函數是否在
new 中呼叫（ new 綁定）？ #var bar = new foo();2.函數是否透過call , apply (顯示綁定
)
或硬綁定呼叫？ #va bar = foo.call(obj2)
3.函數是否在某個上下文物件中呼叫(隱含綁定 ) ？ var bar = obj1.foo()4.如果都不是的話，使用預設綁定。如果在嚴格模式下，就綁定到
undefined,
否則綁定到全域物件上。 var bar = foo();軟體綁定function foo(){console. log("name:" + this.name);}
var obj = {name: "obj"},
obj2 = {name: "obj2" },
obj3 = {name: "obj3"},obj3 = {name: "obj3"};
var foo0BJ = foo.softBind(obj);
foo0BJ(); // name:obj
obj2.foo = foo.softBind(obj);
obj2.foo = foo.softBind(obj);
#obj2.foo(); // name:obj3 <--
看！
setTimeout(obj2.foo,10);
// name:obj <---
應用了軟體綁定
#
####### ###
以上是javaScript中this和物件原型的實例教程的詳細內容。更多資訊請關注PHP中文網其他相關文章！
