Оптимизация производительности в «Factory Design Pattern» в JavaScript - PullRequest
0 голосов
/ 16 сентября 2018

Я хочу использовать шаблон фабричного дизайна в своем приложении и использовать некоторые его преимущества, такие как читаемость, гибкость, масштабируемость, инкапсуляция и правильное связывание «this» оператора »во время разработки. Поскольку мое приложение генерирует HTML-код при загрузке В моем случае важна производительность и использование памяти для создания объектов. Пожалуйста, посмотрите на следующий пример:

// Factory Design with Delegation
const car = function( color ) 
{
	const CarPrototype = function( color )
	{
		const carPrototype = {};
		
		carPrototype.color = color;
		// Private function
		function internal()
		{
			console.log( "internal" );
			// ...
		}
		
		// Public function
		carPrototype.gas = function()
		{
			internal();
			// ...
		}
		
		carPrototype.brake = function()
		{
			// ...
		}
		
		return carPrototype;
	}
	return Object.create( CarPrototype( color ) );
}

// Traditional constructor function
const Car = function( color )
{
	this.color = color;
	// ...
}

Car.prototype.internal = function()
{
	console.log( "internal" );
	// ...
}

Car.prototype.gas = function()
{
	this.internal();
	// ...
}

Car.prototype.brake = function()
{
	// ...
}


function myFunction()
{

const mazdaF = car( "red" );

const mazdaT = new Car( "red" );
 
console.log( mazdaF, mazdaT );

}
<html>
  <head></head>
  <body onload="myFunction()">
  </body>
</html>

Результат выполнения вышеуказанного кода показан ниже.

enter image description here

Кроме того, здесь показан результат теста производительности Результат производительности .

Я хочу знать, использую ли я правильный шаблон для моего случая или нет. В случае, что я должен сделать, чтобы улучшить производительность?

ОБНОВЛЕНИЕ:

Теперь я немного запутался по поводу заводского шаблона выше. Я думаю, что когда я использую Object.create( CarPrototype( color ) ), я создаю совершенно новый автомобильный объект и возвращаю объект, который его прототип связал с этим автомобильным объектом. Поэтому, если я создам 1000 автомобильных объектов, у меня будет 1000 автомобильных прототипов вместо одного прототипа с 1000 ссылками на делегирование. Я прав? Если это правда, может кто-нибудь объяснить мне, как это исправить?

1 Ответ

0 голосов
/ 17 сентября 2018

JSPerf - это , глючит , поэтому я не могу на самом деле проверить ваши, но ... я бы сказал, что это более читабельно и более легко обслуживаемо, хотя и быстро (с использованием классов ES6):

const Car = (function() {
  const internal = Symbol("internal");

  class Car {
    constructor(color) {
      this.color = color;
    }

    [internal]() {
      console.log("internal");
      // ...
    }

    gas() {
      this[internal]();
      // ...
    }

    break() {
      // ...
    }
  }

  return Car;
})();

let car = new Car("red");
car.gas();
console.log(car);

Поскольку вы можете получить доступ к символу, подражающему частному методу, используя Object.getOwnPropertySymbols, но не случайно, способ обозначения "достаточно хорош" для меня (как и в случае с любыми секретами, которые у меня есть, я не передача клиенту, а закрытые методы предназначены исключительно для понимания программистами того, что является публичным API, а что нет. Если это не «достаточно хорошо» для вас, то это так же эффективно, хотя вы теряете internal как собственное метод:

const Car = (function() {
  function internal(car) {
    console.log("internal");
  }

  class Car {
    constructor(color) {
      this.color = color;
    }

    gas() {
      internal(this);
      // ...
    }

    break() {
      // ...
    }
  }

  return Car;
})();

let car = new Car("red");
car.gas();
console.log(car);

Внешний IIFE моделирует модуль (см. Шаблон модуля JavaScript с примером ); вам это не нужно, если вы используете правильные модули.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...