javascript类定义与对象的性能

[英]Performance of javascript Class definitions vs Objects


I'm writing a javascript application that extensively uses a particular form of dataset, like

我正在编写一个广泛使用特定形式的数据集的javascript应用程序,比如

{ foo: 'foo', bar: 'bar', quz: { baz : 'baz' }}

It's only data, but it's nested. There is no static data.

它只是数据,但它是嵌套的。没有静态数据。

I want to create a template for that dataset to keep the code clean. I can either put a template object somewhere and clone that everytime, like (using jquery just for the example)

我想为该数据集创建一个模板,以保持代码清洁。我可以将模板对象放在某处并且每次都克隆它,就像(仅使用jquery作为示例)

var ds = jQuery.extend(true, {}, config.dataset);

or I can create a 'Class' or function prototype that I can call with

或者我可以创建一个我可以调用的“类”或函数原型

var ds = new Dataset();

What performs best ? If using the new constructor, is there a difference between a Class and a function definition ?

什么表现最好?如果使用新的构造函数,Class和函数定义之间是否存在差异?

3 个解决方案

#1


0  

The answer to "What performs best?", in general, is: Worry about it if and when you actually have a performance problem.

一般来说,“什么表现最好?”的答案是:如果您确实遇到性能问题,请担心它。

The answer to "What performs best?" in JavaScript is:

“什么表现最好?”的答案在JavaScript中是:

  1. See the general answer, and

    见一般答案,和

  2. It depends, test on your target JavaScript engines (browsers, etc.)

    这取决于,测试你的目标JavaScript引擎(浏览器等)

Let's ignore performance, though, and look at the alternatives you gave.

但是,让我们忽略性能,看看你给出的替代方案。

Implementing a DataSet "class" (constructor and associated prototype, either with the new or old syntax) would be quite complicated and give you virtually no benefit for the use case you describe. You have a nested object structure:

实现DataSet“类”(构造函数和相关原型,使用新的或旧的语法)将非常复杂,并且对于您描述的用例几乎没有任何好处。您有一个嵌套的对象结构:

{ foo: 'foo', bar: 'bar', quz: { baz : 'baz' }}

...and so if you used that as a prototype, it would be very easy to get cross-talk between instances. Example:

...所以如果你把它当作原型,那么在实例之间进行串扰就很容易了。例:

// Demonstrating cross-talk
function DataSet() {
}
DataSet.prototype = { foo: 'foo', bar: 'bar', quz: { baz : 'baz' }};

var d1 = new DataSet();
var d2 = new DataSet();
d1.quz.baz = "updated";
document.body.innerHTML = d2.quz.baz; // "updated" - huh?!

To avoid that, you'd have to make a copy of the quz property on construction:

为避免这种情况,您必须在构造时复制quz属性:

function DataSet() {
    this.quz = jQuery.extend(true, {}, this.quz);
}

Then you have to remember to do that any time you add new nested objects in the prototype.

然后,您必须记住在原型中添加新的嵌套对象时这样做。

From what you've told us, the simplest solution is just to use your first example with jQuery.extend.

从您告诉我们的内容来看,最简单的解决方案就是使用jQuery.extend的第一个示例。

#2


0  

There are a few ways to do this, not only the two you specified, you can also use pure JS prototypes, when comparing all three it seems pure js would be the fastest.

有几种方法可以做到这一点,不仅你指定的两个,你也可以使用纯JS原型,当比较所有三个时,似乎纯js将是最快的。

Few things:

  1. Please note that using Classes is ES6 which is not widely supported by all browsers yet.
  2. 请注意,使用Classes是ES6,目前尚未得到所有浏览器的广泛支持。

  3. The old "new" is called prototypical inheritance, if you use that (which I would suggest you do, or the new format of it using Object.create) be careful of sharing data members between classes.
  4. 旧的“新”称为原型继承,如果你使用它(我建议你这样做,或使用Object.create的新格式),请注意在类之间共享数据成员。

  5. You can also just clone the object with JSON.parse(JSON.stringify(firstValueObject));
  6. 您也可以使用JSON.parse(JSON.stringify(firstValueObject))克隆该对象;

  7. If you choose Object.create (ES5) you can define default values: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object/create
  8. 如果选择Object.create(ES5),则可以定义默认值:https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object/create

http://jsperf.com/jquery-class-create-vs-pure-js-function/3

#3


0  

Inspired by TJCrowder's answer here, I came up with a third option

受到TJCrowder在这里的回答的启发,我提出了第三种选择

function newDataset( return { foo: 'foo', bar: 'bar', quz: { baz : 'baz' }});
var ds = newDataset();
  • it centralizes the definition of the dataset, which was the purpose
  • 它集中了数据集的定义,这就是目的

  • it always creates a new object, without the risk of sharing data members
  • 它总是创建一个新对象,没有共享数据成员的风险

  • i can always change the internal mechanics later and benchmark that
  • 我可以随后改变内部机制并对其进行基准测试


注意!

本站翻译的文章,版权归属于本站,未经许可禁止转摘,转摘请注明本文地址:https://www.itdaan.com/blog/2015/10/15/4f537ab548abb2987c69c500fd68842b.html



 
粤ICP备14056181号  © 2014-2020 ITdaan.com