В чем разница в использовании этих двух синтаксиса JavaScript OOP?
Итак, я создал объект двумя разными способами.
Первый способ:
const sprite = () => {
let obj = {
hp: 100,
damage: () => {
obj.hp -= 25;
},
heal: () => {
obj.hp += 25;
}
}
return obj;
}
let sprite1 = sprite();
Второй способ:
const sprite = () => {
let obj = {};
obj.hp = 100;
obj.damage = () => {
obj.hp -= 25;
}
obj.heal = () => {
obj.hp += 25;
}
return obj;
}
let sprite1 = sprite();
Я протестировал оба этих синтаксиса, и они оба работают, но я вижу, что чаще используется только второй способ.
Итак, мой вопрос:
Можно ли использовать синтаксис первым способом? Есть ли причина, по которой синтаксис первого способа не используется широко? Это плохая практика, если да, то почему?
Я просто немного новичок в ООП в JS и ищу некоторые разъяснения.
Спасибо!
Во-первых: вы создаете глубокий объект, во-вторых: вы создаете объект, а затем добавляете к нему свойства/значения. В остальном нет никакой разницы.
Я совершенно уверен, что эти два объекта идентичны.
Я думаю, что более подход ООП будет заключаться в использовании class.
![Безумие обратных вызовов в javascript [JS]](https://i.imgur.com/WsjO6zJb.png)
Ответы 2
Несколько различий между двумя стилями:
Мутация: второй способ изменяет объект во времени. Поэтому, если вы каким-то образом получили доступ к объекту до того, как завершили его определение, он мог бы выглядеть по-другому. первый способ не создает объект до тех пор, пока он не будет полностью определен. Это дает вам хорошую гарантию на уровне синтаксиса, что вы не можете так много испортить, и это основная причина, по которой я предпочитаю этот метод. Я стараюсь избегать мутаций, когда могу.
Сфера: в первом случае объем определений немного отличается. во втором случае областью действия является функция, в которой создается объект. В первом случае областью действия является создаваемый объект. См. Функция стрелки против объявления/выражения функции: эквивалентны ли они/заменяемы?
Краткость: второй путь немного длиннее первого.
Итерабельность и необычные свойства: в некоторых случаях первый способ позволяет создавать специальные определения свойств, которые вести себя немного иначе, чем
obj.foo = bar. Вы можете использоватьObject.defineProperty(), чтобы сделать то же самое.
Однако в вашем конкретном примере они идентичны (пока вы не используете this или arguments ни в одной из его функций) и просто вопрос предпочтений.
Второй семантически правильный в JavaScript, но не в TypeScript, некоторые линтеры могут запросить у вас интерфейс или что-то в этом роде, но это не проблема ошибки, а проблема стиля. В конце они оба делают одно и то же.
Хм. Что будет this в этих стрелочных функциях?
@Энди, верно? Да, я не уверен, что это пришло мне в голову (почти уверен, что это объект, но я хотел бы убедиться, что я не ошибся в его памяти, а область действия на самом деле была функцией создания). Еще более запутанно, что означает arguments?
@Andy При запуске непосредственно в консоли браузера this внутри функций стрелок является объектом Window.
Я знаю ответ :) Я проверял, знает ли Майкл. Это описано в этой ссылке в моем первом комментарии под вопросом.
Прости! Я неправильно скопировал, вы правы, когда TS переводится, это относится к реальному контексту, в данном случае к окну. Я исправлю @Энди