У вас много неизменяемых объектов или несколько изменяемых?

#javascript #performance #design-patterns

Вопрос:

У меня есть Point класс, который представляет x и y координирует. Один из подходов состоит в том, чтобы сделать свойства этого класса неизменяемыми и при необходимости постоянно создавать новые объекты, например:

 class Point {  readonly x: number;  readonly y: number;   constructor(x: number, y: number) {  this.x = x;  this.y = y;  }   add(x: number, y: number) {  return new Point(this.x   x, this.y   y);  } }  document.addEventListener("mousemove", (e) => {  let p = new Point(e.clientX, e.clientY);  let p2 = p.add(24, 42);  // ... });  

Другой подход заключается в предварительном создании объектов и их повторном использовании, например:

 class Point {  x: number;  y: number;   constructor(x?: number, y?: number) {  this.set(x, y);  }   set(x: number, y: number) {  this.x = x;  this.y = y;  }   add(x: number, y: number) {  this.set(this.x   x, this.y   y);  }   copy(p: Point) {  this.set(p.x, p.y)  return this;  } }  let p = new Point(); let p2 = new Point();  document.addEventListener("mousemove", (e) => {  p.set(e.clientX, e.clientY);  p2.copy(p).add(24, 42)  // ... });  

Моя теория заключается в том, что, поскольку JavaScript-это сбор мусора, следование первому шаблону и извергание объектов не должно быть проблемой, если вы не оставляете ссылок на них. Тем не менее, я посмотрел на то, как популярные Three.js библиотека реализует свой объект Vector2, который делает в основном то же самое, что я показал выше, и следует второму шаблону.

Первый подход кажется более доступным и простым в использовании, но второй, возможно, более эффективен для работы с памятью?

Когда мы говорим о шаблонах дизайна в целом, это в значительной степени сводится к предпочтениям и мнению. Мой вопрос заключается в том, есть ли в контексте JavaScript конкретная причина для выбора одного или другого, или различия в производительности незначительны?