javascript - 一个类的许多实例对性能的影响

Question

我有一些旧代码想要重构和改进，目前代码看起来像这样:

function objFunction1(obj){
  //do something
  console.log(obj, 1);
}

function objFunction2(obj){
  //do something else
  console.log(obj, 2)
}

var obj = {test: true};

objFunction1(obj);
objFunction2(obj);

我正在考虑将它变成一个类，例如:

class item{
  constructor(test){
    this.test = test;
    return this;
  }
  
  function1(){
    console.log(this, 1);
  }
  
  function2(){
    console.log(this, 2);
  }
}

var obj = new item(true);
obj.function1();
obj.function2();

JavaScript 如何处理这个问题？如果我要有 10,000 个 item 实例，JavaScript 会为每个实例复制这些方法还是只存储对类声明的引用？

我主要想问的是，我的原始代码是否更高效？

Answer 1

如果你有100000或任意数量的对象，但 function1和 function2在其 prototype 中只有一个副本

因为类语法只是旧函数构造函数的语法糖。当您编写上面的类语法时，这些方法将在 prototype 中声明。该类的，您可以将其验证为:

const obj1 = new item(true);
const obj2 = new item(false);
obj1.function1 === obj2.function1;

如果obj1.function1 === obj2.function1表达式返回 true那么这意味着，在其 prototype 中只定义了一个函数。

You should read docs

class item {
  constructor(test) {
    this.test = test;
    return this;
  }

  function1() {
    console.log(this, 1);
  }

  function2() {
    console.log(this, 2);
  }
}

const obj1 = new item(true);
const obj2 = new item(false);
console.log(obj1.function1 === obj2.function1);  // true

---

注意:构造函数的首字母我大写了，对外说明它是一个构造函数。这只是 JS 社区使用的约定

上面的类语法将等同于下面的函数构造函数语法:

function function1() {
  console.log(this, 1);
}

function function2() {
  console.log(this, 2);
}

function Item(test) {
  this.test = test;
}

Item.prototype.function1 = function1;
Item.prototype.function2 = function2;

const obj1 = new Item(true);
const obj2 = new Item(false);

console.log(obj1);
console.log(obj2);
console.log(obj1.function1 === obj2.function1);