Javascript创建对象 - 多种方法,任何差异？

Question

我已经看到了一些在javascript中实例化对象的不同方法,想知道各种方法的优点/缺点以及为什么要使用其中一种方法.

方法1

var obj = {
    prop: value,
    .
    .
    .
}

方法一是标准方法,没什么新的:)

方法2

var obj = new function() {
    var prop1 = value1;
    var fn1 = function() {
    };
    .
    .
    .

    this.prop2 = value2;
    .
    .
    .
}();

函数方法,我想将此方法与方法3进行比较.函数方法主要用于封装(正确吗？)

方法3

var obj = (function() {
    var prop1 = value1;
    var fn1 = function() {
    };
    .
    .
    .

    return {
        prop2: value2,
        .
        .
        .
    }
})();

通过这种方法,我不太清楚其使用背后的原因.它与方法2有何不同？两者都可用于封装逻辑.

是这样我们可以传递参数,所以我们可以处理任何潜在的冲突？例如jquery的$语法 - 但你也可以用方法2做到这一点......

谢谢.

---

编辑:

---

我知道方法1和3是相似的(因为它们都返回对象)但是方法3也创建了一个闭包.哪种方法2也有.

这是我的问题的基础,2和3都创建了闭包,但它们之间有什么区别.

Answer 1

7种在JavaScript中创建对象的方法:

1.对象构造函数

创建对象的最简单方法是使用Object构造函数:view plainprint？

var person = new Object();  
person.name = "Diego";  
person.getName = function(){  
    return this.name;  
}; 

2.文字符号

查看plainprint？

var person = {  
    person.name : "Diego",  
    person.getName : function(){  
        return this.name;  
    }  
} 

3.工厂功能

Factory函数允许封装和重用逻辑以创建类似对象.它利用了以前的任何构造.要么:查看plainprint？

var newPerson=function(name){  
    var result = new Object();  
    result.name = name;  
    result.getName = function(){  
        return this.name;  
    };  
    return result;  
};  
var personOne = newPerson("Diego");  
var personTwo = newPerson("Gangelo");  
console.log(personOne.getName()); // prints Diego  
console.log(personTwo.getName()); // prints Gangelo

要么:

view plainprint?
var newPerson=function(name){  
    return {  
        person.name : name,  
        person.getName : function(){  
            return this.name;  
        };  
};  
var personOne = newPerson("Diego");  
var personTwo = newPerson("Gangelo");  
console.log(personOne.getName()); // prints Diego  
console.log(personTwo.getName()); // prints Gangelo  

4.函数构造函数

在Javascript中,可以使用前面的new运算符调用任何函数.给定函数F,对于新的F():创建新的空对象X. X被设置为F的上下文意味着整个F指向X.X作为F view plainprint的结果返回？

function Person(name){  
        this.name = name;  
        this.getName = function(){  
            return this.name;  
        };  
};  
var personOne = new Person("Diego");  
console.log(personOne.getName()); // prints Diego  
console.log(personOne instanceOf Person); // prints true  
console.log(personOne.constructor === Person); // prints true  
console.log(personOne instanceOf Object); // prints true  

5.原型

函数在Javascript中非常特殊.它们是对象,可以创建其他对象,并自动获得一个名为prototype的字段.原型是一个普通的对象,它有一个字段,称为构造函数,指向函数本身.它的特殊之处在于通过函数创建的每个对象都继承了函数的原型.查看plainprint？

function Person(){};  
Person.prototype.name = "Diego";  
var personOne = new Person();  
var personTwo = new Person();  
console.log(personOne.constructor == Person); // prints true  
console.log(personOne.name); // prints Diego  
console.log(personTwo.constructor == Person); // prints true  
console.log(personTwo.name); // prints Diego  

6.功能/原型组合

正如您所想,函数/原型组合利用了两种方法:) view plainprint？

function Person(name){  
        this.name = name;  
};  
Person.prototype.getName = function(){  
            return this.name;  
        };  
var personOne = new Person("Diego");  
var personTwo = new Person("Filippo");  
console.log(personOne.getName()); // prints Diego  
console.log(personTwo.getName()); // prints Filippo  
console.log(personOne.getName === personTwo.getName) //prints true 

7.单身人士

有时,您可能希望确保只存在某个类的单个实例.在Javascript中获取Singleton就像在同一时间定义和调用构造函数一样简单:view plainprint？

var singleton = new function(){  
    this.name = "ApplicationName";  
};  

Answer 2

在方法#2和#3 constructor中,结果对象的属性将是不同的.

实际上,这意味着第二种方法允许您使用匿名构造函数实例化多个对象:

x = new function() { alert(1) };
y = new x.constructor; // shows the message too

模块模式与匿名构造函数实例的最佳答案包括道格拉斯克罗克福德的一句话,他解释了为什么他认为方法#3优于#2.