Javascript 原型(prototype)与通用函数 - 性能/可读性

Question

所以我编写了这些测试，看看使用原型(prototype)会快多少......

function User() {
    return {
        name: "Dave",
        setName: function(n) {
            this.name = n;
        },
        getName: function() {
            return this.name;
        }
    };
}

function UserPrototype() {
    if (!(this instanceof UserPrototype)) return new UserPrototype();
    this.name = "Dave";
}
UserPrototype.prototype.getName = function() {
    return this.name;
};
UserPrototype.prototype.setName = function(n) {
    this.name = n;
};

function setName(obj,name)
{
    obj.name = name;
}
function getName(obj)
{
    return obj.name;
}

//Test 1
var c = 10000000;
var tstart = 0;
var tend = 0;
tstart = new Date().getTime();
for (var j = 0; j < c; j++) {
    var newUser = User();
    newUser.setName("michael");
    newUser.getName();
}
tend = new Date().getTime() - tstart;
console.log("Returning object with methods: " + tend / 1000.0 + " seconds");
//Test 2
tstart = new Date().getTime();
for (var j = 0; j < c; j++) {
    var newUser = new UserPrototype();
    newUser.setName("michael");
    newUser.getName();
}
tend = new Date().getTime() - tstart;
console.log("Using prototypes: " + tend / 1000.0 + " seconds");
//Test 3
tstart = new Date().getTime();
for (var j = 0; j < c; j++) {
    var newUser = {name:"dave"};
    setName(newUser,"michael");
    getName(newUser);
}
tend = new Date().getTime() - tstart;
console.log("Using general functions: " + tend / 1000.0 + " seconds");
​

我的结果:

Returning object with methods: 9.075 seconds
Using prototypes: 0.149 seconds 
Using general functions: 0.099 seconds 

我写了前两个测试，当我看到结果时，我想到了为什么我会看到它们......我认为原因是对象返回很慢，因为两个新的方法属性实例是每次实例化对象时创建，而原型(prototype)方法更快，因为它只创建一次函数。一般函数调用和原型(prototype)之间的性能接近让我认为我的假设是正确的。

所以我的第一个问题是，我的假设是否正确？

我的第二个问题是，我怎样才能使使用原型(prototype)编写的代码更具可读性，同时保持高性能？有没有办法以一种看起来像在“类”中的方式对原型(prototype)进行编码(如果这有意义的话)

*编辑 - 我忘了用 Object.create() 做一个测试，只做了一个并发布了结果。 JSFiddle: ( http://jsfiddle.net/k2xl/SLVLx/ ).

我现在明白了:

Returning object with methods: 0.135 seconds fiddle.jshell.net:63
Using prototypes: 0.003 seconds fiddle.jshell.net:72
Using general functions: 0.002 seconds fiddle.jshell.net:81
Returning object.create version: 0.024 seconds 

看起来这可能是解决方案？

Answer 1

我同意你的假设。代码这样写也是bourd out:

function UserObject() {
    this.name = "Dave";

    this.getName = function() {
        return this.name;
    };
    this.setName = function(n) {
        this.name = n;
    };
}

在这种情况下，就像在您的“对象”方法中一样，每次构造UserObject 对象时都会创建getName 和setName 方法.

“原型(prototype)”和“函数”方法之间的代码略有不同。删除 if (!(this instanceof UserPrototype)) return new UserPrototype(); (这是一个不必要的安全防护措施)会减少很多。也可以说，更接近...

var newUser = new UserPrototype();
[newUser].name = "Dave";

...是...

var newUser = new Object();
newUser.name = "dave";

...因为...

var newUser = {name:"dave"};

... 在创建 Object 并添加 name 属性时，在 native 代码上表现出色。

在那种情况下，结果翻转，“原型(prototype)”方法更快地出现。在此处查看 jsFiddle:

• http://jsfiddle.net/bcfPp/2/

关于如何使您的原型(prototype)更具可读性，我无能为力。对我来说，它们是可读的:-)