JavaScript訪問父對象屬性

Question

我在JS中有一個小問題，我有兩個嵌套對象，我想從父進程中訪問變量，如下所示：

var parent = {
    a : 5,

    child: {
        b : 3,
        displayA : function(){
            console.log(this.a);
            //undefined
            },

        displayB : function(){
            console.log(this.b);
            //displays 3
            }
        }
}

我想知道如何使parent.child.displayA工作:)（我有需要訪問父變量的子對象）

任何幫助表示非常感謝！

Answer 1

您可以使用call來設置的值this ：

parent.child.displayA.call(parent); // 5

您可能也有興趣綁定它：

parent.child.displayA = function(){
  console.log(this.a);
}.bind(parent);
parent.child.displayA(); // 5

或者您可以使用parent代替this ：

parent.child.displayA = function(){
  console.log(parent.a);
};
parent.child.displayA(); // 5

Answer 2

您可以使用super.prop訪問父類屬性。 當然，只有你使用的是ES6。

Answer 3

Javascript是基於原型的 ，它不是像PHP或Java那樣的常規OOP語言。

看看繼承和原型鏈，並實現簡單的Javascript繼承之類的東西。

如果它位於全局范圍內，您可以通過window.parent訪問父級，但是您的示例在每種情況下都不起作用。

Answer 4

對象child沒有通用的方法知道它是父對象的成員。 在您的情況下，您可以直接引用displayA()的父對象，如下所示：

displayA : function(){
  console.log(parent.a);
}

您不需要將父項放在全局范圍內，並使用window.parent作為另一個答案建議; 因為您在parent范圍內聲明displayA ，所以該函數將關閉parent ，並且可以在child內的任何位置訪問它。 由於封包含對一個參考parent的對象，你會看到，以改變parent會的行為來體現displayA 。 例如，假設parent和child在您的示例中定義，除了displayA被修改為使用parent.a 。 然后：

parent.child.displayA(); //=> 5
parent.a = 10;
parent.child.displayA(); //=> 10

所有這些都說，如果你試圖模仿OOP，那么另一個答案是正確的：你應該閱讀更多關於Javascript原型鏈如何工作的內容。

Answer 5

我認為這樣做並沒有真正做到這一點，因為你只能通過其父對象訪問子對象。 那么為什么要添加一個mthod displayB給孩子，同時你可以將它添加到有權訪問所有子屬性的父級。

Answer 6

在您的示例中，您沒有繼承。 你可以這樣做

...
    displayA : function(){
        console.log(parent.a);
        // 5
    },
...
parent.child.parent = parent;
parent.child.displayA();