用js开发滑动组件

用js单例设计模式写了一个Drag组件demo，暂时只有三个配置项。

config：{ id，toDown，toUp }         //id为必填项，可以放在初始化方法init()中第一个参数。

                                                         //toDown：function类型

                                                          //toUp：function类型

源码地址：https://github.com/dingjiamughal/components/blob/master/componentDrag.html

演示效果：https://dingjiamughal.github.io/components/componentDrag.html

面向对象组件开发思路：

构造目标主题函数Drag()，声明默认options：

extend方法，覆盖默认参数：

初始化方法init，在init中调用extend方法：

基本思路完成，剩下的补充方法逻辑：

init为主接口，包含所有参数，因此所有方法都要写在init中

这里和demo版的有点区别——将id作为必选参数（id放在opt中如果不写也会报错，因为this.obj需要传id）

注意this指向问题：在init接口下的事件中的this指向this.obj，为了拿到Drag中的配置参数和Drag原型下的方法，要在init中保存this --> var _this=this;

关于This.settings.toDown()：调用的是默认配置项中的方法，牵涉到extend函数将引用类型的自定义对象属性传给默认对象settings，所以直接调用默认参数即可

默认配置项settings的作用，防止多次调用产生效果冲突。

方法调用：

以上是Drag组件开发的基本流程，可以根据需求补充自定义参数settings。