作为编程新手，是不是总觉得自己写的代码“又长又丑”？ 明明实现的是简单功能，却堆了一堆冗余代码，不仅看起来乱糟糟，还容易藏 bug，回头自己看都想吐槽“这谁写的？”
今天分享 3 个超基础的 JS 代码优化技巧，不用复杂语法，新手也能秒上手，一行代码替代 N 行冗余逻辑，让你的代码瞬间变“清爽”！
技巧 1：用 三元运算符 替代 if-else，一行搞定简单判断
新手写判断时，总爱用 if-else 裹着，哪怕只是简单的“二选一”，也写得层层嵌套，像“叠被子”一样臃肿。
三元运算符直接“条件 + 结果1 + 结果2”，一行搞定，简洁又直观！
❌ 新手写法（臃肿冗余）：
// 判断成绩是否及格
let score = 85;
let result;
if (score >= 60) {
result = "及格";
} else {
result = "不及格";
}
console.log(result); // 输出：及格
✅ 优化写法（简洁优雅）：
// 三元运算符：条件 ? 结果1 : 结果2
let score = 85;
let result = score >= 60 ? "及格" : "不及格";
console.log(result); // 输出：及格
进阶用法（嵌套三元）：
如果需要多条件判断，也可以嵌套三元（但别嵌套太多，最多两层哦）：
// 判断成绩等级：优秀/良好/及格/不及格
let score = 85;
let grade = score >= 90 ? "优秀" :
score >= 80 ? "良好" :
score >= 60 ? "及格" : "不及格";
console.log(grade); // 输出：良好
技巧 2：用 解构赋值 提取对象/数组，告别“层层点”
从对象或数组里拿数据时，新手总爱一个个“点”出来，比如 obj.name 、 arr[0] ，如果属性多了，代码就像“一串糖葫芦”，又长又难读。
解构赋值直接“批量提取”，一行代码拿到所有需要的数据！
❌ 新手写法（繁琐重复）：
// 从用户对象中提取信息
const user = { name: "小李", age: 25, job: "前端" };
const name = user.name;
const age = user.age;
const job = user.job;
console.log(name, age, job); // 输出：小李 25 前端
// 从数组中提取数据
const fruits = ["苹果", "香蕉", "橙子"];
const first = fruits[0];
const second = fruits[1];
console.log(first, second); // 输出：苹果 香蕉
✅ 优化写法（简洁高效）：
// 解构对象：用 { } 提取属性
const user = { name: "小李", age: 25, job: "前端" };
const { name, age, job } = user;
console.log(name, age, job); // 输出：小李 25 前端
// 解构数组：用 [ ] 提取元素
const fruits = ["苹果", "香蕉", "橙子"];
const [first, second] = fruits;
console.log(first, second); // 输出：苹果 香蕉
拓展用法（设置默认值）：
如果对象里可能没有某个属性，可以直接设置默认值，避免拿到 undefined ：
const user = { name: "小李", age: 25 };
// job 属性不存在时，默认值为“无业”
const { name, age, job = "无业" } = user;
console.log(job); // 输出：无业
技巧 3：用 箭头函数 简化函数写法，告别“function”冗余
写函数时，新手总爱用 function 关键字，还要写 return ，代码又长又占地方。
箭头函数直接 (参数) => 结果 ，一行搞定简单函数，还能自动绑定 this ！
❌ 新手写法（冗长繁琐）：
// 普通函数：计算两个数的和
function add(a, b) {
return a + b;
}
console.log(add(10, 20)); // 输出：30
// 普通函数：遍历数组
const numbers = [1, 2, 3, 4];
numbers.forEach(function(num) {
console.log(num * 2);
});
✅ 优化写法（简洁清爽）：
// 箭头函数：参数 => 结果（单行自动 return）
const add = (a, b) => a + b;
console.log(add(10, 20)); // 输出：30
// 箭头函数：遍历数组（更简洁）
const numbers = [1, 2, 3, 4];
numbers.forEach(num => console.log(num * 2));
// 输出：2 4 6 8
注意事项：
如果函数体不止一行，需要用 { } 包裹，并且手动写 return ：
const calculate = (a, b) => {
const sum = a + b;
const product = a * b;
return [sum, product]; // 返回数组
};
console.log(calculate(2, 3)); // 输出：[5, 6]
最后总结：3 个优化技巧一句话记住
1. 简单判断用 三元运算符（替代 if-else，一行搞定）
2. 提取数据用 解构赋值（告别层层点，批量提取）
3. 简单函数用 箭头函数（替代 function，代码瘦身）
