可读性：★★★★✰ 理解难度：★★★✰✰
概述
前面讨论了很多关于代码语句以及函数的相关内容，但是，除非我们将注意力放到代码组织的更高层面，否则始终不能得到整洁的代码。
对于前端来说，class是es6 新增的语法，是基于原型机制的语法糖。class是为面向对象编程而生。所以它拥有OOP的特点：抽象封装、继承、多态。
一、类的组织
自上而下的顺序，如下：
静态变量
静态方法
构造函数
原型方法
class Person {
static VAR1 = 'xxx'
static staticMethod() {
console.log(this.VAR1)
}
constructor(name, age) {
this.name = name;
this.age = age;
}
getName() {
return this.name;
}
}
上面代码转化成es5代码：
function Person(name, age) {
this.name = name;
this.age = age;
}
Person.prototype.getName = function() {
return this.name;
}
// 静态属性
Person.VAR1 = 'xxx'
// 静态方法
Person.staticMethod = function() { console.log(this.VAR1) }
继承
class Child extends Person {
constructor(name, age, toy) {
// 调用父类的constructor(name, age)
super(name, age);
this.toy = toy;
}
playGame() {
console.log(super.getName() + ' like ' + this.toy)
}
}
子类可以通过继承的方式，拥有父类的属性和方法，同时也可以在父类的基础上拓展自己的属性和方法。
super
super是在子类中使用的关键字，它可以作为对象和方法使用。
二、类应该短小
类不应该拥有过多的权责。
我们应该能用大概25个单词来描述一个类，且不用if、and、or、but等词汇。
2.1 单一权责原则
每个达到一定规模的系统都包括大量逻辑和复杂性。问题是：你是想把工具归置到有许多抽屉，且每个抽屉中装有定义和标记良好的组件工具箱中，还是想要放到少数几个能随便把所有东西扔进去的抽屉中。
2.2 内聚
如果一个类中的每个变量都被每个方法所使用，则该类具有最大的内聚性。当然这是个极限情况。内聚性高，意味着类中的方法和变量互相依赖、互相结合成一个逻辑整体。
2.3 拆分成短小的类
冗长的类的极限情况就好比，前端编译过后的代码，完全没有可读性。
而拆分过后的类，将比原有代码更长，但比原来拥有更强的可读性，那是因为：
- 重构后的程序采用了更长、更有描述性的变量名
- 重构后的程序将函数和类声明当做是给代码添加注释的一种手段
- 我们采用了空格和格式技巧让程序更可读。
三、开闭原则
只要是面向对象编程，在开发时都会强调开闭原则。开闭原则是最基础的设计原则，其它的五个设计原则都是开闭原则的具体形态。简单来说就是：对扩展开放，对修改关闭。
详细描述可以参考这篇文章：六大设计原则之开闭原则
四、总结
复杂系统的构筑离不开抽象的概念，抽象概念的体现又与面向对象的编程思想密切相关，那么类就是一个个抽象对象的具体形态。所以设计得完善的类，能让整个系统有序清晰。
本文参考《代码整洁之道》（Robert C. Martin著，韩磊译）。
浙江大华技术股份有限公司-软研-智慧城市产品研发部招聘高级前端，欢迎来撩，有意向可发送简历到chen_zhen@dahuatech.com，长期有效
上一篇：九、单元测试
下一篇：十一、系统
