Es module vs require

标签：wordpress   优化   执行   引擎   arc   hello   blog   输入   规格   

A--require 和 import比较

B--用法比较

• require

const fs = require(‘fs‘)
exports.fs = fs
module.exports = fs

• import

import fs from ‘fs‘
import {default as fs} from ‘fs‘
import * as fs from ‘fs‘
import {readFile} from ‘fs‘
import {readFile as read} from ‘fs‘
import fs, {readFile} from ‘fs‘

export default fs
export const fs
export function readFile
export {readFile, read}
export * from ‘fs‘

B1--支持实现度

C--解析结果

• require是赋值过程，其实require的结果就是对象、数字、字符串、函数等，再把require的结果赋值给某个变量
• import是解构过程，但是目前所有的引擎都还没有实现import，我们在node中使用babel支持ES6，也仅仅是将ES6转码为ES5再执行，import语法会被转码为require

D--引用实例

// ES2015 modules

// ---------------------------------
// one.js
console.log(‘running one.js‘);
import { hello } from ‘./two.js‘;
console.log(hello);

// ---------------------------------
// two.js
console.log(‘running two.js‘);
export const hello = ‘Hello from two.js‘;

// CommonJS modules

// ---------------------------------
// one.js
console.log(‘running one.js‘);
const hello = require(‘./two.js‘);
console.log(hello);

// ---------------------------------
// two.js
console.log(‘running two.js‘);
module.exports = ‘Hello from two.js‘;

es6
running two.js
running one.js
hello from two.js

commonjs
running one.js
running two.js
hello from two.js

E--前景展望，谁会一统模块江湖

1. node > 13 已经全面支持 link,目前是共存局面
2. deno 使用es模块deno
3. 两种同事存在的可能性，不是很大，es6模块会越来越普及，建议以后都使用es6模块机制

F--资源分享 es module in browser

Es module vs require

标签：wordpress   优化   执行   引擎   arc   hello   blog   输入   规格   

原文地址：https://www.cnblogs.com/jlzt/p/12935997.html