JavaScript中require和import的区别详解

在JavaScript中，有两种方法用于引入外部模块：require和import。这两种方法虽然都能实现模块的引入，但是在用法和功能上存在一些区别，接下来我们将分别讲解它们并提供示例。

require

require是CommonJS中使用的一种加载机制，使用较为简单，用于引入基于node.js的代码库。其语法如下：

const module = require('模块名');

其中，模块名是需要引入的js模块的路径。

示例：

// 引入node.js内置的http模块
const http = require('http');

// 创建http服务器
const server = http.createServer((req, res) => {
    res.statusCode = 200;
    res.setHeader('Content-Type', 'text/plain');
    res.end('Hello World\n');
});

// 监听8080端口
server.listen(8080, () => {
    console.log('Server running at http://localhost:8080/');
});

在上述示例中，我们使用require语句引入了node.js内置的http模块，并使用该模块创建了一个http服务器，最终监听了8080端口。

import

import是ES6中引入模块的关键字。与require相比，import语法更为灵活，并且支持抽象语法树，在浏览器端运行和引入外部模块时也更为方便。其语法如下：

import 模块默认输出名 from '模块';

其中，模块默认输出名是需要引入js模块的默认输出。

示例：

// 引入lodash模块中的join方法
import join from 'lodash/join';

// 调用join方法，将两个字符串连接起来
const result = join(['Hello', 'World'], ' ');

console.log(result);

在上述示例中，我们使用import语句引入了lodash模块中的join方法，并将两个字符串连接起来。需要注意的是，在ES6模块系统中，模块路径必须是相对路径或绝对路径。

总结

• require是CommonJS中使用的一种模块加载机制，支持在node.js中引入模块。
• import是ES6中引入模块的关键字，支持抽象语法树，在浏览器端运行和引入外部模块时更为方便。
• require和import的语法和功能有一定差异，需要根据具体的使用情景进行选择。

以上就是JavaScript中require和import的区别的详细攻略。希望可以帮助你更好的理解模块引入的机制。