以下是一些ES6新特性的常见面试题及答案:
- 请简要介绍ES6的箭头函数。
ES6的箭头函数是一种新的函数定义语法,它可以更简洁地定义函数,而且可以自动绑定函数的上下文(this)。箭头函数的语法如下:
(param1, param2, ...) => { statements }
例如:
const sum = (a, b) => a + b;
console.log(sum(1, 2)); // 3
- 请简要介绍ES6的let和const关键字。
ES6的let和const关键字用于声明变量,相对于ES5的var关键字,它们有以下特点:
- let声明的变量具有块级作用域,而var声明的变量具有函数级作用域。
- const声明的变量是常量,也具有块级作用域,一旦被赋值就不能再次赋值。
例如
function example() {
var a = 1;
let b = 2;
const c = 3;
if (true) {
var a = 10;
let b = 20;
const c = 30;
console.log(a); // 10
console.log(b); // 20
console.log(c); // 30
}
console.log(a); // 10
console.log(b); // 2
console.log(c); // 3
}
- 请简要介绍ES6的模板字符串。
ES6的模板字符串是一种新的字符串定义语法,它可以更方便地定义包含变量或表达式的字符串。模板字符串使用反引号(`)括起来,变量或表达式使用${}包裹。例如:
const name = 'Alice';
const age = 18;
const message = `My name is ${name}, and I'm ${age} years old.`;
console.log(message); // My name is Alice, and I'm 18 years old.
- 请简要介绍ES6的解构赋值。
ES6的解构赋值是一种新的赋值语法,它可以从数组或对象中提取值,并将其赋给变量。解构赋值的语法如下:
// 数组解构
const [a, b, ...rest] = [1, 2, 3, 4, 5];
console.log(a); // 1
console.log(b); // 2
console.log(rest); // [3, 4, 5]
// 对象解构
const { name, age } = { name: 'Alice', age: 18 };
console.log(name); // Alice
console.log(age); // 18
- 请简要介绍ES6的类和继承。
ES6的类和继承是一种新的面向对象编程语法,它可以更方便地定义类和实现继承。类的定义使用class关键字,继承使用extends关键字。例如
class Animal {
constructor(name) {
this.name = name;
}
sayName() {
console.log(`My name is ${this.name}.`);
}
}
class Dog extends Animal {
constructor(name, breed) {
super(name);
this.breed = breed;
}
bark() {
console.log('Woof!');
}
}
const dog = new Dog('Buddy', 'Labrador');
dog.sayName(); // My name is Buddy.
dog.bark(); // Woof!
- 请简要介绍ES6的Promise和async/await。
ES6的Promise和async/await是一种新的异步编程语法,它们可以更方便地处理异步操作。Promise是一种表示异步操作结果的对象,它可以链式调用,使用then和catch方法处理异步操作的结果或错误。例如:
function fetchData() {
return new Promise((resolve, reject) => {
setTimeout(() => {
resolve('Data');
}, 1000);
});
}
fetchData()
.then(data => {
console.log(data); // Data
})
.catch(error => {
console.log(error);
});
async/await是一种基于Promise的语法糖,它可以更直观地编写异步代码。async函数返回一个Promise对象,await关键字可以暂停函数执行,直到异步操作完成并返回结果。例如:
async function fetchData() {
return new Promise((resolve, reject) => {
setTimeout(() => {
resolve('Data');
}, 1000);
});
}
async function main() {
try {
const data = await fetchData();
console.log(data); // Data
} catch (error) {
console.log(error);
}
}
main();
- 请简要介绍ES6的模块化和import/export关键字。
ES6的模块化是一种新的模块定义语法,它可以更方便地组织和管理代码。模块化使用import和export关键字来定义和导入导出模块。例如:
// 定义模块
export const PI = 3.14159;
export function square(x) {
return x * x;
}
// 导入模块
import { PI, square } from './math';
console.log(PI); // 3.14159
console.log(square(2)); // 4
- 请简要介绍ES6的Map和Set数据结构。
ES6的Map和Set数据结构是一种新的集合类型,它们可以更方便地存储和操作数据。Map是一种键值对集合,键可以是任意类型,值可以是任意类型。Set是一种值集合,值可以是任意类型,且不重复。例如:
// 使用Map
const map = new Map();
map.set('name', 'Alice');
map.set('age', 18);
console.log(map.get('name')); // Alice
console.log(map.size); //2
// 使用Set
const set = new Set();
set.add(1);
set.add(2);
set.add(2);
console.log(set.has(1)); // true
console.log(set.has(2)); // true
console.log(set.size); // 2
- 请简要介绍ES6的默认参数和剩余参数。
ES6的默认参数和剩余参数是一种新的函数参数定义语法,它们可以更方便地定义和调用函数。默认参数允许在函数定义时为参数指定默认值,如果调用函数时没有传递参数,则使用默认值。剩余参数允许将多个参数打包成一个数组,方便函数内部进行处理。例如:
// 默认参数
function greet(name = 'World') {
console.log(`Hello, ${name}!`);
}
greet(); // Hello, World!
greet('Alice'); // Hello, Alice!
// 剩余参数
function sum(...numbers) {
return numbers.reduce((acc, cur) => acc + cur, 0);
}
console.log(sum(1, 2, 3)); // 6
console.log(sum(4, 5, 6, 7)); // 22
- 请简要介绍ES6的Proxy和Reflect对象。
ES6的Proxy和Reflect对象是一种新的元编程特性,它们可以更方便地拦截和定制对象的行为。Proxy对象可以代理另一个对象,拦截并修改该对象的默认行为,例如拦截属性访问、函数调用、in操作符等。Reflect对象提供了一组默认行为的方法,例如获取对象属性、设置对象属性、调用函数等,这些方法可以被Proxy对象拦截和修改。例如:
// Proxy对象
const obj = new Proxy({}, {
get(target, key) {
console.log(`Getting ${key}...`);
return Reflect.get(target, key);
},
set(target, key, value) {
console.log(`Setting ${key} to ${value}...`);
return Reflect.set(target, key, value);
}
});
obj.name = 'Alice'; // Setting name to Alice...
console.log(obj.name); // Getting name... Alice
// Reflect对象
const obj = { name: 'Alice' };
Reflect.set(obj, 'name', 'Bob');
console.log(obj.name); // Bob
- 请简要介绍ES6的Symbol类型和迭代器协议。
ES6的Symbol类型是一种新的基本数据类型,它可以用于定义对象属性的唯一标识符。每个Symbol值都是唯一的,可以作为对象属性名使用。迭代器协议是一种新的遍历协议,它规定了一种遍历对象的通用方式,即对象必须实现一个名为Symbol.iterator的方法,返回一个迭代器对象,迭代器对象必须实现next方法,返回一个包含value和done属性的对象。例如:
// Symbol类型
const name = Symbol('name');
const obj = {
[name]: 'Alice'
};
console.log(obj[name]); // Alice
// 迭代器协议
const numbers = [1, 2, 3];
const iterator = numbers[Symbol.iterator]();
console.log(iterator.next()); // { value: 1, done: false }
console.log(iterator.next()); // { value: 2, done: false }
console.log(iterator.next()); // { value: 3, done: false }
console.log(iterator.next()); // { value: undefined, done: true }
- 请简要介绍ES6的字符串ES6的字符串新增了一些新的方法和语法,包括模板字符串、字符串的迭代器、startsWith、endsWith、includes、repeat、trimStart、trimEnd等方法。其中,模板字符串是一种新的字符串定义语法,可以更方便地定义包含变量或表达式的字符串。字符串的迭代器可以用于遍历字符串中的每个字符。startsWith、endsWith、includes等方法可以用于判断字符串是否以某个字符或子串开头、结尾或包含。repeat方法可以用于重复字符串。trimStart、trimEnd等方法可以用于去除字符串开头或结尾的空格。例如:
// 模板字符串
const name = 'Alice';
const age = 18;
const message = `My name is ${name}, and I'm ${age} years old.`;
console.log(message); // My name is Alice, and I'm 18 years old.
// 字符串的迭代器
const str = 'Hello';
for (let char of str) {
console.log(char);
}
// startsWith、endsWith、includes方法
const str = 'Hello, World!';
console.log(str.startsWith('Hello')); // true
console.log(str.endsWith('!')); // true
console.log(str.includes('World')); // true
// repeat方法
const str = 'Hello';
console.log(str.repeat(3)); // HelloHelloHello
// trimStart、trimEnd方法
const str = ' Hello ';
console.log(str.trimStart()); // 'Hello '
console.log(str.trimEnd()); // ' Hello'
- 请简要介绍ES6的Generator函数。
ES6的Generator函数是一种新的函数定义语法,它可以更方便地编写迭代器。Generator函数使用function*关键字定义,它可以在函数内部使用yield关键字暂停函数执行,并返回一个包含value和done属性的对象,可以通过调用next方法恢复函数执行。Generator函数可以用于生成无限序列、异步操作等场景。例如:
function* range(start, end) {
for (let i = start; i <= end; i++) {
yield i;
}
}
const iterator = range(1, 5);
console.log(iterator.next()); // { value: 1, done: false }
console.log(iterator.next()); // { value: 2, done: false }
console.log(iterator.next()); // { value: 3, done: false }
console.log(iterator.next()); // { value: 4, done: false }
console.log(iterator.next()); // { value: 5, done: false }
console.log(iterator.next()); // { value: undefined, done: true }
- 请简要介绍ES6的模块加载器和动态导入。
ES6的模块加载器是一种新的模块加载方式,它可以在浏览器和Node.js环境下加载模块,并支持异步加载模块。ES6的模块加载器使用import()函数动态加载模块,返回一个Promise对象,可以使用await关键字等待异步加载完成。动态导入可以在运行时根据需要动态加载模块,可以用于实现按需加载、懒加载等功能。例如:
// 动态导入
async function main() {
const module = await import('./module.js');
console.log(module.foo());
}
main();
// 模块加载器
import { foo } from './module.js';
console.log(foo());
- 请简要介绍ES6的async/await语法和Promise对象。
ES6的async/await语法是一种新的异步编程语法,它可以更方便地编写异步函数,使得异步代码看起来像同步代码。async函数使用async关键字定义,可以在函数内部使用await关键字等待异步操作完成,并返回一个Promise对象。Promise对象是一种新的异步编程模型,它可以更方便地处理异步操作的结果和错误,使用then方法和catch方法处理成功和失败的情况。例如:
// async/await语法
async function main() {
const result = await fetch('https://api.github.com/users/username');
const json = await result.json();
console.log(json);
}
// Promise对象
fetch('https://api.github.com/users/username')
.then(result => result.json())
.then(json => console.log(json))
.catch(error => console.error(error));
- 请简要介绍ES6的Class语法和继承。
ES6的Class语法是一种新的面向对象编程语法,它可以更方便地定义类和实现继承。Class使用class关键字定义,可以定义构造函数、实例方法和静态方法,可以使用extends关键字实现继承。继承可以使子类拥有父类的属性和方法,并可以在子类中添加新的属性和方法。例如:
// Class语法和继承
class Person {
constructor(name, age) {
this.name = name;
this.age = age;
}
sayHello() {
console.log(`Hello, my name is ${this.name}, and I'm ${this.age} years old.`);
}
}
class Student extends Person {
constructor(name, age, grade) {
super(name, age);
this.grade = grade;
}
study() {
console.log(`${this.name} is studying in grade ${this.grade}.`);
}
}
const alice = new Student('Alice', 18, '12th');
alice.sayHello(); // Hello, my name is Alice, and I'm 18 years old.
alice.study(); // Alice is studying in grade 12th.
- 请简要介绍ES6的模板标签和标签模板。
ES6的模板标签和标签模板是一种新的字符串处理语法,它可以更方便地进行字符串的拼接和处理。模板标签是一个函数,可以用于对模板字符串进行处理,将模板字符串的各个部分作为参数传递给函数,最终返回处理后的结果。标签模板则是一种使用模板标签的方式,可以在模板字符串前面使用一个函数名作为标签,将模板字符串作为参数传递给函数。例如:
// 模板标签
function upper(strings, ...values) {
let result = '';
for (let i = 0; i < strings.length; i++) {
result += strings[i];
if (values[i]) {
result += values[i].toUpperCase();
}
}
return result;
}
const name = 'Alice';
const age = 18;
const message = upper`My name is ${name}, and I'm ${age} years old.`;
console.log(message); // My name is ALICE, and I'm 18 years old.
// 标签模板
function tag(strings, ...values) {
console.log(strings); // ["My name is ", ", and I'm ", " years old."]
console.log(values); // ["Alice", 18]
}
const name = 'Alice';
const age = 18;
tag`My name is ${name}, and I'm ${age} years old.`;
- 请简要介绍ES6的WeakMap和WeakSet数据结构。
ES6的WeakMap和WeakSet数据结构是一种新的集合类型,它们可以更方便地存储和操作数据。WeakMap是一种键值对集合,键必须是对象类型,值可以是任意类型。WeakSet是一种值集合,值必须是对象类型,且不重复。与Map和Set不同,WeakMap和WeakSet不会阻止垃圾回收,当键或值不再被引用时,它们会被自动回收。例如:
// WeakMap
const weakMap = new WeakMap();
const obj = { name: 'Alice' };
weakMap.set(obj, 'value');
console.log(weakMap.get(obj)); // value
// WeakSet
const weakSet = new WeakSet();
const obj = { name: 'Alice' };
weakSet.add(obj);
console.log(weakSet.has(obj)); // true
- 请简要介绍ES6的ArrayBuffer和TypedArray。
ES6的ArrayBuffer和TypedArray是一种新的二进制数据结构,它们可以更方便地操作二进制数据。ArrayBuffer是一种表示二进制数据的对象,它可以分配一段内存空间,存储二进制数据。TypedArray是一种表示基于ArrayBuffer的视图,可以对ArrayBuffer中的数据进行读写操作。不同的TypedArray可以表示不同的数据类型和字节序。例如:
// ArrayBuffer
const buffer = new ArrayBuffer(8);
const view = new DataView(buffer);
view.setInt8(0, 1);
view.setInt8(1, 2);
console.log(view.getInt16(0)); // 258
// TypedArray
const buffer = new ArrayBuffer(8);
const int16Array = new Int16Array(buffer);
int16Array[0] = 1;
int16Array[1] = 2;
console.log(int16Array[0]); // 1
- 请简要介绍ES6的Map和Set数据结构。
ES6的Map和Set数据结构是一种新的集合类型,它们可以更方便地存储和操作数据。Map是一种键值对集合,键可以是任意类型,值也可以是任意类型。Set是一种值集合,值可以是任意类型,且不重复。Map和Set可以用于存储和查找数据,支持添加、删除、查找等操作。例如:
// Map
const map = new Map();
map.set('name', 'Alice');
map.set('age', 18);
console.log(map.get('name')); // Alice
console.log(map.has('age')); // true
map.delete('age');
console.log(map.has('age')); // false
// Set
const set = new Set();
set.add('Alice');
set.add('Bob');
console.log(set.has('Alice')); // true
console.log(set.has('Charlie')); // false
set.delete('Bob');
console.log(set.has('Bob')); // false
- 请简要介绍ES6的Proxy和Reflect对象。
ES6的Proxy和Reflect对象是一种新的元编程(meta programming)手段,可以用于拦截和修改对象的行为。Proxy对象可以用于代理对象的行为,可以拦截对象的读写、调用、构造等操作。Reflect对象是一组用于操作对象的方法,可以替代部分Object方法和一些操作符。Proxy和Reflect可以用于实现对象的双向绑定、数据校验、权限控制等功能。例如:
// Proxy
const target = { name: 'Alice' };
const handler = {
get(target, key, receiver) {
console.log(`get ${key}`);
return Reflect.get(target, key, receiver);
},
set(target, key, value, receiver) {
console.log(`set ${key}=${value}`);
return Reflect.set(target, key, value, receiver);
}
};
const proxy = new Proxy(target, handler);
console.log(proxy.name); // get name, Alice
proxy.name = 'Bob'; // set name=Bob
// Reflect
const obj = { name: 'Alice' };
console.log(Reflect.get(obj, 'name')); // Alice
console.log(Reflect.has(obj, 'age')); // false
console.log(Reflect
- 请简要介绍ES6的Promise.all和Promise.race方法。
ES6的Promise.all和Promise.race方法是一种新的Promise组合方式,
可以更方便地处理多个异步操作的结果。
Promise.all方法接受一个由Promise对象组成的数组作为参数,
返回一个新的Promise对象,当数组中所有Promise对象都成功时,
返回一个包含所有Promise对象结果的数组,否则返回一个失败的Promise对象。
// Promise.all方法
const promise1 = Promise.resolve(1);
const promise2 = Promise.resolve(2);
const promise3 = Promise.resolve(3);
Promise.all([promise1, promise2, promise3])
.then(result => console.log(result)) // [1, 2, 3]
Promise.race方法与Promise.all方法类似,
也接受一个由Promise对象组成的数组作为参数,
返回一个新的Promise对象,当数组中任意一个Promise对象成功或失败时,
返回该Promise对象的结果。例如:
// Promise.race方法
const promise1 = new Promise(resolve => setTimeout(resolve, 1000, 'foo'));
const promise2 = new Promise(resolve => setTimeout(resolve, 2000, 'bar'));
Promise.race([promise1, promise2])
.then(result => console.log(result)) // foo
- 请简要介绍ES6的模块化语法和模块化加载器。
ES6的模块化语法是一种新的模块化编程语法,它可以更方便地组织和管理代码。模块化语法使用import和export关键字定义模块的导入和导出,可以实现模块之间的依赖管理和代码重用。模块化加载器是一种新的模块加载方式,它可以在浏览器和Node.js环境下加载模块,并支持异步加载模块。ES6的模块化加载器使用import()函数动态加载模块,返回一个Promise对象,可以使用await关键字等待异步加载完成。动态导入可以在运行时根据需要动态加载模块,可以用于实现按需加载、懒加载等功能。例如:
// 模块化语法
// module.js
export function foo() {
return 'foo';
}
// main.js
import { foo } from './module.js';
console.log(foo()); // foo
// 模块化加载器
// main.js
async function main() {
const module = await import('./module.js
- 请简要介绍ES6的Symbol类型和Symbol.iterator属性。
ES6的Symbol类型是一种新的基本数据类型,表示独一无二的值,可以用于定义对象的属性名、常量、枚举等。Symbol类型的值是不可变的、不能被枚举的。Symbol.iterator属性是一种新的迭代器接口,可以用于自定义对象的迭代器,使得对象可以使用for...of循环进行迭代。例如:
// Symbol类型
const s1 = Symbol();
const s2 = Symbol();
console.log(s1 === s2); // false
const MY_CONSTANT = Symbol('my constant');
console.log(MY_CONSTANT); // Symbol(my constant)
const obj = {
[Symbol.iterator]: function*() {
yield 1;
yield 2;
yield 3;
}
};
for (let item of obj) {
console.log(item);
}
// 1
// 2
// 3
- 请简要介绍ES6的模板字符串和解构赋值。
ES6的模板字符串是一种新的字符串拼接语法,它可以更方便地拼接字符串和变量,并支持多行字符串。模板字符串使用反引号(`)定义,可以在字符串中使用${}语法插入变量。解构赋值是一种新的变量赋值语法,可以从数组或对象中提取值,赋给变量。解构赋值可以使代码更简洁、可读性更高。例如:
// 模板字符串
const name = 'Alice';
const age = 18;
const message = `My name is ${name}, and I'm ${age} years old.`;
console.log(message);
// My name is Alice, and I'm 18 years old.
// 解构赋值
const arr = [1, 2, 3];
const [a, b, c] = arr;
console.log(a, b, c); // 1 2 3
const obj = { name: 'Alice', age: 18 };
const { name, age } = obj;
console.log(name, age); // Alice 18
- 请简要介绍ES6的箭头函数和spread运算符。
ES6的箭头函数是一种新的函数定义语法,它可以更方便地定义函数和处理this指针。箭头函数使用箭头(=>)定义,可以省略function关键字和return关键字,只需要在箭头左侧定义参数,在箭头右侧定义函数体。箭头函数的this指针是固定的,不会受到调用方式的影响。Spread运算符可以将一个数组或对象展开成多个元素,可以用于函数调用、数组合并、对象合并等场景。例如:
// 箭头函数
const add = (a, b) => a + b;
console.log(add(1, 2)); // 3
const obj = {
name: 'Alice',
sayHello: function() {
setTimeout(() => {
console.log(`Hello, my name is ${this.name}.`);
}, 1000);
}
};
obj.sayHello(); // Hello, my name is Alice.
// Spread运算符
const arr1 = [1, 2, 3];
const arr2 = [4, 5, 6];
const arr3 = [...arr1, ...arr2];
console.log(arr3); // [1, 2, 3, 4, 5, 6]
const obj1 = { name: 'Alice' };
const obj2 = { age: 18 };
const obj3 = { ...obj1, ...obj2 };
console.log(obj3); // { name: 'Alice', age: 18 }
- 请简要介绍ES6的async/await语法和Promise链式调用。
ES6的async/await语法是一种新的异步编程语法,它可以更方便地处理异步操作,使得代码更易读、易维护。async函数是一种特殊的函数,可以返回一个Promise对象,可以在函数内部使用await关键字等待异步操作完成。Promise链式调用是一种常用的异步编程方式,可以将多个异步操作串联起来,形成一条链式调用。Promise对象的then方法可以返回一个新的Promise对象,可以在then方法中继续执行异步操作。例如:
// async/await语法
function delay(time) {
return new Promise(resolve => setTimeout(resolve, time));
}
async function foo() {
console.log('start');
await delay(1000);
console.log('after 1s');
await delay(2000);
console.log('after 2s');
}
foo();
// Promise链式调用
fetch('https://api.example.com/data')
.then(response => response.json())
.then(data => {
console.log(data);
return fetch(`https://api.example.com/data/${data.id}`);
})
.then(response => response.json())
.then(detail => console.log(detail))
.catch(error => console.error(error));
- 请简要介绍ES6的Class语法和继承机制。
ES6的Class语法是一种新的面向对象编程语法,它可以更方便地定义类和实现继承。Class是一种特殊的函数,可以使用class关键字定义类,可以使用constructor方法定义类的构造函数,可以使用extends关键字实现继承。子类可以使用super关键字调用父类的构造函数和方法。Class语法可以使得面向对象编程更简单、更易读、易维护。例如:
// Class语法和继承机制
class Animal {
constructor(name) {
this.name = name;
}
sayHello() {
console.log(`Hello, I'm ${this.name}.`);
}
}
class Cat extends Animal {
constructor(name, color) {
super(name);
this.color = color;
}
sayHello() {
super.sayHello();
console.log(`My color is ${this.color}.`);
}
}
const cat = new Cat('Kitty', 'white');
cat.sayHello(); // Hello, I'm Kitty. My color is white.
- 请简要介绍ES6的Generator函数和迭代器。
ES6的Generator函数是一种新的函数定义语法,它可以更方便地定义可暂停和可恢复的函数,可以用于实现异步编程、数据流处理等功能。Generator函数使用function*关键字定义,可以使用yield关键字暂停函数的执行,并返回一个生成器对象。生成器对象可以使用next方法恢复函数的执行,并返回下一个yield表达式的值。迭代器是一种新的数据结构,可以用于实现自定义的迭代器,使得对象可以使用for...of循环进行迭代。迭代器必须实现一个next方法,返回一个包含value和done属性的对象。例如:
// Generator函数和迭代器
function* foo() {
yield 1;
yield 2;
yield 3;
}
const gen = foo();
console.log(gen.next()); // { value: 1, done: false }
console.log(gen.next()); // { value: 2, done: false }
console.log(gen.next()); // { value: 3, done: false }
console.log(gen.next()); // { value: undefined, done: true }
const obj = {
data:[1, 2, 3],
[Symbol.iterator]: function*() {
for (let i = 0; i < this.data.length; i++) {
yield this.data[i];
}
}
};
for (let item of obj) {
console.log(item);
}
// 1
// 2
// 3
- 请简要介绍ES6的模块化加载器SystemJS和打包工具Webpack。
ES6的模块化加载器SystemJS是一种新的模块加载器,支持动态加载模块和异步加载模块,可以在浏览器和Node.js环境下使用。SystemJS可以自动识别和加载ES6模块、CommonJS模块、AMD模块等格式的模块,可以通过配置文件和插件进行定制。Webpack是一种新的前端打包工具,可以将多个源文件打包成一个或多个输出文件,支持多种模块格式和多种输出格式。Webpack可以自动解析和处理ES6模块、CommonJS模块、AMD模块等格式的模块,可以进行代码压缩、文件合并、文件优化等操作。Webpack有丰富的插件和Loader,可以定制化地处理各种前端开发问题,例如处理CSS、图片、字体等资源,处理TypeScript、React等框架。例如:
// SystemJS使用示例
import { foo } from './module.js';
System.import('./module.js').then(module => {
console.log(module.foo());
});
// Webpack使用示例
// webpack.config.js
module.exports = {
entry: './src/index.js',
output: {
filename: 'bundle.js',
path: __dirname + '/dist'
}
};
// src/index.js
import { foo } from './module.js';
console.log(foo());
// src/module.js
export function foo() {
return 'foo';
}
// 终端命令
webpack --config webpack.config.js