15 个 JavaScript 简写神技,提效 60%!
·
JavaScript 是一门强大且灵活的语言,拥有丰富的特性和语法糖。掌握一些常见的简写技巧,不仅能让代码更加简洁优雅,还能显著提升开发效率(顺便多点摸鱼时间 😆)。下面分享 16 个最常用的 JavaScript 简写技巧,一起看看吧!
1. 三元运算符简化条件判断
// 传统写法
let result;
if (someCondition) {
result = 'yes';
} else {
result = 'no';
}
// 简写方式
const result = someCondition ? 'yes' : 'no';
2. 空值合并运算符
// 传统写法
const username = user && user.name ? user.name : 'Guest';
// 简写方式
const username = user?.name ?? 'Guest';
3. 可选链操作符
// 传统写法
const street = user && user.address && user.address.street;
// 简写方式
const street = user?.address?.street;
4. 数组去重
// 传统写法
const unique = arr.filter((item, index) => arr.indexOf(item) === index);
// 简写方式
const unique = [...new Set(arr)];
5. 快速取整
// 传统写法
const floor = Math.floor(4.9);
// 简写方式
const floor = ~~4.9;
6. 合并对象
// 传统写法
const obj = Object.assign({}, obj1, obj2);
// 简写方式
const obj = { ...obj1, ...obj2 };
7. 短路求值
// 传统写法
if (condition) {
doSomething();
}
// 简写方式
condition && doSomething();
8. 默认参数值
// 传统写法
function greet(name) {
name = name || 'Guest';
console.log(`Hello ${name}`);
}
// 简写方式
const greet = (name = 'Guest') => console.log(`Hello ${name}`);
9. 解构赋值
// 传统写法
const first = arr[0];
const second = arr[1];
// 简写方式
const [first, second] = arr;
10. 字符串转数字
// 传统写法
const num = parseInt('123');
// 简写方式
const num = +'123';
11. 多重条件判断
// 传统写法
if (value === 1 || value === 2 || value === 3) {
// ...
}
// 简写方式
if ([1, 2, 3].includes(value)) {
// ...
}
12. 快速幂运算
// 传统写法
Math.pow(2, 3);
// 简写方式
2 ** 3;
13. 对象属性简写
// 传统写法
const obj = { x: x, y: y };
// 简写方式
const obj = { x, y };
14. 数组映射
// 传统写法
const numbers = [1, 2, 3];
const doubled = numbers.map(function(num) {
return num * 2;
});
// 简写方式
const doubled = numbers.map(num => num * 2);
15. 交换变量值
// 传统写法
let temp = a;
a = b;
b = temp;
// 简写方式
[a, b] = [b, a];
总结
- 这些技巧并不是“炫技”,而是让代码更简洁、逻辑更清晰。
- 熟练掌握后,你会发现很多冗余的 if、循环、判断都能轻松省略。
- 写得少 ≠ 偷懒,写得少往往代表写得更优雅。
学会这些简写神技,开发效率提升 60% 不是梦 🚀。
你平时写代码时最常用的是哪几个简写技巧?欢迎在评论区分享! 👇
更多推荐

所有评论(0)