Question

我正在尝试创建一个由我的组中的项目常用的UI组件的JavaScript库。我有以下代码来定义库。

var libName = function() {
    var _libName = this;

    _libName.componentName = function () {
        // Some Private Variables

        var _componentName = function (args) {
             // Construct the object...
        };

        _componentName.addObject = function (args) {
            // Add an object...
        };

        _componentName.removeObject = function (args) {
            // Remove an object...
        };

        return _componentName;
    }();

    return _libName;
}();

现在，当我在页面中使用它来创建组件时，我调用以下代码。

var component = new libName.componentName(args);

初始化很好并创建我期望的基本组件。现在我想向组件添加一些数据，所以我调用了以下函数。

component.addObject(someObject);

但是它不是像我期望的那样调用函数，而是说组件对象没有属性'addObject'。我用下面的代码调查了这个。

if (libName.componentName.addObject) {
    console.log("libName.componentName.addObject exists");    // Logs
} 

if (component.addObject) {
    console.log("component.addObject exists");                // Doesn't log
}

if (component.constructor.addObject) {
    console.log("component.constructor.addObject exists");    // Logs
}

所以我的问题是这里到底发生了什么？为什么对象（在本例中为组件）无法访问我期望的属性/函数？这是否与我使用memoized闭包来定义库这一事实有关？如何使从该库初始化的对象可以访问这些属性/函数？

Answer 1

使用函数的原型来定义实例方法：

    _componentName.prototype.addObject = function (args) {
        // Add an object...
    };

    _componentName.prototype.removeObject = function (args) {
        // Remove an object...
    };

您的脚本不起作用，因为您正在调用_componentName属性，如果在对象上直接定义，则不会传递给_componentName的实例。请记住使用 new 意味着使用原型继承。 Javascript没有基于类的继承。

从闭包中实例化为“new”的对象不能直接访问返回对象的属性

1 个答案: