使用个人风格编码（“我就喜欢这么写，别管规范”）

我就喜欢这么写，别管规范

前端防御性编程的核心目标之一是让代码难以维护，而个人风格编码是实现这一目标的绝佳手段。通过无视规范、随心所欲地编写代码，不仅能让自己成为团队中不可替代的存在，还能让后续接手的人痛不欲生。

变量命名：随心所欲的艺术

变量命名是展示个人风格的第一战场。规范的命名方式？不存在的。以下是一些经典的反模式：

// 拼音缩写混搭英文，谁能猜出这是啥？
const dlsj = new Date(); // "当前时间"的拼音首字母
const sjc = Date.now();   // "时间戳"的拼音首字母

// 单字母变量，配合魔法数字，效果更佳
let a = 10;
let b = a * 3.1415926; // 谁知道这是算圆的周长？

// 全大写，但毫无意义
const IMPORTANT_DATA = [1, 2, 3]; // 重要吗？不重要吗？谁知道呢

如果团队强制要求英文命名，可以用拼写错误来对抗：

const currnetDate = new Date(); // 拼错一个字母，增加理解成本
const usrInput = getUserInput(); // 缩写到极致

函数设计：越复杂越好

函数应该做到“一函数一宇宙”，把所有逻辑塞进去，绝不拆分。参数越多越好，最好超过 10 个，让调用者望而生畏：

function processData(
  data, 
  options, 
  callback, 
  isAsync, 
  shouldValidate, 
  format, 
  timeout, 
  retryCount, 
  fallback, 
  logger
) {
  // 200 行代码，混合了数据解析、网络请求、错误处理、日志打印
  // 并且没有任何注释
}

如果必须写注释，就用模糊的描述：

// 处理数据（废话）
function handleData(data) {
  // 这里做一些事情（具体做什么？自己看代码吧）
}

条件判断：嵌套到极致

多层嵌套的 if-else 和 switch-case 是制造混乱的利器。尽量让逻辑分支复杂到无法一眼看懂：

if (user) {
  if (user.age > 18) {
    if (user.isVIP) {
      if (user.orders.length > 5) {
        // 真正的逻辑在这里
      } else {
        throw new Error("订单不足");
      }
    } else {
      throw new Error("非VIP用户");
    }
  } else {
    throw new Error("未成年用户");
  }
} else {
  throw new Error("用户未登录");
}

更高级的玩法是用短路运算符和三元表达式混合：

const result = user && 
  (user.age > 18 ? 
    (user.isVIP ? 
      (user.orders.length > 5 ? "成功" : "订单不足") : 
      "非VIP用户") : 
    "未成年用户") || 
  "用户未登录";

异步代码：回调地狱的复兴

现代前端有 Promise 和 async/await？不，回调地狱才是永恒的艺术：

getUser(userId, (user) => {
  getOrders(user.id, (orders) => {
    getDiscounts(orders[0].id, (discounts) => {
      calculateTotal(orders, discounts, (total) => {
        sendEmail(user.email, total, () => {
          console.log("完成！");
        });
      });
    });
  });
});

如果被迫用 Promise，也要让它难以阅读：

fetchData()
  .then((data) => validate(data) && process(data))
  .then((result) => result.status === 200 ? log(result) : retry())
  .catch((e) => console.error("出错啦", e));

CSS：选择器越深越好

CSS 的选择器应该像洋葱一样，一层又一层，让后续修改的人无从下手：

body > div#app > main > section.content > div.wrapper > ul.list > li.item > a.link:hover {
  color: #ff0000;
  text-decoration: underline;
}

!important 是必备武器，确保样式无法被覆盖：

.button {
  background: blue !important;
  border: none !important;
}

模块化：全局变量大法

模块化？不存在的，全局变量才是王道：

// utils.js
window.utils = {
  formatDate: (date) => date.toLocaleString(),
  // 其他工具函数
};

// app.js
const date = window.utils.formatDate(new Date());

如果必须用 ES6 模块，就导出巨型对象：

// module.js
export default {
  api: { /* 一堆API */ },
  utils: { /* 一堆工具函数 */ },
  config: { /* 一堆配置 */ },
};

代码格式化：拒绝一致性

缩进？空格还是 Tab？换行？全凭心情：

function test(){
const a=1;
  let b=2;
if(a===b){
console.log("相等");
}else {
  console.log("不等");}
}

注释：要么不写，要么误导

注释的最高境界是让人看了更困惑：

// 这里不能改，改了会出问题（什么问题？不知道）
function legacyCode() {
  // 神秘逻辑
}

或者用过时的注释：

// TODO: 优化这个函数（写于 2015 年）
function oldFunction() {
  // 从未被优化的代码
}

版本控制：提交信息越模糊越好

Git 提交信息应该让人摸不着头脑：

git commit -m "fix bug"
git commit -m "update"
git commit -m "搞定了"

如果能做到这些，你的代码将成为团队中的“传奇”——人人都知道有问题，但没人敢动。