JavaScript - Экспорт массива с жестким кодом против создания

Question

Допустим, у меня есть файл data.js, который содержит массив некоторых данных, которые будут куда-то импортированы ( например, компонент React ).

ПРИМЕР А :

const DATA = [
  {
    firstName: 'jim',
    lastName: 'beam',
    fullName: 'jim beam'
  },
  {
    firstName: 'jack',
    lastName: 'daniels',
    fullName: 'jack daniels'
  }
];

export default DATA;

Хорошо, круто. Дело в том, что мы выписываем свойство fullName, которое можно собрать, комбинируя firstName и lastName. Это очень простой пример для ясности, так что потерпите меня. Мы могли бы также сделать что-то вроде этого:

ПРИМЕР Б:

const DATA = [
  { firstName: 'jim', lastName: 'beam' },
  { firstName: 'jack', lastName: 'daniels' }
];

export default DATA.map(person => ({
   ...person,
   fullName: `${person.firstName} ${person.lastName}`
});

Черт, мы могли бы даже сделать это!

ПРИМЕР C:

const DATA = ['jim beam', 'jack daniels'];

export default DATA.map(person => {
  const [firstName, lastName] = person.split(' ');
  return {
    firstName,
    lastName,
    fullName: person
  };
};

Итак, представьте, что у вас есть огромный список данных, где несколько значений могут быть получены из одного начального значения. У меня вопрос, как бы примеры B и C отличались от простого жесткого кодирования всего сразу, как пример A ?

Если вы имел сотни элементов, примеры B и C могли бы иметь гораздо меньше накладных расходов, меньший размер файла и могли бы уменьшить потенциальные опечатки ... Но мы объявляем массив а затем экспортировать другой, который, я предполагаю, может иметь падение производительности? Мысли

Answer 1

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

class Person {
    constructor(firstName, lastName) {
        this.firstName = firstName;
        this.lastName = lastName;
    }

    get fullName() {
        return `${this.firstName} ${this.lastName}`
    }
}

let a = new Person('Charles', 'Martel');
console.log(a.fullName)

// expected result: "Charles Martel"

Ваши данные могут быть объявлены следующим образом.

const DATA = [
  new Person('jim', 'beam'),
  new Person('jack','daniels')
];