UnCaught TypeError - Javascript 中的嵌套对象？为什么不允许这样做？对象文字符号有效

Question

玩一些 JS 测试，我试图在我的 v 命名空间中实例化一些嵌套对象。正如您将在下面看到的，ClassA 和 ClassB 按预期工作。当我尝试将一些对象嵌套在另一个属性 (myCustomProperty) 下时，我开始运行遇到问题！有人可以解释一下吗？

原代码如下：

var v = (v) ? v : {};

v.someClassA = (function() {
   this.hello = function() {
        console.log("Class A Hello!");
    }
});

v.someClassB = (function() {
   this.hello = function() {
        console.log("Class B Hello!");
    }
});

// this all works! 
var myClassA = new v.someClassA();
var myClassB = new v.someClassB();


v.myCustomProperty = (function() {

    function someClassC() {
        this.hello = function() {
            console.log('C');
        }
    }

    function someClassD() {
        this.hello = function() {
            console.log('D');
        }
    }

    return {
        someClassC: someClassC,
        someClassD: someClassD
    }
});

// Uncaught TypeError: v.myCustomProperty.someClassC is not a function! Why?
var myClassC = new v.myCustomProperty.someClassC();
var myClassD = new v.myCustomProperty.someClassD();

myClassA.hello();
myClassB.hello();
myClassC.hello();
myClassD.hello();

如果我将 v.myCustomProperty 的声明更改为使用对象字面量表示法，那么一切正常！ :

v.myCustomProperty = {
    someClassC: function() {
        this.hello = function() {
            console.log('C');
        }
    },
    someClassD: function() {
        this.hello = function() {
            console.log('D');
        }
    }
 }

我想我的问题实际上是如何使用原始代码段中的符号来完成这项工作？可能的？这样做的可怕做法？

谢谢！

Answer 1

v.myCustomProperty 是一个函数即 returns 一个对象。您必须先调用该函数：

new (v.myCustomProperty().someClassC)();
//                     ^^

否则，v.myCustomProperty.someClassC() 会尝试访问函数的属性 someClassC，我们都知道（希望）函数没有这样的属性 .

或者您打算立即执行函数并将对象分配给 myCustomProperty？

v.myCustomProperty = (function() {
  // ...
}()); // <- call function

UnCaught TypeError - Javascript 中的嵌套对象？为什么不允许这样做？对象文字符号有效

UnCaught TypeError - Nested objects in Javascript? Why is this not allowed? Object literal notation works

javascript

constructor

class

object

object-literal