訪問對象和分配變量

Question

我正在學習「Javascript：從基礎到功能JS」課程，並且我有一個關於對象的問題。我寫了這段代碼作爲答案

'make the line box[innerBox2].full = false'不會拋出錯誤。

編輯 - 改變了一些變量的名字（希望）可以很清楚的，我很困惑

我的回答如下：

var box = {}; 

//Initialize the property box.myInnerBox to empty object 
box.myInnerBox = {}; 

//Create a new variable to point to the value of box.MyInnerBox, which should be an empty object 
var insideBox = box.myInnerBox; 

box[insideBox].full = false; // Throws Error 

但是，這是行不通的。當我將var innerBox2分配給box.innerBox2時，它似乎不喜歡它。爲什麼上面的代碼不工作，而下面的代碼呢？具體來說，它如何知道'otherBox'是沒有第一個引用框的框的屬性？爲什麼我不能將變量分配給框的屬性？ 我的問題不是關於如何使用括號vs點符號。我的問題是，爲什麼分配var innerBox2到box.innerBox2值不起作用

var box ={}; 
box.otherBox = {}; 

var innerBox2 = 'otherBox'; 

box[innerBox2].full = false; // No Error 

非常感謝。

Answer 1

好了，讓我們開始爲什麼第二個作品。

基本上你訪問對象屬性的兩種方式：通過詢問someObject.someProperty和someObject['someProperty']

你正在做在第二種情況下什麼是分配string「otherBox」變量命名innerBox2，然後試圖訪問一個對象的屬性對象的變量名稱如box[innerBox2]，其翻譯爲box['otherBox']。

我們第一種情況。您已經創建了一個對象和一個屬性，它具有空對象{}的值。然後，您將從box.innerBox2返回的值分配給名爲innerBox2的變量。該變量現在擁有一個只是一個空對象的值，它實際上就是這個var innerBox2 = {}。現在您試圖訪問box對象上的一個屬性，該屬性只有innerBox2屬性，其值爲空對象。但通過做box[innerBox2]現在字面意思是box[{}]這是沒有意義，因此是錯誤。

我希望它對您有意義。隨意問任何更多它不清楚。

Answer 2

您遇到的問題是JavaScript中的對象是如何工作的理解 - 請參考以下內容：https://developer.mozilla.org/en-US/docs/Web/JavaScript/Guide/Working_with_Objects

要回答你的問題，因爲你使用上的括號標記的第一個例子不工作目的。括號符號必須帶一個字符串（否則它會將你輸入的字符串轉換成一個字符串，這可能不是你所期望的） - 這就是爲什麼第二個例子能夠工作。

嘗試這些兩個代碼段，它們是等效的：

var box = {}; 
box.innerBox = {}; 
box.innerBox.filled = false; 

和

var box = {}; 
box['innerBox'] = {}; 
box['innerBox']['filled'] = false; 

括號符號和點符號可以互換使用。點符號更適合可讀性，通常更方便。如果您想基於可以傳遞到括號中的變量設置/獲取括號符號，則該符號很有用。

Answer 3

托架符號需要一個字符串，其值是屬性的名稱。如果你使用一個對象，那麼它會被轉換成一個String。

innerBox2最終被轉換爲字符串「[對象的對象]」，所以這是該屬性它試圖訪問，而不是「innerBox2」。