javascript - 如何在 JS API 中不使用 `new` 运算符?

标签 javascript

所以我遇到了this article Baranovskiy 先生基本上说人们不应该使用 new 运算符来使用您的 api。我创建了 this basic example它允许您使用这行代码创建 colorBox 的实例 var box = new colorBox(node, options);

如何在不使用 new 运算符的情况下实现示例中的内容?

JS:

var colorBox = function(node, options) {
    this.setSize = function(){
        node.style.width = options.width + 'px';
        node.style.height = options.height + 'px';
    }
    this.setColor = function(color){
        node.style.backgroundColor = color || options.color;
    }
    this.setSize();
    this.setColor();

}

var node = document.getElementById('thing1');
var options = {
    color: 'red',
    width: 200,
    height: 200
}

var box = new colorBox(node, options);

setTimeout(function(){
    box.setColor('blue');
}, 2000);

最佳答案

首先,我不同意这篇文章 - 我认为 new 是编写代码的一种非常合理的方式,并且清楚地表明您正在创建“类”的实例,就像任何面向对象的语言一样。

但是……

看看 this answer 上的第二种方法, 它显示了如果调用者离开 new (如果 this 不是“类”的实例,则调用者离开 newthis 可能是全局窗口)。这是一种不需要用户键入 new 的方法,同时仍然每次都安全地返回一个新实例。

var colorBox = function(node, options) {
    if (!(this instanceof colorBox))
        return new colorBox(node, options);

    // do the rest of your constructor stuff
};

关于javascript - 如何在 JS API 中不使用 `new` 运算符?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/17867127/

相关文章:

javascript - 在 gulp.series() 中使用 del

javascript - 这段代码似乎没有按顺序触发?

javascript - 如何让类构造函数在 Nodejs 中创建新实例时发出事件

javascript - Emberjs 使用 hasMany/belongsTo 创建记录

javascript - 单击文档而不是特定元素警报

javascript - 尝试将 json 对象数组放入 knockout 可观察数组时出现奇怪的行为(包括 jsfiddle)

javascript - 使用 requestAnimationFrame 创建无限事件循环是否有性能成本

javascript - Meteor.Call 奇怪的行为

javascript - 比较表数据,如果表数据是,则添加 CSS

javascript - 如何用jquery限制多个元素的字符串长度?