命名规范

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

©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • 前言 说是前言,其实也是本文诞生的目的。随着公司业务的不断增加,功能的快速迭代,app的业务线越来越多,代码体积变...
    Yealink阅读 5,493评论 0 13
  • 1、引言 数据库设计过程中表、字段等的命名规范也算是设计规范的一部分,不过设计规范更多的是为了确保数据库设计的合理...
    SnowflakeCloud阅读 41,138评论 0 48
  • android文件众多,根据名称来辨别用途很重要,因此命名要规范 这篇文章可参考:Android 命名规范 (提高...
    Near尼尔阅读 486评论 0 2
  • 命名规范 1. 包命名 规则:包名全部小写,采用反域名命名规则,一级包名是顶级域名,通常为com, edu, go...
    聂顺阅读 900评论 0 2
  • 一、基本规则 1、代码清晰 又清晰又简洁的代码当然是最好的了,但简洁不如清晰重要。总的讲不要使用单词的简写,除了非...
    萧修阅读 2,579评论 0 1