关于time-gallery的链式封装(可链式调用)

插件地址：https://github.com/chenliangwulin/time-gallery
封装语言：es5 prototype链式封装(es6)
https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Inheritance_and_the_prototype_chain
//需要面向对象，class的写法吗？prototype的写法吗？

实现方式
https://blog.youkuaiyun.com/owen_william/article/details/51344700

技术难点
层级json的处理：如何向层级相关添加元素，构造完整的json。
相关参考文章
https://www.cnblogs.com/xiehaitao/articles/7049913.html
接口预览
function animate(){
var canvas_data="";
this.Container=function(id){
this.canvas_data="{id:"+id+"}";
return this; } //return this
this.Children=function(){
return this;}
this.Bitmap=function(){
return this; }
this.Text=function(){
return this; }
this.Shape=function(){
return this; }
this.Sprite=function(){
return this; }
}
animate.prototype={ //长图类动画原型封装
fromTo:function(){
return this; },
prop:function(){
return this; },
animate:function(){ }
//TweenMax.fromTo(".title", 2, {opacity:0,top:“5%”},{opacity:1,top:“10%”,ease: Bounce.easeOut});
// fromTo:function(".title",2,{},{}){ // 接口参照于tweenmax的接口
// console.log(“i am 1”);
// return this;
// }
}

JS中生成JSON对象的方法
https://www.cnblogs.com/jiangyy/p/3531150.html
先新建一个对象

变量初始化

思路分析
本质上是构造对象，json,然后返回json
因为json有多个层级（本例就两个层级），所以设置了ischildren变量
ischildren变量设置好后，需要在contain,bitmap,text,sprite再设相应的值。

然后在prop方法便可根据对应的值添加prop属性

注意要点

扩展
vscode+typescript的智能提示
https://segmentfault.com/a/1190000009247663?utm_source=tag-newest