Почему Angular 2 используют декораторы?

Я только начал использовать Angular 2 и задавался вопросом, почему некоторые свойства, такие как selector и template, помещаются в декораторы компонентов, а не в классы компонентов.

Какой смысл использовать все эти декораторы в Angular 2?

Ответ 1

  • Чтобы упростить инструменты для поддержки всех видов поддержки в шаблонах, например:

    • проверка ошибок
    • автозаполнения
    • графические дизайнеры GUI
  • Сгенерировать код из декораторов, который позволяет:

    • чтобы определить некоторые вещи более декларативно или
    • генерировать другой код в зависимости от некоторой конфигурации (например, компилятор предстоящий оффлайн шаблон)

Код должен быть выполнен для использования выражений результатов. Декораторы можно легко оценивать статически, не выполняя код TypeScript (за исключением, может быть, простого и ограниченного подмножества).

Ответ 2

В дополнение к уже полученным ответам по конкретной платформе я бы хотел добавить более общий взгляд. Этот вопрос, по моему мнению, как-то связан с решением выбора шаблона декоратора вместо наследования (например, @Component vs extends Component)

Некоторые из преимуществ использования декораторов:

1. Разделение интересов:

Информация внутри декораторов является декларативной, она определяет поведение класса, скорее всего, не будет меняться со временем и используется платформой. Свойства и поля класса являются специфичными для класса данными, всегда будут обрабатываться и часто обновляться и имеют смысл только внутри самого класса. Эти два вида данных не следует смешивать вместе.

2. Поддержка нескольких модификаций

Многие языки предотвращают множественное наследование из-за проблемы Diamond. С другой стороны, один класс может иметь несколько декораторов для разных целей (например, @Component и устаревший @RouteConfig)

Ответ 3

В общем, декораторы позволяют выполнять функции. Например, @Component выполняет функцию Component, импортированную из Angular2. Под капотом такие декораторы определяют некоторые метаданные в классе. Это позволяет настроить класс для "флага" его как компонента. Angular2 затем может связывать селектора в шаблонах с таким классом.

В этой статье вы можете узнать больше о том, что происходит под капотом:

Вы можете заметить, что декораторы могут применяться в TypeScript на разных уровнях (класс, свойство класса, параметр метода).

Ответ 4

В angular мы создаем классы для всего, например, для компонентов, сервисов, директив,

Итак, как угловой компилятор компилирует ваш код и превращает его в сценарии, которые готовы к запуску в браузере? Это происходит из-за декораторов. Проще говоря, вы можете сказать, что декораторы позволяют вам присоединять метаданные к классу машинописи, используя который angular знает, является ли этот класс компонентом, директивой, модулем и т.д.