JS中创建对象模式、继承、类Class之间的关系

116 阅读3分钟

前面几篇文件主要梳理了JS中几种主要的数据类型--基本数据类型和引用数据类型。引用数据类型都是对象,基本数据类型也有相应的对象形式,所以说“万物皆对象”。工作中创建对象的主要方式是数字字面量方式和new 构造函数()方式创建对象,但是这两种方式都有一个问题--对于相同逻辑的对象都要重复多次编写相同的代码,这就导致创建对象的效率大大降低,那么我们接下几种高效率创建对象的模式。

创建对象模式

工厂函数模式:

用一个普通函数封装“创建一个对象,并将创建的对象返回给一个变量的过程”,此函数可以传参给对象,然后可以通过直接调用这个函数来创建对象。

此模式相对虽然字面量方式和构造函数方式可以高效率的创建对象,但是此模式不能检测对象的类型。

构造函数模式:

用一个首字母大写的构造函数封装“往this上添加属性和方法的过程”,然后通过new 构造函数()的方式创建一个新对象,并将新对象赋值给变量。

此模式虽然可以解决工厂函数模式无法检测对象类型的问题,但是却有每一次创建对象都要重复创建相同代码逻辑的函数方法,无法复用函数方法,浪费了性能。

原型模式:

把属性和方法都添加到构造函数的原型上,这样通过new 构造函数()的方式创建一个新对象时就可以在每一个对象实例上共享原型上的属性和方法,不需要重复创建复用的方法。

虽然此模式解决了重复创建复用的方法的问题,但是属性值是引用类型的对象和数组,在每一个对象实例上也会共享,任何一个实例对象修改其值都会污染其他对象实例,这不是我们想要的现象。

总结:

每一种创建对象的模式都有其优缺点,无法达到完美效果。所以实际工作中并不单独使用某一种模式,而是组合构造函数和原型模式一起使用。用原型添加需要共享的属性和方法,用构造函数添加对象实例自有的属性和方法,这样能够同时解决类型检测问题、无法复用方法问题、实例的引用类型属性值相互污染问题,并高效的创建符合需求的对象。

继承

我们经常会有这样的一个需求:当一个父对象拥有一些属性和方法,我们想要子对象也能直接“借用”父对象的属性和方法,而不需要再次在子对象上重复创建父对象的属性和方法,这个过程在编程中就叫做“继承”。

上面梳理了几种创建对象的模式,接下来梳理一下继承的几种方式。

JS中我们实现继承的方式是通过原型链继承,但是单纯的原型链继承有些缺点需要我们完善一下,完善后的继承方式是:寄生式组合继承,下面来梳理一下这个完善的过程。

完整内容参照这篇我自己写的文章:www.cnblogs.com/yibaihe/p/1…

现在我已经把JS的中的数据类型、创建对象模式、继承、类Class之间的关系梳理完成,这些既是JS中的基础内容,构建了JS的根基,同时也是JS的重点内容,对于学习前端非常重要。

接下来我将继续梳理一下在工作中常用的一些内置对象,以便工作和面试。