使用箭头函数
传统函数
js
复制代码
function add(a, b) { return a + b;}
箭头函数
js
复制代码
const add = (a, b) => a + b;
对象属性简写
传统写法
js
复制代码
const name = 'John';
const person = { name: name};
简洁写法
js
复制代码
const name = 'John';
const person = { name };
解构赋值
从对象中提取值
js
复制代码
const person = { name: 'Alice', age: 30 };
const { name, age } = person;
console.log(name, age);
从数组中提取值
js
复制代码
const arr = [1, 2, 3];
const [first, second, third] = arr;
console.log(first, second, third);
模板字符串
传统字符串拼接
js
复制代码
const name = 'Bob';
const message = 'Hello, ' + name + '!';
模板字符串
js
复制代码
const name = 'Bob';
const message = `Hello, ${name}!`;
可选链操作符（?.）
在访问可能为 null 或 undefined 的对象属性时，避免出现错误
传统方式
js
复制代码
const person = { address: { city: 'New York' } };
const city = person && person.address && person.address.city;
使用可选链：
js
复制代码
const city = person?.address?.city;
空值合并操作符（??）
当左侧的值为 null 或 undefined 时，返回右侧的值
传统方式
js
复制代码
const value = null;
const result = value!== null && value!== undefined? value : 'default';
使用空值合并操作符
js
复制代码
const result = value?? 'default';
使用扩展运算符（...）
数组复制 传统方式
js
复制代码
const arr1 = [1, 2, 3];
const arr2 = arr1.slice();
简洁方式
js
复制代码
const arr1 = [1, 2, 3];
const arr2 = [...arr1];
函数参数合并
函数参数合并：传统方式
js
复制代码
function combineArrays(arr1, arr2) {
return arr1.concat(arr2);
}
简洁方式
js
复制代码
function combineArrays(...arrays) {
return [].concat(...arrays);
}
利用隐式返回（在箭头函数中）
当箭头函数的主体只有一个表达式时，可以省略 return 关键字和大括号。
js
复制代码
const double = num => num * 2;
使用对象方法简写
传统方式
js
复制代码
const person = {
name: 'Alice',
sayHello: function() {
return `Hello, I'm ${this.name}!`;
}
};
简洁方式
js
复制代码
const person = {
name: 'Alice',
sayHello() {
return `Hello, I'm ${this.name}!`;
}
};
利用数组方法简化循环
forEach 替代传统的 for 循环
传统方式
js
复制代码
const arr = [1, 2, 3];
for (let i = 0; i < arr.length; i++) {
console.log(arr[i]);
}
简洁方式
js
复制代码
const arr = [1, 2, 3];
arr.forEach(item => console.log(item));
map 创建新数组
传统方式
js
复制代码
const numbers = [1, 2, 3];
const doubledNumbers = [];
for (let i = 0; i < numbers.length; i++) {
doubledNumbers.push(numbers[i] * 2);
}
简洁方式
js
复制代码
const numbers = [1, 2, 3];
const doubledNumbers = numbers.map(num => num * 2);
利用逻辑运算符的短路特性
传统方式
js
复制代码
let value;
if (condition) {
value = defaultValue;
} else {
value = someOtherValue;
}
简洁方式
js
复制代码
const value = condition? defaultValue : someOtherValue;
// 或者
const value = condition && defaultValue || someOtherValue;