面向对象是一种思维方式，在拿到问题时我们先不考虑代码的具体实现，而是先考虑需要哪些功能才能去解决这个问题。
假设我们现在有这样一个需求，一个人员架构的列表。
demo.png
页面的逻辑是这样的。
demo1.jpg
顶部有一个面包屑，下面的列表有人员和部门，当点人员时拿到人员详情，点击部门时加载这个部门下的人员和部门，点击部门时要加载面包屑对应的部门下的人员和部门。
首先我们需要一个类，就叫PersonManage。然后分析一下这个需求需要哪些功能。首先肯定是创建列表的dom，人员和部门不一样，所以需要buildPerson和buildDepartment两个方法。然后是面包屑需要addCrumb,removeCrumb和updateCrumb三个方法，分别用来增加面包屑，减少面包屑，增加和减少后都需要更新下面包屑。当然还需要其他的方法，不一一介绍了。有了这些方法后，我们就可以去构建类了。这大概就是面向对象的思想的思维方式。
1. 什么是对象？
所谓的对象就是若干属性的集合。在js中狭义的对象就是由大括号括起来并带有键值对的一种数据类型，广义的对象就是狭义的对象加上js的内建的对象类型，比如Array,Function。
2. 数据类型的检测
我们可以用typeOf操作符检测js中的数据类型，如果是对象就会返回'object'。
3. 封装
拿上面的例子继续说。现在有这样一个需求，要在面包屑的上面加一个搜索人员的搜索框，这个搜索框请求搜索接口返回人员列表。这个时候难道我们还去写一个专门生成搜索人员列表的方法吗，当然不用，我们可以直接利用上面那个PersonManage类的实例上的方法buildPerson方法，然后把搜索拿到的数据给这个函数，就可以了。这里就体现了封装的好处了，可以重用。
4. 继承
继承的好处在于子类可以直接复用父类的方法，无需在子类上重新定义。
这一点在three.js中体现的非常好，因为threejs中所有的类都是继承子Object3D这个大类，其他的响灯光，几何体都是继承子这个类，那么这些子类就可以使用在Object3D上定义的一些方法和属性，比如用于变换的Matrix,translate方法等等。
最后补充一下，这里总结的只是我自己的一点理解，面向对象是个很大的话题，不是几句话就可以概括的。还有就是图是我自己做的，丑了点。。。。
网友评论