引子
前段时间因为iphone 5s的摄像头坏了，但因为摄像头坏了换手机又比较可惜，无意间网上查找，5s摄像头坏掉是通病，淘宝上也因为5s的摄像头坏掉有专门的一门生意，卖新摄像头及拆机工具，所以也立马下了一单，到手后开始拆机，很惊讶，这样的一个小物件，里面的组件化做得这么好，摄像头，电池，屏幕，指纹都是一个个组件，往主板插上就可以使用。对于这么小的一个物件，居然有这么好的组件化，我们的生活中到处有组件的使用，对于码农来说，组件更是必不可少，也是码农升华的必经之路。
思考
万物都是一样的表现呈现在世人面前，但每个人的解读都会有所不同，这是什么原因造成的呢？直接的影响应该是对同一件事件的认知不同，因为学习环境，知识积累的不同，同样的一个事物对每个人的认知都会有所偏差。 认知其实是经过的分析后得出的结论，无论你承不承认自己有没有经过分析，已经造成了不同的认识了。在这一节里，我想指出的是，无论什么样的一个事物，都要经过主动的分析，不要让大脑无意识的分析，主动分析的结果，会动用现在的知识体系，去分析事物表层下的一些关系。至于分析的结论正确与否，但至少我们已经有一个主动分析的意识在里面，后面就要是丰富自己的知识体系，提高和扩大自己的认识面，通过不停的学习，增加知识，积累知识，通过学习丰富知识体系，相信最后的结果是能得到一个相对正确的分析结果。
- 表层现象
在张图，粗略一个是一堆三角形围成一圈坐在一起
- 分析方法引入
引入水平距离的分析方法
引入垂直距离的分析方法
上面的两个分析方法的引入，可以相对正解的得出第二种分析方法更能说明问题，但对于没有一定的知识积累，因为没有分析方法的引入，只能做粗略的分析，这里想强调的是分析方法是通过知识积累和经验积累所生产的，在有意识的分析前提下，需要不停的摄取知识和经验，产生不同的生析方法，最后才会越来越接近本质。
页面组件开发
对于前端开发，如果进行组件化开发呢，还是从分析开始。
对于这样的一个效果图，我们能用什么样的分析方法来拆分组件呢？
- 由大到小的拆分组件
上面的效果图，可以看出整个页面分为上面两部分，上部分是通栏的中型模块1，下部是居中的中型模块2。从大模块开始拆分模块。
- 拆分中型模块
中型模块1，可以拆成一个居中的次中型模块3，在次中型模块3中，有logo模块4，登录模块5，下载模块6，可以从上面的分析看出中型模块3和中型模块2是两个大小相同的居中模块，可以应用同一组样式进行大小和居中的控制。
登录模块5分为左右两个模块，左边是广告图片，右边是一个tab切换的登录方式的切换，注意右上角有个小图标，也是用来切换登录方式，这样的拆份以后，上部通栏的组件都已经被拆卸出来，也基本可以照着拆卸的组件进行开发了。 下部居中的模块大的拆份是左右两栏固定宽度的布局，每左边模块是一条一条的微博，右边是一个一个的特色模块，左边微博模块还可以拆得更细，这里不做再细的拆分。右边的特色模块的拆分，外部都是标题+内容区域，这个模块的主框架，然后通过模块的扩展，再把丰富模块的表现形式，从页面上看，微博频道、热特微博才是这么模块最应该有的方式，热门话题反而是扩展出来的模块，完成自有的样式。
- 拆分小模块
拆模块，最终要能拆到不可拆为止，但太小的粒度也不利于组件的使用，所以这是一个对立面，拆到模块不能拆，也是太绝对的一个事，拆到一个认为可以独立完成一个功能，或是能提供一个独立功能，拆到这种呈度基本也可以了。所以上面的两种登录方式的模块还是有必要拆出模块来。
- 注重细点
把页面上的每一个点都扫描到，不要漏掉细节，细节处理到位了，会让一个工作成为点精之作。
从大到小拆分模块，把模块拆分到能提供独立功能为止。把页面想象成各种组件组合起来，就像5s一样，通过插口把组件布在页面上，组件可以脱离于页面本身独立，组件不要依赖于布局样式，在使用时根据容器节点放置组件即可。
js的组件开发
一个组件有哪些特性
- 封装性
不依赖于外部的属性和方法，自己的方法和属性也不能让外部调用，但在js里是没有强限制让外部不进行调用，在代码规范要需要区分出，哪些方法是可以外部调用，哪些方法不能让外部调，如果外部调了，可能导致组件不能正常工作。封装性还有一个表现是如何进行参数定义，一个组件让用户使用需要有好的参数说明和定义，且支持默认参数的默认值，以及组件和外部的消息通信。
- 扩展性
如何去扩展一个组件，在开发中用到的最多的是继承，还可以用组合，在继承上可以用虚函数（空函数），把对象的接口预留起来，让子类具体实现接口。在最初设计组件时，应该不会太考虑接口预留的问题。能做好尽量的解耦组件已经是一个很成功的组件了。用组合的方式可以横向的扩展组件，使组件拥有更多的功能，
- 事件通信
在组件开始工作后，需要和外部进行事件通信，以使外部获取组件内的工作状态，同事更新组件使用者的状态。