个人代码规范

开发工具

命名规范

变量

• 方法:

小驼峰式命名法

• 规范:

前缀为形容词 （函数前缀为动词, 以此来区分函数和变量）

• 示例:

// 好的命名方式
let maxCount = 10;
let tableTitle = '啦啦啦';
// 不好的命名方式
let setConut = 10;
let getTitle = '啦啦啦';

常量

使用const声明,使用大写字母和下划线来组合命名，下划线用来分割单词。

const MAX_COUNT = 10;
const URL = '//www.baidu.com';

函数

• 方法:

小驼峰式命名法

• 规范:

前缀应该为动词

• 约定: | 动词 | 含义 | | :—- | :—- | | can | 判断是否可执行某个动作 | | has | 判断是否含义某个值 | | is | 判断是否为某个值 | | get | 获取某个值 | | set | 设置某个值 | | load | 加载某些数据 |

• 示例

// 是否可阅读
function canRead() {}
// 获取名称
function getName() {}

类

• 方法:

大写驼峰式命名法，首字母大写。

• 规范:

前缀为名称。

• 示例:

  class Persion {
  constructor(name) {
   ...
  }
}
let person = new Person('啦啦啦');

类成员

文件夹

• src/components下
• 方法: 采用大驼峰
• 规范: 区别共同组件和局部组件
• 示例:

   - [components]
    - [Breadcrumb]
      - index.vue
    - [Hamburger]
      - index.vue
    - [SvgIcon]
      - index.vue

• src/views下
• 方法: 一级目录下文件夹使用小写,components目录下文件夹使用大驼峰
• 示例:

  -[src]
  - [views]
    - [layout]
      - [components]
        - [Sidebar]
          - index.vue
          - Item.vue
          - SidebarItem.vue
        - AppMain.vue
        - index.js
        - Navbar.vue

文件

• views/pages根目录下文件大驼峰
• components 问价下文件大驼峰
• views/pages 目录下文件夹中的文件小驼峰

  注释

项目

使用技术

• vue
• webpack
• ES6
• typescript
• uni-app
• node

• react

  项目目录

• vue+ts目录

• vue目录
• React+uni目录
• React目录

代码规范

• 使用eslint
• 使用prettier
• 使用typescript