1. Что такое машинопись?
TypeScript — это надмножество JavaScript, которое расширяет синтаксис JavaScript, по существу добавляя в язык необязательную статическую типизацию и объектно-ориентированное программирование на основе классов. Любая существующая программа на JavaScript может работать на TypeScript без изменений, что эквивалентно JS в эпоху ES. TypeScript предназначен для разработки больших приложений и во время компиляции создает JavaScript для обеспечения совместимости.
2. В чем разница между JavaScript и машинописным текстом?
TypeScript может использовать весь код и концепции кодирования в JavaScript, TypeScript был создан, чтобы упростить разработку JavaScript. Например, TypeScript использует такие понятия, как типы и интерфейсы, для описания используемых данных, что позволяет разработчикам быстро обнаруживать ошибки и отлаживать приложения.
- TypeScript расширяет объектную модель JavaScript с точки зрения основного языка и моделирования концепций классов.
- Код JavaScript может работать с TypeScript без каких-либо изменений, а для преобразования кода TypeScript в JavaScript можно использовать компилятор.
- TypeScript обеспечивает статическую проверку типов во время компиляции с помощью аннотаций типов.
- Данные в TypeScript требуют явного типа, JavaScript — нет.
- TypeScript предоставляет значения параметров по умолчанию для функций.
- TypeScript вводит концепцию «классов», которой нет в JavaScript.
- TypeScript представляет концепцию модулей, которые могут инкапсулировать объявления, данные, функции и классы в модули.
3. Зачем использовать TypeScript?
代码约束、提示能力
3.1 Кодовые ограничения
Механизм типов TypeScript может эффективно предотвращать неправильное использование, вызванное типами переменных, и разработчики могут контролировать степень мониторинга типов.Строгое ограничение типов переменных или слабое ограничение типов переменных зависит от потребностей разработки разработчика.
3.2 Подсказки по коду
3.2.1 Автоматическое завершение кода
Подсказки кода TypeScript автоматически появляются в соответствующей позиции курсора при вводе символов. Список подсказок основан на определенном порядке, а не в алфавитном порядке.Если вы активируете подсказку внутри метода, формальный параметр будет иметь приоритет перед внешним интерфейсом.
3.2.2 Цвет кода
3.2.3 Подсказка кода при наведении курсора
Вы можете быстро получить описание цели в документе, коснувшись имени метода, переменной или класса мышью.
3.2.4 Советы по параметрам метода и перегрузке метода
Когда вы закончите ввод вызова метода, вы можете запросить параметры метода, а также информацию в комментариях о количестве параметров, которые вы собираетесь ввести, и связанных параметрах. При этом, если метод был перегружен, может отображаться подсказка для каждой перегрузки. Вы можете использовать клавиши со стрелками вверх и вниз на клавиатуре для переключения между представлениями.
3.2.5 Форматирование кода
Для конфигурации, связанной с форматированием, например, следует ли переносить строку после объявления метода, вы можете установить ее следующими способами.
Откройте меню: Окно -> Настройки (Preferences -> Preferences).
3.2.6 Подсветка ссылки на код
Когда вы выбираете переменную или метод, редактор может мгновенно запросить у вас все ссылки на текущий выбор в текущем файле TypeScript.
3.2.7 Немедленное сообщение об ошибке
Пока вы печатаете код TypeScript, это может помочь вам вовремя обнаружить синтаксические и семантические ошибки в коде и эффективно подсказать строку, чтобы вы могли быстро пересмотреть проблему написания.
3.2.8 Поиск ссылок и объявлений
Эта функция может легко запросить ссылку на класс, метод или переменную во всем проекте и может напрямую открыть соответствующий файл TypeScript через панель поиска и выбрать соответствующий код. Вы можете найти ссылки и объявления, щелкнув правой кнопкой мыши фрагмент кода и выбрав «Найти ссылки» или «Найти определения» во всплывающем меню.
4. Языковые расширения для добавления функций
4.1 Классы
Классы — это ядро TypeScript.При разработке с помощью TypeScript большая часть кода пишется в классах.
4.2 Интерфейсы
Предоставленный интерфейсный интерфейс очень полезен при разработке проекта для установления определенного соглашения о коде.Один из основных принципов TypeScript заключается в проверке типа структуры значения. В TypeScript роль интерфейсов состоит в том, чтобы называть эти типы и определять контракты для вашего кода или стороннего кода.
Интерфейс IPerson подобен имени, представляющему объект со свойством name типа string и свойством age типа number. Пока входящий объект удовлетворяет вышеуказанным необходимым условиям, он разрешен.
Интерфейс с необязательными атрибутами похож на определение обычного интерфейса, за исключением того, что после определения имени необязательного атрибута добавляется знак ?. Одно из преимуществ необязательных свойств заключается в том, что они могут предопределять свойства, которые могут существовать, а второе преимущество заключается в том, что они могут перехватывать ошибки при ссылке на несуществующее свойство.
Обратите внимание, что если необязательные параметры не передаются, обязательные параметры не могут быть помещены после необязательных параметров.
4.3 Модули
Модули помогают разработчикам разделить код на повторно используемые единицы. Разработчики могут сами решать, какие ресурсы (классы, методы, переменные) в модуле доступны для внешнего использования, а какие Ресурсы используются только внутри модулей. В TS файл является модулем, и внутри модуля есть два ключевых слова (экспорт, импорт) для поддержки характеристик модуля. Эти два ключевых слова контролируют то, что модуль предоставляет внешнему миру и что другие модули должны предоставить вам.
4.4 Аннотации типов Аннотации типов
Аннотации для примитивных типов — числовые, логические и строковые. Структуры со слабой или динамической типизацией имеют тип any. Компилятор TypeScript использует определение типа для вывода типа, когда тип не задан. Если ни один тип не может быть выведен из-за отсутствия объявления, то по умолчанию используется динамический любой тип.
4.5 Проверка типа во время компиляции
При компиляции проверьте тип переменной, продолжите компиляцию, если она соответствует требованиям, и сообщите об ошибке, если она не соответствует требованиям.
4.6 Выражения со стрелками
Выражение ()=>{что-то} или ()=>что-то эквивалентно функции в js, и его преимущество в том, что оно может автоматически добавлять это в функции к контексту, устраняя проблему этого указания.
5. Часто задаваемые вопросы
5.1 Базовый тип любой
Иногда нам нужно указать тип для переменных, тип которых неизвестен на этапе программирования. Эти значения могут поступать из динамического содержимого, например, из пользовательского ввода или сторонних репозиториев кода. В данном случае мы не хотим, чтобы средство проверки типов проверяло эти значения и просто позволяло им проходить проверки во время компиляции. Затем мы можем использовать тип any для обозначения этих переменных.
5.2 var let const разница
var: переменная, объявленная с помощью var, ее область действия находится внутри функции, в которой находится оператор, и существует явление продвижения переменной (объявления функций и переменных будут продвигаться в начало функции)
let: область действия переменной, объявленной с помощью let, находится в пределах блока кода, в котором находится оператор, и продвижение переменной отсутствует;
const: константы, объявленные с помощью const, аналогичны объявлениям let, но, как следует из их названия, их нельзя изменить после того, как им будет присвоено значение. Другими словами, они имеют те же правила области действия, что и let, но их нельзя переназначить.
5.3 Остальные параметры
Обязательные параметры, параметры по умолчанию и необязательные параметры имеют одну общую черту: они представляют определенный параметр. Иногда вы хотите управлять несколькими параметрами одновременно или не знаете, сколько параметров будет передано. Все параметры можно собрать в переменную, а остальные параметры будут рассматриваться как неограниченное количество необязательных параметров. Не может быть ни одного, а может быть любой. Компилятор создает массив аргументов с именами, которые вы указываете после многоточия ( ... ).
5.4 для ... из и для ... в
И for..of, и for..in могут перебирать список, но значения, используемые для перебора, разные, for..in перебирает список ключей объекта, а for..of перебирает значения соответствующие ключам объекта.
6. Подробное объяснение tsconfig.json в проекте React
Если файл tsconfig.json существует в каталоге, это означает, что этот каталог является корневым каталогом проекта TypeScript. Файл tsconfig.json указывает корневой файл и параметры сборки, используемые для компиляции проекта.
`{ "Параметры компилятора": { "outDir": "./dist/", //Перенаправить вывод, путь вывода пакета
"sourceMap": true, //生成相应的 .map文件
"allowSyntheticDefaultImports": true, //允许从没有设置默认导出的模块中默认导入
"experimentalDecorators": true, //修饰符
"moduleResolution": "node”, //决定如何处理模块
"declaration": false, //生成相应的 .d.ts文件
"target": "es6”, //指定ES的目标版本
"jsx": “react” //在 .tsx文件里支持JSX
},
"exclude": [ "node_modules" ],
"включать": [ "источник/**/*" ] }` Атрибуты «исключить» и «включить» задают список шаблонов сопоставления файловых шаблонов.
Поддерживаемые подстановочные знаки glob:
匹配0或多个字符（不包括目录分隔符）
? 匹配一个任意字符（不包括目录分隔符）
**/ 递归匹配任意子目录
Справочный документ: https://baike.baidu.com/item/typescript/4314718?fr=aladdin Цзяньшу https://www.jianshu.com/p/c5005fad4274
Учебник для новичков https://www.runoob.com/w3cnote/getting-started-with-typescript.html
Возможность подсказки http://edn.egret.com/cn/docs/page/941
https://www.cnblogs.com/langzianan/p/8403332.html