哪种创建 javascript 对象的方法更好？答案

【问题标题】：Which method of creating javascript objects is better?哪种创建 javascript 对象的方法更好？
【发布时间】：2010-05-04 02:30:34
【问题描述】：

我见过以两种不同方式定义的对象，它们的功能相似，但当然是根本不同的。你可以这样做：

var myobject = {property: 'hello',
                act: function() {
                    this.property += ' world';
               }};

像这样：

function myobject() {
    this.property = 'hello';
    this.act = function() {
        this.property += 'world';
    }
}

第二种方法可以像这样创建对象

var newobj = new myobject();

但是您可以使用第一种表示法来做类似的事情，方法是使对象成为函数的返回值。 new 关键字的优点是能够传递可用于初始化对象属性的参数，但您也可以轻松地将 init 函数添加到第一种对象。

只是想知道除了这两个区别之外，是否还有一个根本区别使得一种方法绝对优于另一种方法。

【问题讨论】：

差别很大，没有人同意一种方法更好。背景：stackoverflow.com/questions/1595611/…

标签： javascript

【解决方案1】：

第二个更好，因为您可以重复使用它。此外，构造对象的constructor 属性在每种情况下都不同。

除此之外，第二种方法会在每次调用构造函数时为act 属性分配一个新函数，从而浪费空间。（请注意，第一种方法同样会浪费空间。）请改用原型：

function MyConstructor () {
  this.property = 'hello';
}

MyConstructor.prototype = {
  act: function () {
    this.property += 'world';
  }
};

MyConstructor.prototype.constructor = MyConstructor;

var obj = new MyConstructor ();

【讨论】：

您可以重复使用第一种方法，不会多于或少于第二种方法。唯一的区别是第一个必须在调用或执行之前声明。

【解决方案2】：

var f = function () {};
function g () {}

if (typeof(f) === typeof(g)) {
    alert(typeof(f) + "\n" + f + "\n" + g);
}

类型相同，变量 f 分配了一个匿名函数。由于 f 是一个以函数为值的命名变量，因此它是一个非匿名函数。 JavaScript 是一种向下继承的 lambda 语言，允许意外创建全局变量。对于在变体命名空间范围内使用闭包的复杂继承实例，您必须确定在何处定义变量以防止冲突，尤其是考虑重用。第一个约定强制变量声明的严格意识，因为函数必须在执行之前声明。第二个约定没有提供这样的意识，这对于实例化和调用可能是有问题的，因为前面描述的复杂逻辑中的闭包。幸运的是，JSLint 足够聪明，可以在声明之前使用函数时抛出错误。由于这两种约定在表示上是相同的，我建议只使用不会因有缺陷和草率的编程而被滥用的一种。

总而言之，如果 g 和 f 都是以函数为赋值的命名变量，那么请始终使用第一个约定以正确的方式进行操作，即使用 var 关键字声明变量。

【讨论】：

【解决方案3】：

javascript:
  canDo="b:c=function(){}";
  canNot="function a:d(){}";

  eval(canDo);

  alert(["Can do ",canDo,
         ".\n\n\nConfirmed result is: \n\n b:c=",
         eval("b:c")
        ].join(""));

  alert(
    confirm(
      "Click OK to confirm this is not valid (can NOT do):\n\n" + canNot) ?
    eval(canNot) : "Test will fail if attempted and 'a:d' will not exist."
  );

在 FireFox 中显示：

可以做 b:c=function(){}。确认结果为： b:c=函数 () { }

和

单击确定以确认这是无效的（不能这样做）：函数 a:d(){}

如果选择 OK，则会出现运行时错误。

【讨论】：