TypeScript 怎样在 TypeScript 中使用 JavaScript

在本文中，我们将介绍如何在 TypeScript 中使用 JavaScript。TypeScript 是一种由微软开发的开源编程语言，它是 JavaScript 的超集，可以编译成纯 JavaScript 代码。因此，TypeScript 允许开发者在编写代码时使用 JavaScript 的语法和特性，同时还提供了额外的类型检查功能。

阅读更多：TypeScript 教程

使用 JavaScript 语法

TypeScript 支持大部分 JavaScript 的语法，因此你可以直接在 TypeScript 文件中编写 JavaScript 代码。以下是一些常见的 JavaScript 语法示例：

变量声明和赋值

let name = 'John';

条件语句和循环语句

if (age > 18) {
    console.log('成年人');
} else {
    console.log('未成年人');
}

for (let i = 0; i < 10; i++) {
    console.log(i);
}

函数定义和调用

function sayHello(name) {
    console.log('Hello ' + name);
}

sayHello('World');

注意：TypeScript 需要在文件的顶部加入declare关键字来声明全局变量或函数，如果你使用的是第三方 JavaScript 库。

使用 JavaScript 库

在 TypeScript 中使用 JavaScript 库非常简单。首先，你需要安装所需的 JavaScript 库，并在 TypeScript 文件中引入它。以下是一些示例：

使用 npm 安装并导入 jQuery

npm install jquery

import from 'jquery';('body').text('Hello World');

使用直接引入 JavaScript 库

<script src="lodash.js"></script>

const array = [1, 2, 3];

console.log(_.sum(array));

类型声明文件

如果你使用的是第三方 JavaScript 库，而且该库没有提供 TypeScript 类型声明文件（.d.ts），你可以手动为该库编写类型声明文件，以便在 TypeScript 中使用该库时具备类型检查的功能。类型声明文件以.d.ts为后缀。以下是一个类型声明文件的示例：

declare class MyLibrary {
    constructor();
    doSomething(): void;
}

declare module 'my-library' {
    export = MyLibrary;
}

在上述示例中，我们声明了一个名为MyLibrary的类，并将其包装在一个名为my-library的模块中。这样，在 TypeScript 文件中引入my-library模块时，就可以获取到MyLibrary类的类型检查功能。

创建声明文件

如果你想为自己编写的 JavaScript 文件添加类型检查，或者将 JavaScript 项目迁移到 TypeScript，你需要为 JavaScript 文件编写类型声明文件。以下是一个简单的例子：

// math.d.ts

declare function add(a: number, b: number): number;
declare function subtract(a: number, b: number): number;

在上述示例中，我们声明了两个全局函数add和subtract的类型信息。这样，在其他 TypeScript 文件中引入math.d.ts后，就可以使用add和subtract函数，并且 TypeScript 会对参数类型和返回值类型进行检查。

总结

通过本文的介绍，我们学习了如何在 TypeScript 中使用 JavaScript 语法和特性。我们还了解了如何使用 JavaScript 库，以及如何为第三方库和自己的 JavaScript 文件编写类型声明文件。借助 TypeScript 的类型检查功能，我们可以在开发过程中避免很多潜在的错误，提高代码的可维护性和可靠性。希望本文对你的 TypeScript 学习和开发实践有所帮助！