一、import和require的基本概念

在JavaScript中，我们需要在代码中使用其他代码，最常见的方式就是使用import和require。 import是ES6中的概念，用于引入其他文件中导出的模块，在浏览器端需要使用打包工具（如webpack）才能使用import。require是Node.js中的概念，用于引入其他文件中导出的模块，Node.js本身就支持使用require。下面是一段使用import引入模块的代码，该模块导出了一个函数add：

// math.js
export function add(a, b) {
  return a + b;
}
// index.js
import {add} from "./math.js";
console.log(add(1, 2));  // 输出3

下面是一段使用require引入模块的代码，该模块导出了一个函数add：

// math.js
module.exports = {
  add: function(a, b){
    return a + b;
  }
};
// index.js
const math = require('./math.js');
console.log(math.add(1, 2));  // 输出3

二、import和require的区别

import和require的区别主要有以下几点：

import是ES6中的语法，require是Node.js中的语法；
import支持静态优化，可以在编译时静态解析，不需要执行代码就可以获得引用的模块，而require则是动态工作，必须在运行时才能查找并加载模块；
import导入的模块是只读的，不能被修改，而require导入的模块是可修改的；
import支持引用的模块是ES6的标准模块，而require支持的模块类型更加丰富；
import引用的模块路径必须是字符串常量，而require引用的模块路径可以是变量或者表达式等。

三、import和require的用法实例

下面分别给出import和require的具体使用实例：

1、import的使用实例

index.js文件引入math.js中的add函数：

// math.js
export function add(a, b) {
  return a + b;
}
// index.js
import {add} from "./math.js";
console.log(add(1, 2));  // 输出3

2、require的使用实例

index.js文件引入math.js中的add函数：

// math.js
module.exports = {
  add: function(a, b){
    return a + b;
  }
};
// index.js
const math = require('./math.js');
console.log(math.add(1, 2));  // 输出3

3、使用import导入带有默认导出的模块

mod.js文件中有一个默认导出的函数：

export default function(x) {
  return x * x;
}

index.js文件中通过import导入该模块，注意，在导入默认导出的模块时，不需要写花括号，直接写导出变量名称即可：

import Mod from './mod.js';
console.log(Mod(3));  // 输出9

4、使用require导入带有默认导出的模块

mod.js文件中有一个默认导出的函数：

module.exports = function(x) {
  return x * x;
}

index.js文件中通过require导入该模块，注意，在导入默认导出的模块时，不需要写花括号，直接写导出变量名称即可：

const Mod = require('./mod.js');
console.log(Mod(3));  // 输出9

5、通过require实现模块代码的动态加载

下面是一个通过require实现模块代码的动态加载的例子，index.js中实现了在程序执行时再动态加载模块：

// index.js
function loadModule(filename) {
  const module = {
    exports: {}
  };
  require(filename)(module, module.exports);
  return module.exports;
}
console.log(loadModule('./math.js').add(1, 2));  // 输出3

四、结语

import和require都是非常重要的JavaScript模块引用关键词，import是ES6中的概念，require是Node.js中的概念，两者在实现及应用方面都有所区别，但在使用上又具有相似性，在实际应用中需要因情况而定。

import和require详解