爲什麼在這個例子中溝渠'this'是有益的

我想通過在線視頻課程來掌握Javascript的概念，我在下面找到這個例子。 https://www.youtube.com/watch?v=9oi0NY8Pen8 爲什麼在這個例子中溝渠'this'是有益的

教員用這個例子第一

var carlike = function(obj, loc) { 
    obj.loc = loc; 
    obj.move = function() { 
    this.loc++; 
    }; 
    return obj; 
}; 

var amy = carlike({}, 1); 
amy.move();

再變carlike功能

var carlike = function(obj, loc) { 
    obj.loc = loc; 
    obj.move = function() { 
    obj.loc++; 
    }; 
    return obj; 
};

話說Instead of referring to the parameter this which gets bound to a new value each time move is invoked we can use obj

是this越來越如何綁定到新的價值。如何使用obj防止這種情況。

來源

2015-04-04 Saad

這是什麼變化？這兩個代碼對我來說都是一樣的 – thefourtheye 2015-04-04 05:17:06

在任何'function'中'this'的值是由它的調用時間決定的，而不是由它的定義決定的。 [這個「關鍵字如何工作？]（http://stackoverflow.com/questions/3127429/how-does-the-this-keyword-work） – 2015-04-04 05:24:59

@ JonathanLonowski-mod [* bind *]（http：/ /ecma-international.org/ecma-262/5.1/#sec-15.3.4.5）。 ;-) – RobG 2015-04-04 05:40:04

當您撥打amy.move()時，move內的「變量」this獲得值amy，這是一個對象。如果move包含代碼this.loc++，則屬性amy.loc的值將遞增。

但是，您可以用其他方式調用該函數。例如：

var func = amy.move; // copies reference to function into variable func 
func();    // "this" is unspecified

在上述情況下，因爲this未指定，則默認爲window（在非嚴格模式）或undefined（嚴格模式）。

或者：

var bill = { loc: 4 }; 
amy.move.call(bill); // "this" is bill, not amy

在另一方面，如果move功能包含代碼obj.loc++，那麼它會一直增加同一對象的loc：即，傳遞給carlike時，這種情況下，一個的move創建：

var amy = carlike({}, 1); 
var bill = { loc: 4 }; 
amy.move.call(bill); // "this" is bill, not amy 
console.log(amy.loc); // prints 2 
console.log(bill.loc); // prints 4

的move功能，創建時，對當地v成爲一個closurecarlike內的可變obj。

在這個小例子中，這樣做沒有什麼特別的好處，但是閉包通常是一種強大的技術。

來源

2015-04-04 05:40:46 radiaph

非常感謝！ :) – Saad 2015-04-04 05:46:30

由於在javascript中的this是在函數調用時決定的。在內部使用它會導致不需要的錯誤。如果您使用amy.move()自己調用該函數，則可能不會意識到這一點。

例：

var carlike = function(obj, loc) { 
    obj.loc = loc; 
    obj.move = function() { 
    console.log(this); 
    this.loc++; 
    }; 
    return obj; 
}; 

var amy = carlike({}, 1); 
amy.move(); => this will corresponds to object which are returned from constructor. 

setTimeout(amy.move, 1000) => this will corresponds to window

由於構造函數返回的對象，它的安全使用obj中的功能amy內。

編號：this in javascript

來源

2015-04-04 05:43:52 Sriharsha

「* ...導致不需要的錯誤*」你的意思是可能有想要的錯誤？ ;-) – RobG 2015-04-04 05:46:01

如果你知道如何使用bind/fat箭頭，那麼它很好，否則你肯定會得到一個討厭的bug！ – Sriharsha 2015-04-04 05:54:09

當你調用移動功能：

amy.move();

那麼你設置內移動到艾米的這個值。如果你這樣做：

var b = amy.move; 
b();

你現在調用該函數不設置這個，所以它默認爲在非嚴格模式下，全局/窗口對象，並在嚴格的模式是不明確的。通過使用：

obj.loc = loc; 
    obj.move = function() { 
    obj.loc++; 
    };

那麼功能保持通過關閉一個參考OBJ，所以無論功能如何被調用，OBJ始終引用最初傳遞給carlike的對象。

來源

2015-04-04 05:44:09 RobG

爲什麼在這個例子中溝渠'this'是有益的

回答

相關問題