Объясните, когда использовать ключевое слово «объявить» в TypeScript
В этой статье мы увидим, как использовать ключевое слово declare в Typescript.
Ключевое слово declare в TypeScript используется для объявления Ambient переменных или методов. Ambient Declarations похожи на ключевое слово импорта. Что сообщает компилятору, что источник существует в другом файле. Мы используем объявления Ambient в TypeScript для использования сторонних библиотек JavaScript, jQuery, Node и т. д. Объявление ключевого слова напрямую интегрирует эти библиотеки в наш код и снижает вероятность ошибки в нашем коде TypeScript.
Мы используем ключевое слово declare только в файле Ambient, чтобы использовать методы и переменные библиотек.
Синтаксис:
declare var Variable_Name; declare module Name_of_Module{// Body of module };
Давайте разберемся с помощью следующего примера.
Пример: Теперь возьмем один пример: у нас есть один файл, который содержит несколько полезных переменных, но файл написан на JavaScript. Поэтому мы не можем сказать, что нам нужно написать какой-то код JavaScript на TypeScript. Это занимает так много времени, что мы должны написать тот же код на TypeScript. Но мы объявили ключевые слова, дающие возможность использовать ту же переменную в конце кода. код.
Предположим, у нас есть сторонний код JavaScript, в котором есть переменная, содержащая значение какой-то переменной, но мы не значение, но с помощью объявления ключевого слова мы можем использовать значение переменной в нашем коде.
Сторонний код:
Javascript
var pi_1 = 3.1415926535 ; var pi_2 = 3.14159265358979323846 ; var pi_3 = 3.141592653589793238462643383279; |
Мы хотим использовать эту переменную в нашем коде, чтобы мы могли использовать их для объявления ключевого слова с тем же именем, и TypeScript не выдаст ошибку.
Код TypeScript:
Javascript
declare var pi_1 : any ; console.log( "Value of pi is :" ,pi_1) |
Теперь мы можем импортировать оба файла в наш HTML-код и использовать их.
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport"
content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Document</title>
</head>
<body>
<!-- Javascript Library -->
<script src=
"C:UserscomputersDesktop ypescriptfirst1.js">
</script>
<script src=
"C:UserscomputersDesktop ypescriptsecons.js">
</script>
</body>
</html>