Пора начать писать новый код. Я решил, что проще всего начать с основ объекта параметров Notific8. Давайте посмотрим на параметры по умолчанию в последней версии 4.x.
Примечание: во фрагменте кода закомментированы три параметра. Эти параметры являются обработчиками событий. Я обдумывал идеи, что с ними делать, поэтому мы вернемся к ним в одной из следующих статей.
Какую структуру данных использовать?
В исходной версии Notific8 параметры определялись как литерал объекта. ES2015 + и Typescript дают нам возможность использовать класс. При этом, является ли класс правильной структурой данных для использования?
Давайте посмотрим на некоторые вещи, которые нам даст класс, и посмотрим, нужны ли они нам:
- Структура объекта - это полезно, но также доступно в литерале объекта.
- Возможность создать экземпляр - наверное, перебор
- Способы работы с объектом - не требуется
Если присмотреться к нему поближе, похоже, что мы можем придерживаться литерала объекта. Однако, используя Typescript, мы определенно хотим ввести свойства с помощью интерфейса.
Давайте определим этот интерфейс!
Быстрый первый проход дает нам этот интерфейс:
Многие заметят, что нам пришлось изменить одно имя свойства. namespace - ключевое слово в Typescript, поэтому его нужно было изменить. Поскольку пространство имен используется для стилей, мы смогли легко изменить свойство на styleNamespace.
Чистое программирование - отличная цель, к которой должен стремиться каждый разработчик. Важной практикой чистого программирования является наличие сильных, точных и, если возможно, кратких имен переменных. Поскольку эта перезапись является своего рода сбросом, давайте еще раз перейдем к этому интерфейсу и посмотрим, сможем ли мы обновить какие-либо другие.
Поскольку цвет относится к теме color, мы решили быть более конкретными. zindex относится к свойству CSS z-index, поэтому мы обновляем его, чтобы оно стало верблюжьим регистром.
Есть ли еще какие-то обновления, которые мы можем внести в интерфейс? horizontalEdge и verticalEdge допускают только два допустимых значения. Чтобы упростить разработчикам работу с Typescript, мы дадим им подсказки относительно допустимых значений этих свойств.
Глядя на интерфейс, я думаю, что у нас отличный старт! В следующем посте мы начнем думать о фабрике уведомлений, которая стала совершенно новой с этой переписью.
Следовать вместе
Проект размещен на GitHub по адресу https://github.com/willsteinmetz/notific8. Я буду работать в ветке ts-2018 и размещать соответствующие хэши фиксации в конце каждого сообщения, в котором представлены изменения кода.
- 7e6c98f0 - Добавление файлов tsconfig и tslint. Создан интерфейс опций.
Первоначально опубликовано на gist.github.com.
