【Uniapp】代码规范三：代码格式规范

1. 缩进

• 使用两个空格进行缩进（或四个空格，具体根据团队约定）。

• 确保所有代码块（如函数、条件、循环）使用一致的缩进。

• 示例：

  function exampleFunction() {
    if (condition) {
      doSomething();
    }
  }
  

2. 空格

• 在运算符（如 +, -, =）前后使用空格，以提高可读性。

• 函数调用时，参数列表前不加空格。

• 在控制结构（如 if、for）的括号前后保持一致的空格。

• 示例：

  const result = a + b;
  exampleFunction(param1, param2);
  

3. 换行

• 每行的长度不超过 80 或 100 个字符，避免横向滚动。

• 在适当的地方使用换行来提高可读性，特别是在长表达式或复杂逻辑中。

• 示例：

  const longString = 'This is a very long string that needs to be wrapped for better readability.';
  ​
  if (a === b &&
      c === d) {
    doSomething();
  }
  

4. 条件与循环

• 使用简洁的语法结构，如三元表达式，避免过于复杂的嵌套。

• 在循环中使用v-for时，提供key属性，增强性能和可维护性。

• 避免在循环内部进行深度嵌套，保持逻辑清晰。

• 示例：

  items.forEach(item => {
    if (item.isActive) {
      activateItem(item);
    }
  });
  

5. 错误处理

• 使用 try...catch 语句进行错误处理，确保代码的健壮性。

• 针对可能出现的错误类型进行具体的处理，以便于调试。

• 示例：

  try {
    const data = fetchData();
  } catch (error) {
    console.error('Error fetching data:', error);
    // 进行必要的恢复操作
  }
  

6. 变量声明

• 使用const声明常量，使用let声明可变变量，避免使用var。

• 声明变量时，尽量将相关变量放在一起，并使用合适的命名。

• 示例：

  const userName = 'John';
  let userAge = 30;
  let userRole = 'admin';
  

7. 模块导入

• 使用 ES6 模块导入语法，将模块导入放在文件顶部，保持顺序（外部模块在前，内部模块在后）。

• 导入时确保路径相对清晰，避免过长。

• 示例：

  import { fetchUserData } from './api';
  import UserProfile from './components/UserProfile.vue';
  

8. 模板和样式

• 在Vue文件中，<template>、<script>、<style>标签之间留一行空行，以提高可读性。

• CSS样式遵循BEM命名规范，确保类名一致性。

• 在 Vue 组件中，模板部分应与逻辑部分分开，逻辑应尽量简洁。

• 示例：

  <template>
    <div class="user-profile">
      <h1>{{ user.name }}</h1>
    </div>
  </template>
  ​
  <script>
  export default {
    data() {
      return {
        user: {}
      };
    },
    methods: {
      fetchUser() {
        // fetch logic
      }
    }
  };
  </script>
  ​
  <style scoped>
  .user-profile {
    /* 样式定义 */
  }
  </style>
  

9. 工具使用

• 使用代码格式化工具（如 Prettier）来自动格式化代码，以保持一致性。
• 使用 Linter（如 ESLint）来检测代码中的潜在问题，并强制执行代码风格。
• 在项目中集成这些工具，以便在提交代码前自动检查。

10. 总结

遵循代码格式规范能够提高代码的可读性和可维护性，减少团队协作中的误解与混乱。团队应统一并推广这些规范，并通过自动化工具来确保代码的一致性和质量。定期进行代码审查，以确保规范的实施，并根据团队需求进行调整和优化。