javascript - 创建远离其构造函数的新对象实例

标签 javascript object constructor instance

所以我不想在用户不必刷新客户端的情况下预览某些 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);

到目前为止一切顺利,但是如何在远离构造函数的情况下创建对象的新实例?

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

Anim is not defined

我知道它超出了范围,但如何使其可用?

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

最佳答案

这里最好的方法是将您的 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 - 创建远离其构造函数的新对象实例,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/31496641/

相关文章:

javascript - Backbone.js + GUI : do i have to build the gui with views and models or do I load it with the html from start

javascript - 如何通过 Lodash 将字符串转换为对象

Java - 如何在没有对象引用的情况下使用方法

Java - 为构造函数的每个实例定义不同的变量?

javascript - 使用字符串 "constructor"作为 JavaScript 对象中的键

javascript - 在vue js中设置div的高度

javascript - javascript 下载链接如何工作?

javascript - 将键值(对象)对添加到数组中的所有对象

c++ - 类中 c++ 析构函数的 xCode 问题

javascript - 如何将 JavaScript 响应转换为 HTML