一周一章前端书·第9周：《你不知道的JavaScript(上)》S02E04
第4章 ：混合对象“类”
本章要介绍和类相关的面相对象编程的知识。首先会介绍面相对象类的设计模式：实例化(instantiation)、继承(inheritance)、多态(polymorphism)。
但由于这些概念上无法直接对应到JavaScript的对象机制，因此很多JavaScript开发者使用了一些比如mixin等解决方法来实现。
4.1 类理论
类/继承，或者说面向对象，是用来描述代码的一种组织结构形式，它是一种软件对真实世界的建模方法。
面向对象编程强调的是数据和操作数据的行为，本质是是相互关联的。因此，面相对象编程推崇的是，把数据以及和它相关的行为封装起来。这在正式的计算机科学中被称为数据结构。
举例：我们在编程中要描述一个数据，然后我们会定义一个变量，这个值是一个字符串，这也就是数据。但我们在使用的过程之，往往关心的不是数据是什么，而是可以对数据做什么，也就是应用再数据上的行为（比如计算数据长度啊、追加数据啊、搜索数据中的字符啊等等）。因此这些行为被设计成了String类。
再来看一个例子：“汽车”可以被看做“交通工具”的一种，对于这种关系，我们在软件中可以定义Vehicle类和Car类来进行建模。
Vehicle类的定义，可能包含推进器(比如引擎)、载人能力等。它包含所有类型的交通工具，不管是飞机、汽车或者火车。
而Car类继承了Vehicle类，以通用的Vehicle类作为基础进行特殊化定义，比如加上汽车的车辆识别码等。
虽然Vehicle和Car会定义相同的方法，但实例中的数据可能是不同的，这就是类、继承和实例化。
类的另一个核心概念是多态，是说父类的通用行为可以被子类用更特殊的行为进行重写。
4.1.1 “类”设计模式
有人可能从来没把类作为设计模式来看，反而更熟悉的是比如观察者模式、工厂模式、单例模式等其他模式。但是这些高级设计模式，都以面向对象类的基础上实现的。
可能你还听过“过程化编程”，这种代码只包含过程调用，没有高层的抽象。
除此之外，如果有函数式编程的开发经验，会知道类也是非常常用的设计模式，但类不是必须的编程基础，而是一种可选的代码抽象。而在其他编程语言比如Java中，并不给你选择的机会，万物皆对象。
4.1.2 JavaScript中的“类”
在软件设计中，类是一种可选的模式。由于许多开发者都非常喜欢面向类的软件设计，JavaScript提供了语法糖来满足对于类设计模式的最普片需求，比如ES6新增了比如class关键字等，但javascript中的“类”和和其他语言中的类并不一样。
4.2 类的机制
在许多面向类的语言中，内置会提供Stack类，这是一种“栈”数据结构，同时会提供一些公有的方法。但实际上我们并不是直接操作Stack，Stack类仅仅是一个抽象的表示，它本身并不是一个“栈”。使用的时候，通常也需要先实例化Stack类，然后才能对它进行操作。
4.2.1 建造
类和实例的概念源于房屋建造。
在建造之前，建筑师通常会规划一个建造蓝图来描绘建筑的特性：宽、高、几室几厅、多少个窗户以及窗户的位置等。但在这个阶段，并不关心建筑会被建在哪，也不关心会建造多少个这样的建筑，甚至不用关心建筑中的内容（比如家具、壁纸、吊灯等）。建筑蓝图只是建筑计划，它们并不是真正的建筑。
接下来，需要一个建筑工人按照蓝图建造建筑，把规划好的特性从蓝图中复制到现实世界的建筑中。
完成后，建筑就成为了蓝图的物理实例。如果需要建筑多套房子，只需把工作都重复一遍，再创建一份副本。
建筑和蓝图之间的关系是间接的。蓝图只是抽象描绘了建筑的结构，比如蓝图只表示门在哪，但并不是真正的门，如果想打开一扇门，那就必须接触真实的建筑才行。
一个类就是一张建造蓝图，为了获得真正的建筑，我们必须按照类来建造(实例化)一个东西，而这个东西通常被称为实例。
4.2.2 构造函数
实例是由一个特殊的类方法构造的，这个类方法的方法名通常和类名相同，称为构造函数。
构造函数大多情况下，需要用
new来调用，构造函数的主要任务，就是初始化实例需要的所有信息。
4.3 类的继承
在面向类的语言中，当一个类继承另一个类时。后者通常被称为“子类”，前者会被称为“父类”。
从术语来看，显然是类比父母和孩子。在现实中，孩子会从父母继承许多基因特性，但通常孩子不会和父母一模一样，即便外貌长相会类似，但性格行为却大不相同，因为孩子是一个独一无二的存在。
同理，在程序中，相对于父类来说，子类也是一个独立个体。子类会包含父类行为的原始副本，但也可以重写所有继承的行为甚至定义新的行为。
注意：有必要说明一下，这里说的父类和子类不是实例，而是像上文说得建造蓝图一样。我们应当把父类和子类称为父类DNA和子类DNA，需要根据这些DNA来创建(实例化)一个人，我们才拥有一个真实的实例。
4.3.1 多态
当子类继承父类，引用父类原始的方法时，这里被称为多态（相对多态）。
说明：实际上多态是任何方法都能引用继承层级中上层的类的方法。之所以说是“相对”，是因为当前子类引用的是父类的方法，而实际上还可以引用祖先类(superclass)的方法。
多态并不表示子类和父类有关联，子类得到的只是父类的一个副本。类的继承其实就是复制。
4.3.2 多重继承
有些面向类的语言允许子类继承多个“父类”，多重继承意味着所有父类的定义都会被复制到子类中。
从表面看，多继承可以把许多功能组合在一起。然而这个机制也会带来很多复杂的问题。比如，当子类调用两个父类同名的方法时，就不知道该怎么处理了。
JavaScript本身也不提供“多重继承”功能，但也可以用各种办法来实现多重继承。
4.4 混入
在继承或实例化时，JavaScript的对象机制并不会自动执行复制行为。换句话说，JavaScript中只有对象，不存在可以被实例化的“类”。不会复制对象，它们只是被关联起来。
由于在其他语言中，类表现出来的都是复制行为，因此JavaScript开发者也想出了一个方法来模拟类的复制行为，就是混入。
有两种类型的混入：显式和隐式。
4.4.1 显式混入
之前提到的Vehicle和Car。接下来，我们用JavaScript手动实现复制功能。这个功能在许多库和框架中被称为
extend()，但是为了方便理解我们称之为minxin()：
function minxin(sourceOBj,targetObj){ for(var key in sourceObj){ if(!(key in targetObj)){
targetObj[key] = sourceObj[key];
}
} return targetObj;
}var Vehicle = { engines : 1, ignition: function(){ console.log('Turning on my engine.');
}, drive : function(){ this.ignition(); console.log('Steering and moving forward!');
}
};var Car = mixin(Vehicle,{ wheels : 4, drive : function(){
Vehicle.drive.call(this); console.log( 'Rolling on all' + this.wheels + ' wheels!'
);
}
};Car中就拥有一份Vehicle属性和函数的副本了，但注意：复制的是函数的引用。
再说多态：
Vehicle.drive.call(this)就是显示多态，清楚证明调用的是父类还是祖先类；inherited:drive()就是相对多态。mixin()的工作原理：它会遍历sourceObj的属性，如果在targetObj没有这个属性就会进行复制。
显式混入模式的另一种变体被称为“寄生继承”：
function Vehicle(){ this.engines = 1;
}
Vehicle.prototype.ignition = function(){ console.log('Turning on my engine.');
}
Vehicle.prototype.drive = function(){ this.ignition(); console.log('Steering and moving forward!');
};function Car(){ var car = new Vehicle();
car.wheels = 4; var vehDrive = car.drive;
car.drive = function(){
vehDrive.call(this); console.log('Rolling on all ' + this.wheels + ' wheels!');
} return car;
}var myCar = new Car();
myCar.drive();4.4.2 隐式混入
隐式混入和显式伪多态很像，但同样拥有同样的问题：不是真正的对象复制，而是复制引用。
var Something = { cool : function(){ this.greeting = 'Hello World!'
this.count = this.count ? this.count + 1 : 1;
}
};
Something.cool();
Something.greeting; //'Hello World'Something.count; //1Another = { cool : function(){
Something.cool.call(this);
}
};
Another.cool();
Another.greeting; // 'Hello World'Another.count; // 1如果在构造函数调用使用
Something.cool.call(this)，最终的结果是Something.cool()中的赋值操作都会应用再Another对象上而不是Something对象上。通常来说，应该尽量避免使用这一的结构，以保证代码的整洁和可维护性。
4.5 小结
类是一种设计模式，许多语言提供了面向类软件设计的原生语法。JavaScript也有类似的语法，但和其他语言中的类完全不同。
类意味着复制。传统的类被实例化的时候，它的行为会被复制到实例中。类被继承时，行为也会被复制到子类中。
多态看起来似乎是从子类引用父类，但本质上引用的其实是复制的结果。
JavaScript不会像类那样自动创建对象的副本。但通过混入模式可以模拟类的复制行为，但通常会产生丑陋且脆弱的语法，这会让代码更加难懂并且难以维护。
显式混入实际上无法完全模拟类的复制行为，因为对象只是复制引用，无法复制被引用的对象或者函数本身。
总的来说，在JavaScript中模拟类是得不偿失的，可能会买下更多隐患。
作者：梁同学de自言自语
链接：https://www.jianshu.com/p/0a5f6a598fa3
共同学习，写下你的评论
评论加载中...
作者其他优质文章
