Так как я начал писать Javascript в проекте в течение некоторого времени в прошлом году, я чувствую, что язык без проверки типов мне все еще не подходит, поэтому я всегда хотел попробовать TypeScript, но из-за огромного проекта и проблемы с кадровая совместная работа, какое-то время нельзя будет врубиться в TypeScript. Так получилось, что в последнее время появился спрос на небольшие программы, а небольшая программа официально поддержала TypeScript в ноябре прошлого года, так что я использовал ее для практики.
Почему TypeScript?
Вероятно, за последние полгода я много написал о Swift, и статические типы и протоколы в Swift — мои любимые функции. Именно то, что TypeScript привносит в JavaScriptстатический типа такжеинтерфейс.
необязательный статический тип
«Динамическая типизация какое-то время крута, крематорий рефакторинга кода», для кого-то вроде меня, кто очень любит реструктурировать (gai) код, в JavaScript нет подсказок по типам, а тип, основанный на угадывании имени, крайне недружелюбен. TypeScript добавляет гибкую систему типов, которая не только может проверять период кодирования, но также повышает читаемость кода и предоставляет любой тип для буферизации.
интерфейс
Интерфейс и протокол — это просто разные имена: Java, C# и TypeScript называются интерфейсом, а Swift и Kotlin — протоколом, что является своего рода объявлением правила. В проекте, где данные взаимодействуют с внутренним интерфейсом, страница передает данные, данные хранятся, а метод делегируется, интерфейс будет более удобным и легко реконструируемым. Интерфейс TypeScript + простые объекты JavaScript делают построение данных простым и безошибочным.
Поддержка апплета для TypeScript
Одна очень важная вещь в TypeScript — это файл d.ts. Файл d.ts фактически эквивалентен заголовочному файлу .h на языке C, объявляя методы и свойства, открытые для внешнего мира. Официальная поддержка TypeScript апплета означает, что официальный будет поддерживать файл d.ts собственного API апплета, то есть библиотеки типизации, чтобы при изменении API его можно было изменить немедленно.
Также очень просто использовать, обновлять инструменты разработчика WeChat до последней версии и выбирать шаблон TypeScript при создании нового проекта.
После создания мы видим, что в проект заносятся библиотека типизации и конфигурационный файл TypeScript tsconifg. После этого он не будет автоматически компилироваться при сохранении, нужно нажать кнопку компиляции на панели инструментов апплета.
Здесь есть яма Версия TypeScript, установленная на моем компьютере, - версия 3.2.2. Глобальные типы CallableFunction и NewableFunction не могут быть найдены во время компиляции.
Решение также очень простое: перейдите в каталог bin пакета TypeScript по пути node_modules и скопируйте два типа интерфейсов из файла lib.es5.d.ts в lib.wa.es6.d в апплете, набрав каталог ..ts внутри него. Этот файл в шаблоне апплета должен быть копией официального TypeScript, но он не изменился при официальном обновлении.
мероприятие
Для событий представления соответствующий тип не имеет определения интерфейса в типизациях, поэтому я могу использовать только временно, а потом использовать его сам
as Обозначает тип данных, переносимых событием.
Page&Data
Каждый объект Page определяется при наборе текста.
declare const Page: Page.PageConstructor
interface PageConstructor {
<D extends IAnyObject, T extends IAnyObject & PageInstance>(
options: PageInstance<D, T> & T
): void
}
То есть он поддерживает обе парадигмы D и T. Что это за две парадигмы? В апплете Page записывается так.
Page({});
Другими словами, параметр options является PageInstance, и общий тип также передается.
interface PageInstance<D extends IAnyObject = any, T extends IAnyObject = any> extends PageInstanceBaseProps<D>
Метод цикла объявления страницы определен в PageInstance, который наследуется от PageInstanceBaseProps, и передается общий тип D.
interface PageInstanceBaseProps<D extends IAnyObject = any> {
data?: D
//...
}
Таким образом, эта парадигма D на самом деле представляет собой тип интерфейса данных. Поскольку данные не требуются для реализации, поэтому они здесь необязательны? .
Так что такое Т?
T extends IAnyObject & PageInstance
T на самом деле является расширением PageInstance, PageInstance — интерфейсом экземпляра Page, затем T — фактически интерфейсом типа this в Page, то есть все методы и свойства, которые необходимо добавить в Page, определены в T.
Итак, для обычной страницы мы можем объявить два интерфейса, например, один для данных и один для страницы.
interface IIntroPage {
nextButtonTap(event: any): void;
isLoading: boolean;
}
interface IIntroData {
test: string;
}
Page<IIntroData, IIntroPage>({
isLoading: false,
nextButtonTap(event: any) {
this.isLoading = true;
}
});
Если странице не нужны данные или не нужно расширять страницу, используйте IAnyObject вместо D или T.
interface PageInstanceBaseProps<D extends IAnyObject = any> {
data?: D
setData?<K extends keyof D>(
data: D | Pick<D, K> | IAnyObject,
callback?: () => void
): void
}
В то же время, поскольку и setData, и data объявлены необязательными, их нужно добавлять при использовании! ,this.setData!({})а такжеthis.data!.
Остальное ничего, после использования TypeScript официальный API может напрямую видеть типы параметров и возвращаемых значений, больше не нужно проверять документ, чтобы угадать тип.
вызов JavaScript
Напишите простой файл .d.ts для JavaScript, в котором представлены классы и методы, которые необходимо вызвать. Подробнее см.Как написать файл d.ts.
наконец
Хотя автор некоторое время использует TypeScript, строгая проверка позволяет мне быстро рефакторить поля интерфейса, добавляя, удаляя и изменяя поля интерфейса, и вызовы методов связаны, и просмотр API также намного удобнее. . Нет проблем с поддержкой TypeScript для повседневного использования и разработки небольших программ, но существует несколько официальных руководств по документации.