0

我正在尝试创建一个 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
}

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

4

1 回答 1

1

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

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

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

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

于 2013-02-23T18:57:07.617 回答