从它的构造函数创建新的对象实例答案

【问题标题】：Create new object instance away from it's constructor从它的构造函数创建新的对象实例
【发布时间】：2015-10-08 09:41:17
【问题描述】：

所以我不想在用户无需刷新客户端的情况下预览某些 UI 效果。我想通过创建我的 Anim 对象的新实例来做到这一点，该对象是使用简单的构造函数定义的。

function Anim(elem) {
  this.elem = elem
}

Amin.prototype.zoomIn = function() {
 // Do stuff
},

Amin.prototype.zoomOut = function() {
 // Do stuff
}

// obj is a jQuery object, like $('div');
var instance = new Anim(obj);

到目前为止一切都很好，但是如何在对象的构造函数之外创建一个新的对象实例？

这是在不同的文件中，试图创建一个新实例只是为了向用户预览它。我收到一条错误消息，告诉我：

动画未定义

我知道它超出了范围，但我如何使它可用？

$('span').on('click', function() {
    new Anim( $('div') );
});

【问题讨论】：

所以Anim 超出范围...您如何包含第一个文件？
Anim被定义为一个插件，没有命名空间，单独的文件。
确保Anim 可以从您的其他文件所在的任何范围访问，并且Anim 是在执行new Anim 时定义的。
@piggypig：你在说什么“插件”？一个jQuery插件？它使用什么模式？请显示完整的文件以及如何加载它。
@piggypig：那是一个jQuery插件。它不仅仅是一个构造函数，构造函数位于 IEFE 范围内，使其对外部不可见。您没有在那里创建全局变量

标签： javascript object constructor instance

【解决方案1】：

这里最好的方法是将你的Anim对象定义为一个模块，看看AMD (Asynchronus Module Definition)，然后你可以在任何地方导入我们的js文件并使用你的对象的新实例：

define(function(){
    var Anim = function(elem) {
        this.elem = elem;
        this.zoomIn = function() {
           // Do stuff
        };

        this.zoomOut = function() {
           // Do stuff
        }
    }
    return Anim;
});

将其放入文件中，命名为Anim.js。

然后只需将此文件包含在您的 HTML 页面或任何其他 JS 文件中，并创建 Anim 对象的新实例：

define([pathToyourFile.Anim],function(Anim){
    $('span').on('click', function() {
        var instance = new Anim( $('div') );
    });
});

有关 AMD 模块的更多信息，请查看：

【讨论】：

太棒了，这种方法完全有意义。正在解决这个问题，谢谢！
很高兴它有帮助，是的，它确实非常强大，几乎所有新的 JavaScript 库都基于它。