访问 javascript 对象的属性返回未定义，为什么？

Question

我正在尝试学习如何在另一个 .js 文件中创建 JavaScript 类并从其他任何地方访问它。 我读了几个例子，但似乎不能完全理解它。

例如，我如何访问以下内容：

 //code in file2.js getterTest = (function() { var _x = 15; return { doSomething: function() { _x += 5; }, get x() { return _x; } } }); //code in file1.js console.log(getterTest._x); //undefined console.log(getterTest.x); //should give 15 getterTest.doSomething(); console.log(getterTest.x); //should give 20

但这一切都给出了undefined并且.doSomething方法给出了not a function 。

我现在要回家，按照@Liam 的建议阅读更多关于关闭的信息，然后看看明天会发生什么。

Answer 1

好的，让我们分解一下

getterTest = (function() {});

getterTest是一个函数指针。 即它是一个保存未调用函数的变量。

如果我做：

getterTest = (function() {});
getterTest();

我调用了这个函数。

如果我做：

getterTest = (function() {});
var result = getterTest();

结果包含从 getterTest 函数返回的函数，即一个包含函数和 gettable x 属性的对象 ( {} )

result = {
    doSomething: function() {
       _x += 5;
    },

    get x() {
        return _x;
    }
}

所以我可以这样做：

getterTest = (function() {});
var result = getterTest();
result.x;

TL; 博士

确实如此； 你想要的是getterTest像这样工作：

getterTest = function() {
var _x = 15;

return {
    doSomething: function() {
       _x += 5;
    },

    get x() {
        return _x;
    }
}
}();
//invoke the function and store this in your variable by adding () above    

//code in file1.js
//console.log(getterTest._x);         //this is private so can't be accessed (you can only access things that are returned)
console.log(getterTest.x);         //should give 15
getterTest.doSomething();
console.log(getterTest.x);        //should give 20

小提琴

您不能在闭包之外访问 _x，因为它的作用域是函数。 本质上，这就是闭包的要点。 将事物保持在范围内并保持“全局上下文”清洁。

---

供参考

您可能会注意到我在上面交替使用“函数”和“对象”。 不习惯 Javascript 的人会觉得这很奇怪，但这是有充分理由的。 在 Javascript 中，函数是一个对象o_O

同样，这是您在这里尝试实现的主要目标之一。 基本上都是关于封装的

Answer 2

请这样做，

//code in file2.js
getterTest = (function() {
    var _x = 15;
    return {
        doSomething: function() {
           _x += 5;
        },

        get x() {
            return _x;
        }
    }
}()); // added '()'


//code in file1.js
console.log(getterTest._x);         //undefined
console.log(getterTest.x);         //15
getterTest.doSomething();
console.log(getterTest.x); 

Answer 3

您需要实例化类，然后调用函数。

var g = getterTest(); 
console.log(g.x);         //15
g.doSomething();
console.log(g.x); //20

如果您在每次调用时调用getterTest() ，它将始终获得该类的新版本

console.log(getterTest().x);         //15
getterTest().doSomething();
console.log(getterTest().x); //15

我知道这对你来说并不理想。 但这是调用file2.js函数的正确方法 其他选择是重写file2.js
祝你好运！