首頁猿問 javascript對象、this...

javascript對象、this、作用域和閉包的問題。

JavaScript

云淡風輕的天空 2016-10-29 01:02:50

以下幾段代碼，輸出的結果不一樣。希望有大神可以解答一下原理，謝謝！ var?myvar?=?"TheWindow"; var?object?=?{ myvar?:?"MyObject", getVar?:?function(){ return?function(){ return?myvar; }; } }; console.log(object.getVar()());//輸出TheWindow function?MyCont(){ var?myvar?=?"MyObject"; this.getVar?=?function(){ return?function(){ return?myvar; }; } } var?obj?=?new?MyCont(); console.log(obj.getVar()());//輸出MyObject 然后我修改了一下，加上了this，輸出結果又不同了。 var?myvar?=?"TheWindow"; var?object?=?{ myvar?:?"MyObject", getVar?:?function(){ return?function(){ return?this.myvar;//此處加入了this，依舊輸出TheWindow }; } }; console.log(object.getVar()()); function?MyCont(){ var?myvar?=?"MyObject"; this.getVar?=?function(){ return?function(){ return?this.myvar;//此處加入了this，輸出變成了TheWindow，而不是原先的MyObject }; } } var?obj?=?new?MyCont(); console.log(obj.getVar()()); 然后我再改一下 var?myvar?=?"TheWindow"; var?object?=?{ myvar1?:?"MyObject", getVar?:?function(){ return?function(){ return?myvar1;//雖然object內含有myvar1屬性，但是這樣寫會報錯,但是如果寫this.myvar1的話就不報錯，輸出undefined }; } }; console.log(object.getVar()()); var?myvar?=?"TheWindow"; var?object?=?{ myvar?:?"MyObject", getVar?:?function(){ ??return?myvar;//此處去掉了function，還是輸出TheWindow } }; console.log(object.getVar()); var?myvar?=?"TheWindow"; var?object?=?{ myvar?:?"MyObject", getVar?:?function(){ ??return?this.myvar;//對比上面，加入了this，則輸出的是對象屬性MyObject } }; console.log(object.getVar()); 最后還是要感謝一下，好心人幫忙解答問題，萬分感謝！

查看完整描述

1 回答

已采納

stone310

TA貢獻361條經驗獲得超191個贊

1、局部作用域，也稱函數(shù)作用域，定義在函數(shù)內部，函數(shù)外部無法獲?。赏ㄟ^閉包獲取）;

2、全局作用域，定義在函數(shù)外，函數(shù)內部可以獲??；

3、當一個變量在函數(shù)內部使用，會先去獲取函數(shù)內部這個變量的值，如果不存在，則去獲取函數(shù)外部這個變量的值；

4、this是在被調用的時候才確定的；

5、this的確定是根據(jù)被調用的方法是屬于哪個對象的方法，存在這個對象，this指向它，不存在，this指向window；

6、以下的閉包內部的this全部指向window

????var?myvar?=?"TheWindow";
????var?object?=?{
????????myvar?:?"MyObject",
????????getVar?:?function(){
????????????return?function(){?????????????//閉包
????????????????return?myvar;?????????//函數(shù)作用域內部無myvar變量，則顯示全局變量的值
????????????};
????????}
????};
????console.log(object.getVar()());//輸出TheWindow
????
????
????function?MyCont(){
????????var?myvar?=?"MyObject";
????????this.getVar?=?function(){
????????????return?function(){??????????//閉包
????????????????return?myvar;????????????//函數(shù)作用域內部有myvar變量，則顯示內部變量的值
????????????};
????????}
????}
????var?obj?=?new?MyCont();
????console.log(obj.getVar()());//輸出MyObject
????

????var?myvar?=?"TheWindow";
????var?object?=?{
????????myvar?:?"MyObject",
????????getVar?:?function(){
????????????return?function(){???????//閉包
????????????????return?this.myvar;//此處加入了this，依舊輸出TheWindow???????
??????//因為這里閉包并不是作為某個對象的方法被調用，因此內部的this指向window，window.myvar就是變量myvar的值
????????????};
????????}
????};
????console.log(object.getVar()());


function?MyCont(){
????var?myvar?=?"MyObject";
????this.getVar?=?function(){
????????return?function(){
????????????return?this.myvar;//此處加入了this，輸出變成了TheWindow，而不是原先的MyObject???
????????????//道理和上面例子相同，閉包內this指向window
????????};
????}
}
var?obj?=?new?MyCont();
console.log(obj.getVar()());


var?myvar?=?"TheWindow";
var?object?=?{
????myvar1?:?"MyObject",
????getVar?:?function(){
????????return?function(){
????????????return?myvar1;//雖然object內含有myvar1屬性，但是這樣寫會報錯,但是如果寫this.myvar1的話就不報錯，輸出undefined
??????????//這里涉及到JS變量和屬性的應用，return?myvar1的時候，myvar1是變量，而無論是局部作用域還是全局作用域都沒有myvar1這個變量，因此報錯，未定義；
??????????//如果return?this.myvar1，通過上面的例子，這里this指的是window，這時候myvar1是作為一個屬性，如果這個屬性不存在，只會提示undefined，而不會報錯；
????????};
????}
};
console.log(object.getVar()());

var?myvar?=?"TheWindow";
var?object?=?{
????myvar?:?"MyObject",
????getVar?:?function(){
????????return?myvar;//此處去掉了function，還是輸出TheWindow??
????//因為局部作用域中并沒有myvar這個變量，然后就去查找全局作用域，所以是TheWindow，這里MyObject的這個myvar是屬于object的屬性
????}
};
console.log(object.getVar());


var?myvar?=?"TheWindow";
var?object?=?{
????myvar?:?"MyObject",
????getVar?:?function(){
????????return?this.myvar;//對比上面，加入了this，則輸出的是對象屬性MyObject???
??????//getVar是在object對象上被調用的一個方法，因此它的this指的是object，因此object.myvar就是MyObject
????}
};
console.log(object.getVar());

1 反對回復 2016-10-29