Question

让javascript构造函数返回JavaScript对象文字与使用this.XYZ设置属性之间是否存在任何性能或功能差异。例如：

    function PersonA(fname, lname) {
        this.fname = fname;
        this.lname = lname;
    }

    function PersonB(fname, lname) {
        return {
            "fname": fname,
            "lname": lname
        };
    }

两者似乎都表现得恰到好处：

    PersonA.prototype.fullName = function() { return this.fname + " " + this.lname; };
    PersonB.prototype.fullName = function() { return this.fname + " " + this.lname; };

    var pA = new PersonA("Bob", "Smith");
    var pB = new PersonB("James", "Smith");

    alert(pA.fullName());
    alert(pB.fullName());

出于任何原因是优选的，还是味道问题？如果味道，是一个更标准的？

Answer 1

它们并不完全相同。

如果从构造函数返回正在创建的对象...

它将继承自构造函数的prototype
它将instanceof可用作测试构造函数创建它的方法

fullName()方法似乎适用于pB的原因是您正在使用PersonA构造函数。

var pA = new PersonA("Bob", "Smith");   // uses PersonA constructor
var pB = new PersonA("James", "Smith"); // uses PersonA constructor???

仅供参考，正确的术语是“JavaScript object literal”，而不是“JSON object literal”。

编辑：您已更新问题中的代码以使用PersonB构造函数。再次运行它，您将在控制台中找到错误。

Answer 2

当你 new 一个函数构造函数时，会创建一个空对象，然后在函数构造函数中由 this 引用。

因此，对于 PersonA ，请按照以下方式考虑：

// create an empty object
var emptyObj = {}; 

// call the function as a method of the empty object
PersonA.call(emptyObj, "Bob", "Smith");

导致 emptyObj 等于：

{
   fname : "Bob",
   lname : "Smith"
}

当您调用 PersonB 时，您仍然通过调用 new 创建一个空对象，但基本上不对其执行任何操作，并返回另一个对象作为结果。

Javascript构造函数 - 返回JSON对象的效果

2 个答案: