TypeScript 中的 import 和 require 关键字的使用方法-JavaScript中文网-JavaScript教程资源分享门户

在前端开发中，我们经常需要引入其他模块或库来实现特定的功能，而在 TypeScript 中，我们可以使用 import 和 require 关键字来引入外部模块或库。本文将详细介绍这两个关键字的使用方法，并提供示例代码以供参考。

import 关键字

import 关键字是 TypeScript 中用来引入其他模块或库的关键字，它的语法格式如下：

import { 模块名 } from '模块路径';

其中，模块名是指要引入的模块的名称，模块路径是指要引入的模块所在的路径。例如，如果我们要引入 lodash 库中的 map 方法，可以使用以下代码：

import { map } from 'lodash';

在引入模块后，我们就可以使用该模块中的方法或属性了。例如，使用上面的代码引入 lodash 库中的 map 方法后，就可以在代码中使用 map 方法了：

const arr = [1, 2, 3];
const newArr = map(arr, num => num * 2);
console.log(newArr); // [2, 4, 6]

需要注意的是，如果要引入的模块是默认导出的，那么可以使用以下语法：

import 模块名称 from '模块路径';

例如，如果要引入 React 库中的 default 方法，可以使用以下代码：

import React from 'react';

require 关键字是 JavaScript 中用来引入其他模块或库的关键字，而在 TypeScript 中，也可以使用 require 关键字来引入外部模块或库。其语法格式如下：

const 模块名称 = require('模块路径');

其中，模块名称是指要引入的模块的名称，模块路径是指要引入的模块所在的路径。例如，如果我们要引入 lodash 库中的 map 方法，可以使用以下代码：

const map = require('lodash/map');

在引入模块后，我们也可以使用该模块中的方法或属性。例如，使用上面的代码引入 lodash 库中的 map 方法后，就可以在代码中使用 map 方法了：

const arr = [1, 2, 3];
const newArr = map(arr, num => num * 2);
console.log(newArr); // [2, 4, 6]

需要注意的是，如果要引入的模块是默认导出的，那么可以使用以下语法：

const 模块名称 = require('模块路径').default;

例如，如果要引入 React 库中的 default 方法，可以使用以下代码：

const React = require('react').default;

虽然 import 和 require 都可以用来引入外部模块或库，但它们之间还是存在一些区别的：

由于 import 是静态引入，因此可以在编译时就检查到错误，而 require 则需要在运行时才能检查到错误。另外，由于 import 是编译时执行，因此可以在代码中使用 import 前进行类型检查和代码提示，而 require 则没有这个功能。

本文介绍了 TypeScript 中的 import 和 require 关键字的使用方法，并提供了示例代码以供参考。需要注意的是，在使用这两个关键字时，要根据实际情况选择合适的关键字，并注意它们之间的区别。希望本文能对大家理解 TypeScript 中的模块化开发有所帮助。

来源：JavaScript中文网，转载请注明来源 https://www.javascriptcn.com/post/664193e4d3423812e4f92c4e