命名规范

from https://github.com/AlloyTeam/CodeGuide

项目命名

  • 全部采用小写方式, 以中划线分隔
    示例:my-project-name

目录命名

  • 参照项目命名规则
  • 有复数结构时,要采用复数命名法。
    示例:scripts, styles, images, data-models

JS 文件命名

  • 参照项目命名规则。

示例:account-model.ts
示例:scan-file.component.ts

CSS, SCSS 文件命名

  • 参照项目命名规则。
    示例:retina-sprites.scss

HTML 文件命名

  • 参照项目命名规则。
    示例:error-report.html

JS 命名规范

  • js命名应遵循 简洁、语义化 的原则

angular 项目命名规范

文件命名规范

  • 文件名采用feature.type.**,feature表示特性,type表示类型
  • 模块用 .module.ts
  • 路由模块用 -routing.module.ts【*目前模块中既有.routing也有-routing】
  • 组件用 .component.ts|html|css
  • 服务用 .service.ts
  • 管道用 .pipe.ts
  • 指令用 .directive.ts
  • 类型用 .model.ts
  • 数据用 .data.ts
  • 用"-"来分割单词,比如hero-list.component.ts
  • 单元测试文件名保持和测试对象一致,并以.spec.ts结尾
  • 端到端测试文件名保持和测试对象一致,并以.e2e-spec.ts结尾

命名规范

  • 模块:比如app.module.ts定义的类名为AppModule

  • 路由模块:比如app-routing.module.ts定义的类名为AppRoutingModule

  • 组件:比如hero-list.component.ts定义的类名为HeroListComponent

  • 服务:比如logger.service.ts定义的类名为LoggerService

  • 管道:比如address.pipe.ts定义的类名为AddressPipe

  • 指令:比如highlight.directive.ts定义的类名为HighlightDirective

  • 类型:按模块来划分,一个.model.ts定义多个类型【*有疑义,我们的模块比较大,model会很多】

  • 数据:比如address-book.data.ts定义的变量名为addressBook

  • 脚本启动入口的文件名规定为main.ts,里面不包括任何业务逻辑,但要记得处理失败的情况
    // main.ts
    import { platformBrowserDynamic } from '@angular/platform-browser-dynamic';

      import { AppModule }              from './app/app.module';
    
      platformBrowserDynamic().bootstrapModule(AppModule)
        .then(success => console.log(`Bootstrap success`))
        .catch(err => console.error(err));
    
  • 指令选择器的命名采用小写驼峰规则,比如clickOutSide

  • 组件选择器的命名采用分隔符“-”连接小写字母的形式,比如hero-list

变量

  • 命名方法: 小驼峰式命名法
  • 命名规范:前缀为形容词 (函数前缀为动词, 以此来区分函数和变量)
  • 支持ES6的环境下,禁止使用var定义变量
  • 变量命名要求见名知意,控制在5个单词以内,有常见缩写形式的单词可采用缩写形式
// 好的命名方式
let maxCount = 10;
let tableTitle = 'tableTitle';

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

常量

  • 定义用const
  • 全部大写,如果有多个单词,用“_”连接
const MAX_COUNT = 10;
const URL = '//www.huifenqi.com';

函数 & 方法

  • 命名方法: 小驼峰式命名法
  • 命名规范: 前缀应该为动词
  • 命名建议: 常用动词约定
// 是否可阅读
function canRead() {}
// 获取名称
function getName() {}
// 事件回调
function onSelectChange() {}

类 & 接口

  • 命名方法:大写驼峰式命名法,首字母大写
  • 命名规范:前缀为名称
class Persion {
  constructor(name) {
   ...
  }
}

let person = new Person('TOM');

类的成员

  • 类的成员包括:
    公共属性和方法:跟变量和函数命名一样。
    私有属性和方法:用小写驼峰
    ts中,私有属性和方法,用private修饰符,不建议以“”为前缀
    ts中,公共属性和方法,不需要写修饰符,默认是public
    ts中,拦截属性可以使用下划线“
class Person {
  // 私有属性 
  private name: string;
  private _hobby: string;
  constructor() { }

  set hobby(hobby) {
    this._hobby = hobby;
    this.doSomething();
  }
  // 公共方法
  getName() {
    return this._name;
  }
  // 公共方法
  setName(name) {
    this._name = name;
  }
}

示例

前缀 含义 类型
can 判断是否可执行某个动作 方法
get 获取某个值 方法
set 设置某个值 方法
load 加载某些数据 方法
has 判断是否含义某个值 boolean型变量
is 判断是否为某个值 boolean型变量
nsOn Output输出属性 EventEmitter

你可能感兴趣的:(命名规范)