1、简写的闭包自执行函数(Immediately Invoked Function Expression (IIFE))
使用括号将函数定义包裹起来,再在末尾加上另一对括号,即可创建一个自执行函数。例如:
(() => {
console.log("Hello,world!");
})();
2、简写的对象方法定义(Method Definition)
使用方法名和箭头函数的简写方式,可以更简洁地定义对象的方法。例如:
const obj = {
x: 1,add(y) {
return this.x + y;
},double: () => this.x * 2,};
console.log(obj.add(2)); // 3
console.log(obj.double()); // NaN
注意,箭头函数中的 this 指向的是定义时的上下文,而不是调用时的上下文。
3、简写的类定义(Class Definition)
使用 class 和 constructor 的简写方式,可以更简洁地定义类。例如:
class Person {
constructor(name,age) {
this.name = name;
this.age = age;
}
sayHello() {
console.log(
`Hello,my name is ${this.name},and I am ${this.age} years old.`
);
}
}
const alice = new Person("Alice",20);
alice.sayHello(); // 'Hello,my name is Alice,and I am 20 years old.'
4、简写的模块导出(Module Export)
使用 export 和 default 的简写方式,可以更简洁地导出模块。例如:
// math.js
export const add = (a,b) => a + b;
export const subtract = (a,b) => a - b;
export default {
multiply: (a,b) => a * b,divide: (a,b) => a / b,};
// main.js
import { add,subtract } from "./math.js";
import math from "./math.js";
console.log(add(1,2)); // 3
console.log(subtract(3,2)); // 1
console.log(math.multiply(2,3)); // 6
console.log(math.divide(6,2)); // 3
5、解构赋值(Destructuring Assignment)
使用花括号{}
或方括号[]
可以将对象或数组中的值解构(拆解)到变量中。例如:
const obj = { x: 1,y: 2 };
const { x,y } = obj;
console.log(x,y); // 1,2
const arr = [1,2,3];
const [a,b] = arr;
console.log(a,b); // 1,2
6、对象字面量简写
可以使用对象字面量的简写形式来定义对象,例如:
const name = "Alice";
const age = 30;
// 传统写法
const user = {
name: name,age: age,};
// 简写写法
const user = { name,age };
7、模板字符串简写
可以使用模板字符串的简写形式来拼接字符串,例如:
const name = "Alice";
const age = 30;
// 传统写法
const message = "My name is " + name + " and I am " + age + " years old.";
// 简写写法
const message = `My name is ${name} and I am ${age} years old.`;
8、省略对象方法的 function 关键字
在对象中定义方法时,可以省略 function 关键字,例如:
const obj = {
foo() {
// ...
},bar() {
// ...
},};
9、省略参数列表的圆括号
在只有一个参数的箭头函数中,可以省略参数列表的圆括号,例如:
const double = (x) => x * 2;
10、省略对象属性的引号
在对象字面量中定义属性时,可以省略属性名称的引号,前提是属性名称不包含空格和特殊字符,例如:
const obj1 = {
prop1: "value1",prop2: "value2",prop3: "value3",};
const obj2 = {
prop1: "value1","prop with spaces": "value2",["computedProp"]: "value3",};
11、省略布尔值的比较操作符
可以直接将布尔值作为条件,而不必使用比较操作符,例如:
// 传统写法
if (done === true) {
// ...
}
// 简写写法
if (done) {
// ...
}