JavaScript 访问父对象属性答案

【问题标题】：JavaScript access parent object attributeJavaScript 访问父对象属性
【发布时间】：2015-06-26 09:03:19
【问题描述】：

我在 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 工作:)（我有需要访问父变量的子对象）

任何帮助表示赞赏非常感谢！

【问题讨论】：

在displayA 函数中，您正在引用“this”并尝试访问其“a”属性。这里对“this”的调用是指子对象而不是父对象。如果您使用构造函数，则可以将其父对象的上下文 (this) 传递给子对象。或者你可以使用 call 或 bind 方法。

标签： javascript oop object

【解决方案1】：

您可以使用super.prop 访问父类属性。当然，前提是你使用的是 ES6。

【讨论】：

【解决方案2】：

在您的示例中，您没有继承。你可以这样做

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

【讨论】：

【解决方案3】：

你可以使用call来设置this的值：

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

你可能也对binding它感兴趣：

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

【讨论】：

【解决方案4】：

我认为这样做并没有什么意义，因为您只能通过其父对象访问子对象。那么为什么要向孩子添加一个方法 displayB 而您可以将它添加到可以访问所有子属性的父级。

【讨论】：

【解决方案5】：

对象child 没有通用方法知道它是父对象的成员。在您的情况下，您可以直接引用 displayA() 中的父对象，如下所示：

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

您不需要将 parent 放在全局范围内并使用 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 原型链如何工作的信息。

【讨论】：

【解决方案6】：

Javascript 是prototype based，它不是像 PHP 或 Java 这样的常规 OOP 语言。

看看Inheritance and the prototype chain 并实现类似Simple Javascript inheritance 的东西。

如果它在全局范围内，您可能可以通过window.parent 访问父级，但您的示例并非在所有情况下都有效。

【讨论】：