Javascript 在原型中设置具有值类型的对象属性？ [关闭]

Posted 2023-02-22

【中文标题】Javascript 在原型中设置具有值类型的对象属性？ [关闭]

【英文标题】：Javascript setting object properties with value type in the prototype? [closed]

【发布时间】：2013-04-09 11:45:18

【问题描述】：

我总是在对象的原型中设置具有值类型的属性，因为这样可以避免每次创建对象时都必须初始化它们。

从那时起，我进行了一些调试，发现如果该原型属性的值将发生变化，则将一个新属性分配给该对象并且原型保持不变。

var o = function () 

;

o.prototype.x = 0;

o.prototype.setX = function(x) 
    this.x = x;
;

var obj = new o();
obj.setX(1);
console.log(obj);

// o x: 1, x: 0, setX: function

所以我的问题是，如果您知道原型属性的值可能会发生变化，那么在原型中设置它并受益于它不必在对象创建时进行初始化是否有任何真正的好处？

我的意思是，当它更改为另一个值时，无论如何都必须将新值分配给现有对象，从而失去最初在原型中设置它的初始好处！此外，它现在意味着您对同一事物有 2 个属性，一个在对象中，一个在原型中。

它在谷歌开发人员上说这是这样做的方法，但我不太确定。

什么时候应该在原型中设置值类型属性，当您知道值无论如何都会改变时，是否有任何真正的性能提升？

【问题讨论】：

我实际上已经对这类事情进行了基准测试，如果没有记忆，原型模型通常比直接为对象赋值要慢。例外情况是实例基本相同并且实例化发生的频率远高于属性访问。

请将它们称为 properties，variables 是错误的术语。

最好将原型用于只读类型的事物，例如方法或常量，这些对象的所有实例都应相同。我个人遵循一种设计模式，将方法放在原型上，并在构造函数中初始化成员变量。

value type 是指属性还是函数？我只是累了吗？我无法理解这应该是什么意思。

具有值类型（而不是引用类型）初始化值（即数字、布尔、空、未定义或字符串类型的值）的实例变量

【参考方案1】：

我实际上已经对这类事情进行了基准测试，如果没有记忆，原型模型通常比直接将值分配给对象要慢。例外情况是实例基本相同并且实例化发生的频率远高于属性访问。

所以，如果你这样定义你的对象：

var Class = function() ;
Class.prototype.p1 = 1;
Class.prototype.p2 = 1;
Class.prototype.p3 = 1;

您可以在实例化时避免性能下降，将属性复制到每个对象。 但是，当这些属性被访问或修改时，这种性能就会显现出来。而且，如果您碰巧在不修改它们的情况下访问了这些属性，那么每次访问它们都会对原型链造成性能影响（因为它们从未被复制到本地实例中）。但是，如果您有 许多 属性并且每个实例只访问其中的一小部分，那么这可能是理想的。

for (var i = 0; i < 100000; i++) 
  var x = new Class();
  console.log(x.p1);
  // ignore p2-p99. we don't need them right now.

另一方面，如果您需要在少数几个实例中多次迭代属性，最好避免遍历原型链。

var Class = function() 
  this.p1 = 1;
  this.p2 = 1;
  this.p3 = 1;

每个实例在创建时都有自己的 p1、p2 和 p3 副本。并且当我们访问其中任何一个时，都不需要参考原型链。

var instances = [
  new Class(), new Class(), new Class()
];

for (var i = 0; i < 1000000; i++) 
  console.log(instances[i % instances.length].p1);
  console.log(instances[i % instances.length].p2);
  console.log(instances[i % instances.length].p3);

如果我稍后有时间，我会稍后对此进行基准测试以验证。在那之前，我只能给你理论！

附录

使用原型有两个与性能无关的好处。

一个，对于相对静态的属性（如函数），它可以节省内存。大多数应用程序不会遇到任何限制。但是，在关闭更改时，这对您来说是个问题，请使用原型。

二，原型允许您将函数和属性分配给类的所有现有实例。要使用实例级属性完成相同的壮举，您需要查找并迭代。

基准

根据my latest benchmarks，我只在最新版本的 FF 和 Chrome for OS X 上运行，我对单层（非继承）类定义使用以下语法：

原型。*

function Class() 
Class.prototype.a = 1;
Class.prototype.b = 2;
Class.prototype.c = 3;

这个。*

function Class() 
  this.a = 1;
  this.b = 2;
  this.c = 3;

在上述两种语法之间，this.* 语法的运行速度全面提高了约 10.5%。

添加一个继承级别，我使用了以下内容：

原型。*

function Base() 
Base.prototype.a = 1;
Base.prototype.b = 2;
Base.prototype.c = 3;

function Class() 
Class.prototype = new Base();

这个。*

function Base() 
  this.a = 1;
  this.b = 2;
  this.c = 3;


function Class() 
  Base.apply(this);

在这种情况下，我发现prototype.* 语法的整体速度提高了大约 38.5%。 this.* 语法仍然略快地在浏览器之间用于成员访问；但是，优势并不像实例化优势那么明显。

我还对混合继承方法进行了基准测试：

function Base() 
  this.a = 1;
  this.b = 2;
  this.c = 3;


function Class() 

Class.prototype = new Base();

总体而言，它的运行速度比 prototype.* 语法快约 0.5%（可能微不足道）。然而，有趣的是，它在实例化过程中慢了大约 1%，但在成员访问过程中比 prototype.* 语法快了大约 2%。同样，不是非常重要，但我不禁想知道这些收益是否会随着继承深度的增加而扩大。

当然，请注意，这些基准测试并不是在控制良好的环境中完成的。我倾向于认为性能上明显的巨大差距是显着的。但是，较低的百分比很可能是由于我的机器上的 CPU 负载波动所致。

说了这么多，我可能会建议在没有发生继承的情况下使用this.*或其中成员访问远比类实例化更常见。当然，如果您不想从 Web 应用程序中榨取每一盎司的性能，请使用您和您的团队感觉更直观的语法。与对象构建风格的差异相比，大多数 Web 应用程序在性能方面的影响会多。

例如，改变背景颜色，

document.body.style.backgroundColor = 'blue';

...比实例化我基准测试的性能最差的构造函数大约慢 70%。

【讨论】：

大约一年前我做了一些类似的测试，发现在 Chrome 中，查找原型对象实际上比直接查找对象要快。这很奇怪，但非常一致。我不知道情况是否仍然如此，但很明显 V8 对原型查找进行了一些优化。这些 JIT 编译器的性能问题变得更加复杂。

@amnotiam 很高兴知道。这将激励我在孩子们上床后运行一些基准测试......假设小虫子留在床上！

@amnotiam 仅供参考，我从昨晚运行的一些相当仓促的基准测试中添加了数字。

@svidgen 感谢您的出色工作！

@svidgen：有趣...我在 jsPerf 中进行了一个非常小的测试：jsperf.com/prototype-vs-own-property 与一年前的测试形成鲜明对比。表明我们不应该为这些不同的优化编写代码，因为它们可以在下一个版本中朝任一方向改变。

【参考方案2】：

如果属性值总是（或大部分时间）在对象实例化时更改，则将属性值存储在prototype 中没有任何好处。只有当一个值在多个实例之间共享时，您才会有优势，在这种情况下会导致 更少的内存使用，但不一定会提供更好的性能。走原型链应该更昂贵，而不是直接在 object 上执行属性查找。