Question

我有一个简单的场景如下：

在HTML页面上，有一个显示项目列表的简单表格。此网格已选中所有复选框功能。

使用单击复选框时，应选择网格中的所有项目。

我正在使用以下脚本开始：

(function (window, $) {

    var UnfreezeTest = function () {
        return new UnfreezeTest.init();
    }

    //Create prototype to add new methods here 

    UnfreezeTest.prototype = {
        selectAll: function (chkAllElement) {
            $(".js-chk input[type='checkbox']").attr("checked", chkAllElement.checked);
        },
        reset: function () { 

        }
    };

    UnfreezeTest.init = function () {
        //Initialize any object here 
        //Example 
        //this.propertyName = value;
    }

    //Assign prototype for newly created object to point to the methods
    UnfreezeTest.init.prototype = UnfreezeTest.prototype;

    window.UnfreezeTest = UnfreezeTest;


} (window, jQuery));

我不想在创建对象时使用new运算符。

我想使用如下：

var obj = UnfreezeTest();

有任何建议或我做得对吗？

Answer 1

如果我理解正确，为了创建原型的实例，我想你想要更像下面这样的东西：

＆＃13;

var UnfreezeTest = function (tableId) {
	this.tableId = tableId;
}

UnfreezeTest.prototype = {
	selectAll: function (chkAllElement) {
		$('#' + this.tableId + " .js-chk input[type='checkbox']").attr("checked", chkAllElement.checked);
	},
	reset: function () { 

	}
};

var unfreeze1 = new UnfreezeTest('myTable1');
unfreeze1.selectAll();


var unfreeze2 = new UnfreezeTest('myTable2');
unfreeze2.selectAll();

＆＃13;

希望有所帮助

Answer 2

不幸的是答案是“不，你做得不对。”

推理是

UnfreezeTest是一个工厂函数，而不是构造函数。它返回一个对象。因此，使用new UnfreezeTest()调用它没有任何区别 - 它返回UnfreezeTest.init的实例，其中呼叫中使用的new运算符将传回给调用者。
UnfreezeTest.init是构造函数。应在UnfreezeTest.init.prototype。
在UnfreezeTest.prototype上设置继承的属性，然后将UnfreezeTest.init.prototype设置为UnfreezeTest.prototype，然后通过调用UnfreezeTest.init返回UnfreezeTest的实例是混淆的练习。

Answer 3

如果唯一目的是能够使用和不使用function UnfreezeTest(tableId) { // check if this is an instance of UnfreezeTest if( !(this instanceof UnfreezeTest) ) { // if it is not then the function was not invoked with new so create an instance return new UnfreezeTest(tableId) } this.tableId = tableId; } UnfreezeTest.prototype = { selectAll: function (chkAllElement) { $('#' + this.tableId + " .js-chk input[type='checkbox']").attr("checked", chkAllElement.checked); }, reset: function () { } }; console.dir(UnfreezeTest(1234)) console.dir(new UnfreezeTest(1234))创建该调用的实例，那么您可以这样做：

＆＃13;

new

＆＃13;

但是我不推荐这种模式，因为它会损害可维护性，不会因为你不喜欢使用function UnfreezeTest(tableId) { this.tableId = tableId; } UnfreezeTest.prototype = { selectAll: function (chkAllElement) { $('#' + this.tableId + " .js-chk input[type='checkbox']").attr("checked", chkAllElement.checked); }, reset: function () { } }; function createUnfreezeTest(teableId) { return new UnfreezeTest(teableId) } console.dir(createUnfreezeTest(1234))而破坏公共语言模式。我建议使用显式工厂函数：

＆＃13;

public static void main(String[] args) {
    for(int j=1 ; j<=31;j++) {
        System.out.printf("%10d",j);
        if(j%7==0) {
            System.out.println();
        }

    }
}

＆＃13;

Answer 4

您可以使用的另一种模式，它不需要原型或单词＆＃39;新＆＃39;如下：

＆＃13;

function UnfreezeTest(tableId) {
	var tableId = tableId;
	var obj = {
		selectAll: function (chkAllElement) {
			$('#' + tableId + " .js-chk input[type='checkbox']").attr("checked", chkAllElement.checked);
		},
		reset: function () { 

		}
	};
	return obj;
}

var unfreeze = UnfreezeTest(tableId);

＆＃13;

如何在javascript中使用原型模式？

4 个答案: