javascript面向对象编程一直都是初学者的难点，都看过很多文章，却没有动手写过，还是理解不深刻，今天我看文章的时候手写了一个及小的插件，正好练练手。

详细的js面向对象编程可以看阮一峰老师的文章 阮一峰-面向对象编程

我正好在看文章时，动手写了一个loading的插件，也可以用在项目中去。分享出来。 github链接

loading效果是这样的：

直接看代码吧，执行特别简单：

只需要事先准备好一个容器

只有三个api

直接看源码吧， 简单得令人发指：

逐一分析：

• 创建一个叫Loading的构造函数。

• this.color = ['#5fc6b3', '#5fc6b3', '#5fc6b3']; // default colors 给三个小圆点定义三个默认颜色。

• this.init = function (id) {

  };
  根据传进来的id来获取到dom元素。并将该dom元素对象赋值给this.container，方便以后使用。最后return this，这里为了方便api实现链式调用，所以return了this。实现了如loading.init(‘container’).start().end();`这样的链式调用，这种写法在jquery中很常见。

• start方法。

这里处理shart’方法传进来的color，是一个数组，如果没有传入，则为我们默认的colors。循环创建3个div，并赋上相应的属性，再添加到container中。

• this.end = function () {

  }
  `

最后也很简单，移除这个container。

¨NBSP;详细代码见github

这个例子很小，希望对你有帮助。