重新分配变量或返回新对象?

Reassigning variables or returning new objects?

我正在处理 JS 中的某个项目,其中我有一个功能可以使用等距投影将点从 3D 投影到屏幕上。

var xy = function(x, y, z) {
    return {
        x: 300 + cos(30) * x + cos(30 + 120) * z;
        y: 300 + sin(30) * x + sin(30 + 120) * z - y;
    };
};

绘制一个点我会做

var p = xy(10, 20, 30); // 10, 20, and 30 being the x, y, and z values respectively
point(p.x, p.y);

这个函数在帧中被调用了很多次,所以我想提高效率。有一次,有人告诉我,当我这样做时

return {
    x: ...
    y: ...
};

每次调用该函数时,它都会在内存中创建一个新对象。他说改为像这样执行功能

var p = {x:0,y:0};
var xy = function(x, y, z) {
    p.x = 300 + cos(30) * x + cos(30 + 120) * z;
    p.y = 300 + sin(30) * x + sin(30 + 120) * z - y;
};

并绘制一个点

xy(10, 20, 30);
point(p.x, p.y);

现在,如果我节省内存,那一切都很好,但是当我使用旧方法时它没有太多延迟,但我认为重新分配变量的新方法似乎更慢,Safari 也是如此不做弹出 "This webpage is using significant memory. Closing it may improve the performance of your mac." 但对于新方法它确实做了 "This webpage is using significant energy. Closing it may improve the performance of your mac." (JK 它说它对两者都使用了大量能量但我认为它似乎对新方法来说更滞后)

所以基本上我的问题是:

哪个更糟

var xy = function() {
    return {key:"val"};
};
// do it lots of times nonstop
setInterval(function(){for (var i=0; i<amillion; i++) {xy();}}, 1000);

var p = {key:"val"};
var xy = function() {
    p.key = "val";
};
// do it lots of times nonstop
setInterval(function(){for (var i=0; i<amillion; i++) {xy();}}, 1000);

我做了一个测试,它们似乎都以相同的速度工作,所以是的,你最好重新分配变量以保存一些花絮,但你知道什么不太关心效率;易于阅读的代码更重要。