JavaScript 面向对象编程学习笔记（一）：封装

最近在学习JavaScript面向对象编程，把学到的知识做一个归纳总结，方便以后随时复习，也希望帮助到学习这部分知识的小伙伴！

一、创建对象的原始模式（通过对象字面量方式来创建对象）

我们把狗狗看成一个对象，它有名字和颜色两个属性：

接下来，我们需要根据上面这个原型对象的规格，生成两个实例对象：

ok，以上就是简单的封装，把连个属性封装在一个对象里面。不过，这样的写法有两个缺点，一是如果需要生成N个实例，则学起来就比较麻烦。二是在实例和原型之间，看不出有任何的联系。

 

二、对上面原始模式的改进

我们可以先写一个函数，解决代码重复的问题。

然后生成实例对象，就相当于调用函数。

这种写法仍然存在一个问题，那就是仍然看不出dog1和dog2之间的联系，看不出它们是同一原型对象的实例。

 

三、构造函数模式

所谓的构造函数，实际上就是一个普通那个函数，只是内部使用了this变量，对构造函数使用new运算符，就能生成实例，并且this变量会绑定在实例对象上。

比如，狗狗的原型对象现在可以这样写：

接下来就可以生成实例对象了：

此时，dog1和dog2会自动包含一个constructor属性,指向它们的构造函数。

JavaScript还提供了一个instanceof运算符，用来测试一个对象在其原型链中是否存在一个构造函数的prototype属性。

 

四、构造函数模式的问题

构造函数虽然很好用，但是存在一个耗费内存的问题。

我们现在为dog对象添加一个不变的属性type（种类）和一个方法eat（吃）。那么原型对象就变成下面这种。

还是采用同样的方法生成实例：

这样写表面上没什么问题，但是，实际上有一个很大的弊端，那就是对于每一个实例对象，type属性和eat（）方法都是一模一样的内容，每一次生成一个实例，都必须为重复的内容，多占用一些内存。既不环保，也缺乏效率。

其实，可以让type属性和eat（）方法在内存中只生成一次，然后所有实例都指向那个内存地址。

 

五、prototype模式

Javascript规定，每一个构造函数都有一个prototype属性，指向另一个对象。这个对象的所有属性和方法，都会被构造函数的实例继承。

这就意味着我们可以把那些不变的属性和方法，直接定义在prototype属性上。

接下来，生成实例：

这时所有的type属性和eat()方法，都是属于同一个内存地址，都只想prototype对象，因此提高了运行效率。

 

六、prototype模式的验证方法

6.1  isProtptypeOf()  用来验证某个prototype对象和某个实例之间的关系

6.2  hasOwnPropety()  用来判断一个属性到底是本地属性还是继承自prototype对象的属性

6.3in运算符  用来判断某个实例是否含有某个属性，不管是不是本地属性

in运算符还可以用来遍历某个对象的所有属性。

运行结果：