继承与组合都是面向对象中代码复用的方式，了解各自有什么特点，可以让我们写出更简洁的代码，设计出更好的代码架构。
> 这是一篇翻译文章，作者是[serhiirubets](https://hackernoon.com/u/serhiirubets)
“我应该怎么使用继承和组合”这是一个常见的问题，不仅是JavaScript相关，但是本篇我们只讨论JavaScript相关的内容和示例。
如果你不知道什么是*组合*或*继承*，我强烈推荐你去查看相关内容，因为本文的主要讲的就是怎么使用和如何选择它们，但是为了确定我们在一个频道，让我们先了解一下组合和继承吧。
**继承**是面向对象编程核心概念之一，可以帮助我们避免代码重复。主要的思想是我们可以创建一个包含逻辑的基类，可以被子类重用。我们来看个示例：
```
class Element {
remove() {}
setStyles() {}
}
class Form extends Element {}
class Button extends Element {}
```
我们创建了一个基类“Element”，子类会继承Element中的通用逻辑。
继承存在**is-a**关系：`Form`是一个`Element`, `Button`也是一个`Element`。
**组合**：和继承不同，组合使用的是**has-a**关系，将不同的关系收集到一起。
```
class Car {
constructor(engine, transmission) {
this.engine = engine;
this.transmission = transmission;
}
}
class Engine {
constructor(type) {
this.type = type;
}
}
class Transmission {
constructor(type) {
this.type = type;
}
}
const petrolEngine = new Engine('petrol');
const automaticTransmission = new Engine('automatic');
const passengerCar = new Car(petrolEngine, automaticTransmission) ;
```
我们创建了使用`Engine`和`Transmission`创建了`Car`，我们不能说`Engine`是一个`Car`，但是可以说`Car`包含`Engine`。希望上面的例子可以帮助你理解什么是*继承*，什么是*组合*。
我们再来看两个不同的示例，对比一下使用类的方法实现和函数方法实现有什么区别。
假设我们正在使用文件系统，想实现读取、写入和删除的功能。我们可以创建一个类：
```
class FileService {
constructor(filename) {
this.filename = filename;
}
read() {}
write() {}
remove() {}
}
```
目前可以满足我们想要的功能，之后我们可能想加入权限控制，一些用户只有读取权限，其他人可能有写入权限。我们应该怎么办？一个解决方案是我们可以把方法划分为不同的类:
```
class FileService {
constructor(filename) {
this.filename = filename;
}
}
class FileReader extends FileService {
read() {}
}
class FileWriter extends FileService {
write() {}
}
class FileRemover extends FileService {
remove() {}
}
```
现在每个用户可以使用其需要的权限，但是还有一个问题，如果我们需要给一些人同时分配读取和写入权限，应该怎么办？同时分配读取和删除权限怎么办？使用当前的实现，我们做不到，应该怎么解决?
第一个想到的方案可能是：为读取和写入创建一个类，为读取和删除创建一个类。
```
class FileReaderAndWriter extends FileService {
read() {}
write() {}
}
class FileReaderAndRemover extends FileService {
read() {}
remove() {}
}
```
按照这种做法，我们可能还需要以下类: FileReader, FileWriter, FileRemove, FileReaderAndWriter, FileReaderAndRemover。
这不是一个好的实现方式：第一，我们可能不仅有3种，而是10、20种方法，还需要在他们之间有大量的组合。第二是我们的类中存在重复的逻辑，FileReader类包含读取方法，FileReaderAndWriter也包含同样的代码。
这不是一个很好的解决方案，还有其他的实现方法吗？多重继承？JavaScript中没有这个特性，而且也不是很好的方案：A类继承了B类，B类可能继承了其他类...，这样的设计会非常混乱，不是一个良好的代码架构。
怎么解决呢？一个合理的方法是使用**组合**：我们把方法拆分为单独的函数工厂。
```
function createReader() {
return {
read() {
console.log(this.filename)
}
}
}
function createWriter() {
return {
write() {
console.log(this.filename)
}
}
}
```
上面的示例中，我们有两个函数创建了可以读取和写入的对象。现在就可以在任何我们地方使用它们，也可以将它们进行组合：
```
class FileService {
constructor(filename) {
this.filename = filename ;
}
}
function createReadFileService (filename ) {
const file = new FileService(filename);
return {
...file,
...createReader()
}
}
function createWriteFileService (filename) {
const file = new FileService(filename);
return {
...file,
...createWriter(),
}
}
```
上面的例子中，我们创建了读取和写入服务，如果我们想组合不同的权限：读取、写入和删除，我们可以很容易的做到：
```
function createReadAndWriteFileService (filename) {
const file = new FileService(filename);
}
return {
...file,
...createReader(),
...createWriter()
}
const fileForReadAndWriter = createReadAndWriteFileService('test');
fileForReadAndWriter.read();
fileForReadAndWriter.write();
```
如果我们有5、10、20种方法，我们可以按照我们想要的方式进行组合，不会有重复的代码问题，也没有令人困惑的代码架构。
我们再来看一个使用函数的例子，假设我们有很多员工，有出租车司机、健身教练和司机：
```
function createDriver(name) {
return {
name,
canDrive: true,
}
}
function createManager(name) {
return {
name,
canManage: true
}
}
function createSportCoach(name) {
return {
name,
canSport: true
}
}
```
看起来没有问题，但是假设有一些员工白天当健身教练，晚上去跑出租，我们应该怎么调整呢？
```
function createDriverAndSportCoach(name) {
return {
name,
canSport: true,
canDriver: true
}
}
```
可以实现，但是和第一个例子一样，如果我们有多种类型混合，就会产生大量重复的代码。我们可以通过**组合**来进行重构：
```
function createEmployee(name,age) {
return {
name,
age
}
}
function createDriver() {
return {
canDrive: true
}
}
function createManager() {
return {
canManage: true
}
}
function createSportCoach() {
return {
canSport: true
}
}
```
现在我们可以根据需要组合所有工作类型，没有重复代码，也更容易理解：
```
const driver = {
...createEmployee('Alex', 20),
...createDriver()
}
const manager = {
...createEmployee('Max', 25),
...createManager()
}
const sportCoach = {
...createEmployee('Bob', 23),
...createSportCoach()
}
const sportCoachAndDriver = {
...createEmployee('Robert', 27) ,
...createDriver(),
...createSportCoach()
}
```
希望你现在已经可以理解*继承*和*组合*之间的区别，一般来说，*继承*可以用于`is-a`关系，*组合*可以用于`has-a`。
但在实践中，继承有时候并不是一个好的解决方法：就像示例中，司机是员工(`is-a`关系)，经理也是员工，如果我们需要把不同的部分进行混合，组合确实比继承更合适。
最后我想强调的是：**继承**和**组合**都是很好实现，但是你应该正确的使用他们。一些场景组合可能更合适，反之亦然。
当然，我们可以将**继承**和**组合**结合在一起，比如我们有`is-a`关系，但想添加不同的值或方法：我们可以创建一些基类，为实例提供所有通用功能，然后使用组合来添加其他特定功能。
> 欢迎关注“混沌前端”公众号
