扔掉if-else！JavaScript 这几个技巧让你代码简洁到飞起！

1. 短路求值 (Short-circuit Evaluation)

这是最常见，也是最实用的技巧之一。利用 && (逻辑与) 和 || (逻辑或) ,三目运算符的短路特性，我们可以简化一些简单的条件判断。

• && (逻辑与): 如果第一个操作数为 false，则直接返回第一个操作数，不再执行第二个操作数。
• || (逻辑或): 如果第一个操作数为 true，则直接返回第一个操作数，不再执行第二个操作数。

示例：

// 传统 if 语句
let isLogin = true;
if (isLogin) {
  console.log("欢迎登录！");
}

// 短路求值
isLogin && console.log("欢迎登录！");

// 传统 if/else 语句
let age = 18;
let message;
if (age >= 18) {
  message = "已成年";
} else {
  message = "未成年";
}
console.log(message);

// 短路求值
let message = age >= 18 ? "已成年" : "未成年";
console.log(message);

// 另一种用法，避免 undefined 错误
let user = { name: "张三" };
let userName = user && user.name; // 如果 user 存在，则取 user.name，否则为 undefined
console.log(userName); // 输出 "张三"

let user2 = null;
let userName2 = user2 && user2.name; // 如果 user2 存在，则取 user2.name，否则为 undefined
console.log(userName2); // 输出 null

优点： 代码更简洁，可读性更高。

缺点： 只适用于简单的条件判断，复杂的逻辑不建议使用。

2. 对象字面量 (Object Literal) / Map

当我们需要根据不同的条件执行不同的函数时，可以使用对象字面量或 Map 来实现。

示例：

// 传统 if/else 语句
let action = "add";
let result;
if (action === "add") {
  result = 1 + 1;
} else if (action === "subtract") {
  result = 1 - 1;
} else if (action === "multiply") {
  result = 1 * 1;
} else {
  result = 0;
}
console.log(result);

// 对象字面量
const actions = {
  add: () => 1 + 1,
  subtract: () => 1 - 1,
  multiply: () => 1 * 1,
  default: () => 0,
};

let result2 = (actions[action] || actions.default)();
console.log(result2);

// Map
const actionsMap = new Map([
  ["add", () => 1 + 1],
  ["subtract", () => 1 - 1],
  ["multiply", () => 1 * 1],
]);

let result3 = (actionsMap.get(action) || (() => 0))();
console.log(result3);

优点： 代码结构更清晰，易于维护和扩展。

缺点： 需要预先定义好所有的操作，不适用于动态生成操作的情况。

3. 函数式编程 (Functional Programming)

利用函数式编程的思想，我们可以将条件判断封装成函数，然后通过组合这些函数来实现复杂的逻辑。

示例：

// 定义判断函数
const isAdult = (age) => age >= 18;
const isStudent = (status) => status === "student";

// 定义处理函数
const handleAdult = () => console.log("欢迎进入成人世界！");
const handleStudent = () => console.log("享受你的学生时光！");
const handleOther = () => console.log("你好！");

// 组合函数
const processUser = (age, status) => {
  if (isAdult(age)) {
    handleAdult();
  } else if (isStudent(status)) {
    handleStudent();
  } else {
    handleOther();
  }
};

// 调用函数
processUser(20, "worker"); // 输出 "欢迎进入成人世界！"
processUser(16, "student"); // 输出 "享受你的学生时光！"
processUser(16, "worker"); // 输出 "你好！"

优点： 代码模块化程度更高，易于测试和复用。

缺点： 需要一定的函数式编程基础。

总结：

if 语句是 JavaScript 中最基础的语句之一，但我们可以通过一些技巧来优化代码，使其更简洁、更优雅、更具可读性。