2016-12-28

进击的前端路由

今天立项，最近准备学习前端路由。感受一下真正的单页面开发与加强js的掌握。嗯，是这样的，我要尝试自己做一个路由的哦！（还有今天开始晚上跑步，如果可以再刷一下leecode）
2017/2/18更新回家过了个年，胖的要死，先发一个简易的前端路由吧，其他的都先删了吧。最近在看书，偶尔刷题，也没有更新博客了，总觉得没什么好更新的，对了最近在找工作！可以联系我邮箱置顶！

(function(window){
    //html5API
    var support = history.pushState ? "html5" : ("onhashchange" in window ? "hash" : "pass");
    var currentUrl = "";
    var cache = {
        key: function(url){
            return "x-pjax[" + url + "]";
        },
        get: function(url){
            var value = sessionStorage.getItem(cache.key(url));
            return value && JSON.parse(value);
        },
        set: function(url, value){
            try{
                sessionStorage.setItem(cache.key(url), JSON.stringify(value));
            } catch (e){
                console.log("太大了boy");
            }
        },
        clear: function(){
            var i = sessionStorage.length;
            while(i--){
                var key = sessionStorage.key(i);
                if(key.indexOf("x-pjax") > -1){
                    sessionStorage.removeItem(key);
                }
            }
        }
    };

    var event = function(self){
        var pjax = self;
        this.popstate = function(){
            pjax.fnb = true;
            pjax.jump(location.href, null, null);
        };
        this.hashchange = function(){
            if(!pjax.fnb) return;
            pjax.jump(location.href.replace("#/", ""), null, null);
        };
        this.click = function(e){
            var element = e.target || e.srcElement;
            var url = element.href;
            currentUrl = location.href;
            var strUrl = url.split("/").slice(3);
            strUrl = "/" + strUrl.join("/");
            //过滤空值
            if(url === undefined || url === ""){
                return ;
            }else if(pjax.routers && !(strUrl in pjax.routers)){
                return ;
            }
            e.preventDefault ? e.preventDefault() : (window.event.returnValue = false);
            console.log("shifouttiaozhuan");
            return false;
            var data = encodeURI(element.getAttribute("title"));
            pjax.fnb = false;
            pjax.jump(url, data, null);
        };
        this.bindEvent = function(){
            var eventSelf = this;
            if(support === "html5"){
                window.addEventListener("popstate", eventSelf.popstate);
                var nav = document.getElementById("nav");
                nav.addEventListener("click", eventSelf.click);
            }else{
                window.attachEvent("onhashchange", eventSelf.hashchange);
                var nav = document.getElementById("nav");
                nav.attachEvent("onclick", eventSelf.click);
            }
        };
    };

    var pjax = window.pjax = function(routers){
        if(!(this instanceof pjax)){
            return new pjax(routers);
        }
        //表示当前操作是否由前进和后退触发
        this.event = new event(this);
        this.fnb = false;
        this.routers = routers;
    };
        //显示新页面内容
    pjax.prototype.show = function(title, html, selector){
        document.title = title;
        selector.innerHTML = html;
    };
    //跳转到指定页面
    pjax.prototype.jump =  function(url, data, callback){
        //如果是由前进或后退触发，则试着从缓存中获取数据
        if(this.fnb){
            var strUrl = routerUrl(url);
            var containerId = self.routers[strUrl].containerId,
                callback = self.routers[strUrl].callback;
            var container = document.querySelector("#"+containerId);
            var value = cache.get(url);
            if(value !== null){
                this.show(value.title, value.html, container);
                if(callback){
                    callback();
                }
                return;
            }
        }

        var self = this;
        //ajax发送请求并且渲染
        jumpXhr(self, url, data);
    };
    pjax.prototype.init = function(){
        this.event.bindEvent();
    };
    pjax.prototype.configure =  function(routers, options){
        // this.recursion = options.recursion;
        var data = routersInOrder(routers, "", {}, []);
        this.routers =  data.newRouter; //存储所有路径对应的映射结果
        this.methodRouters = routersSort(data.routersName); //存储所有的路径名字
    };
    function Ajax(url, data, selector){

    }
    function htmlRender(url, container){
        var data = Ajax(url);
        container.innerHTML = data.html;
    }
    function JsRender(url){
        var ajaxFlag = true;
        var scripts = document.querySelectorAll("script");
        scripts.forEach(function (currentValue, index){
            if(currentValue.src === url){
                ajaxFlag = false;
                return ;
            }
        });
        if(ajaxFlag){
            var script = document.createElement("script");
            script.language = "javascript";
            script.src = url;
            document.body.appendChild(script);
        }
    }
    function jumpXhr(self, url, data){
        var strUrl = routerUrl(url);
        var containerId = self.routers[strUrl].containerId,
            htmlUrl = url + "/" + self.routers[strUrl].htmlurl,
            controllerUrl = url + "/" + self.routers[strUrl].controller,
            callback = self.routers[strUrl].callback;
        console.log(self.routers[strUrl]);
        var container = document.querySelector("#"+containerId);

        var xhr = new XMLHttpRequest();
        xhr.open("get", htmlUrl, true);
        xhr.setRequestHeader("X-PJAX", "true");
        xhr.setRequestHeader("X-PJAX-TITLE", data);
        xhr.setRequestHeader("X-Requested-With", "XMLHttpRequest");
        xhr.onreadystatechange = function() {
            var self = this;
            if (xhr.readyState === 4) {
                if (xhr.status >= 200 && xhr.status < 300 || xhr.status === 304) {
                    var html = xhr.responseText;
                    var title = xhr.getResponseHeader("X-PJAX-TITLE");
                    if (title === null) {
                        title = document.title;
                    } else {
                        title = decodeURI(title);
                    }
                }
                // selector.innerHTML = htmlOrJs;
                self.show(title, html, container);
                JsRender(controllerUrl);
                callback();
                //不是前进和后退触发的
                if(!self.fnb){
                    //修改URL,URL地址栏会变换
                    if(support === "html5"){
                        history.pushState(null, null, url);
                    }else{
                        var path = url.replace(location.protocol + "//" + location.host, "");
                        location.hash = path;
                    }
                    //添加到缓存
                    cache.set(url, {
                        title: title,
                        html: html
                    });
                }else{
                    console.log("请求失败");
                }
                self.fnb = true;
            }

        }.bind(self);

    xhr.send(null);
              //这里面好像bind之类的闭包用的太多了好像

    }

function initRegexps (route){   //根据路由字段生成相应的正则表达式
    route = route.replace(/[/,.+\-?$#{}\[\]]/g, '\\$&')   //然后把所有的正则表达式匹配传入的url如果匹配就触发函数
        .replace(/\((.*?)\)/g, '(?:$1)?')
        .replace(/(\/\w?:\w+)+/g, '\/([^/]+)')
        .replace(/\*\w*/g, '([^?]*?)');
    console.log(route);
    return new RegExp('^' + route + '$');
}

function dispath(url, self){    //根据url触发沿途的所有回调
    var urlArray = url.split("/");
    for(var len1 = urlArray.length, i = len-1; i > 0; i--){
        urlArray[i] = urlArray.shift(len-1-i).join("/");
    }
    if(self.recursion){  //向后递归
        var j = 0;
        while(urlArray[j]){
            if(urlArray[i] in self.methodRouters){// 这里应该使用正则匹配对不起
                self.methodRouters[urlArray[j]].call(self, urlArray[j]);
            }
            j++;
        }
    }else{
        var j = len-1;
        while(urlArray[j]){
            if(urlArray[i] in self.methodRouters){// 这里应该使用正则匹配对不起
                self.methodRouters[urlArray[j]].call(self, urlArray[j]);
            }
            j--;
        }
    }
}
    function routersSort(arr){
        if(arr.length <= 1){return arr;}
        var left = [], right = [];
        var a = Math.floor(arr.length/2);
        var ai=arr.splice(a,1)[0];  //基准必须从原数组删除，否则陷入循环
        for(var i = 0, len = arr.length; i < len; i++){
            if(arr[i] > ai){ //修改了储存方式
                right.push(arr[i]);
            }else{
                left.push(arr[i]);
            }
        }
        return routersSort(left).concat([ai],routersSort(right));
    }
function routersInOrder(routers, name, newRouter, routersName){
    if(typeof name === "undefined"){
        name = "";
    }
    for( var i in routers){
        if(routers[i] && (typeof routers[i].containerId === "undefined")){
            routersInOrder(routers[i], name + i, newRouter, routersName);
        }else if(routers[i] && (typeof routers[i].callback === "function")){
            newRouter[name + i] = routers[i];
            routersName.push(name + i);
        }
    }
    return {
        newRouter: newRouter,
        routersName: routersName
    };
}
    function routerUrl(url){
        var strUrl = url.split("/").slice(3);
        strUrl = "/" + strUrl.join("/");
        return strUrl;
    }

})(window);

2016-11-12

对js的链表操作

原题目链接

这是我今天连续更新四篇的原因，一部分是因为最近有点事，一部分是因为这个东西耗了我太多精力了（所以之前都没有更新），大概有多耗费精力呢？我觉得js的引用类型每个人都应该来那么一下。
不是数组的引用类型，是使用链表的时候的引用类型，最近做的我很感动！


/**
 * Created by YangSir on 2016/11/8.
 */
class ListNode{
    val:number;
    next:ListNode;
}
var addNode = function(List:ListNode,val:number, pos?:number){
    var L = List;
    if(L.val == undefined){
        L.val = val; L.next = null;
        return;
    }else{
        if(L.next){
            addNode(L.next, val, pos-1);
        }else{
            L.next = new ListNode();
            L.next.val = val;
            L.next.next = null;
            return ;
        }
    }
};
var mergeKLists = function(lists:Array<ListNode>){
    //var k = lists.length;
    var Arr = [];
    var min = -1, index;
    var newList = new ListNode();
    while(true){
        min = lists[0].val; index = 0;
        for(var i = 0, k = lists.length; i < k ; i++){
            var flag = 0;
            if(lists[i]||lists[i].val){
                var val = lists[i].val;
                if(min>val){
                    min = val;
                    index = i;
                }
            }
        }
        addNode(newList, min);
        if(lists[index]){   //如果存在就执行向下延伸并且各项指标加一，如果next不存在就删掉当前各项指标
            Arr[index] ? Arr[index]++ : Arr[index] = 0;
            if(lists[index].next){
                lists[index] = lists[index].next;
            }else{
                Arr.splice(index, 1);
                lists.splice(index, 1);
                if(lists.length == 0){
                    return newList;
                }
            }
        }
    }
};
//下面是测试使用的数据
var L = new ListNode();
var M = new ListNode();
var Arr = [];
Arr.push(M);
Arr.push(L);
for(var i = 0; i < 7; i++){
    if(i%2){
        addNode(L, i);
    }else{
        addNode(M, i);
    }
}
console.log(L,M,Arr);
var newL = mergeKLists(Arr);
console.log(newL);

2016-11-12

conversion

简单说就是将字符串打乱然后排序，说到这里，这个不是密码学了吗？做的时候都没有发现唉！

原题目链接

对了我依然还是贴上typescript的代码，其实我的思路错了，不应该使用这个方法的，应该有更简单的方法。但是也算是勉强解决了，就是逻辑更加困难了。

/**
 * Created by YangSir on 2016/11/5.
 */
class Ctr{
    Flag:number;
    flag:number;
    x:number;
    y:number;
    constructor(){
        this.Flag = 0;
        this.flag = 1;
        this.x = 0;
        this.y = 0;
    }
    concon(){
        this.flag = (++this.flag)%2;
    }
    con(n){
        if((this.Flag!=0)&&this.Flag%(n-1)==0){
            this.concon();
        }
        this.Flag++;
        return this.fn();
    }
    fn(){
        switch(this.flag){
            case 1: this.x++;break;
            case 0: this.y++;this.x--;break;
        }
        return {
            x: this.x,
            y: this.y
        };
    }
}
var convert = function(str, n){
    var ctr = new Ctr();
    var Srr = str.split("");
    var Arr = [];
    var Brr = [];
    for(var i = 0;i < n; i++){
        Arr.push([]);
    }
    Arr[0][0] = Srr[0];
    for(var j = 1,len = str.length; j < len; j++){
        var ob = ctr.con(n);
        Arr[ob.x][ob.y] = Srr[j];
    }
    for(var k = 0,LenA = Arr.length; k<LenA; k++){
        for(var p = 0,LenB = Arr[k].length; p<LenB; p++){
            if(Arr[k][p]){
                Brr.push(Arr[k][p]);
            }
        }
    }
    var Str = Brr.join("");
    console.log(Str);
    return Str;
};
//convert("PAYPALISHIRING",3);
convert("AB",1);

2016-11-12

container_with_most_water

原题目链接

唉，自己真是越来越懒了写博客，so-so-so-so-sad！

下面是代码与算法，希望读者能够体会。之前使用的是暴力方法，但是他直接给我了个测试数据是一个一百的数组我直接go die。所以改进了哈哈！

var maxArea = function(height){
    var Arr = height;
    var Max = 0, len = Arr.length;
    var k = 0, j = len-1;
    for(var i = 0; i < len; i++){
        // var line = Arr[k] > Arr[j] ? Arr[j] : Arr[k];
        if(k == j){
            console.log(Max);
            return Max;
        }
        var line;
        if(Arr[k]>Arr[j]){
            line = Arr[j];
            j--;
        }else{
            line = Arr[k];
            k++;
        }
        var area = (j - k + 1) * line;
        Max = Max > area ? Max : area;
    }
};
var result = maxArea([1,2]);
console.log(result);

嗯嗯

2016-11-04

珠宝问题

嗯，就是大家看到的上面那个。已经完全通过了
你每次以为ok的时候，信心满满的submit的时候，worry！I’m sad.
先贴出来勉强可以解决(已经修改了，已经完全适应了。通过！)：

Given “abcabcbb”, the answer is “abc”, which the length is 3.

Given “bbbbb”, the answer is “b”, with the length of 1.

Given “pwwkew”, the answer is “wke”, with the length of 3.

Given “bvbf”, the answer is “vbf”, with the length of 3.

/**
 * Created by YangSir on 2016/11/3.
 */
/**
 * @param {string} s
 * @return {number}
 */
var lengthOfLongestSubstring = function(s) {
    var Arr = s.split("");
    var Brr = [];
    var Crr = [];
    var Cto = 0;
    var All = [Brr,Crr];
    for(var i = 0, lenA = Arr.length; i<lenA; i++){
        if(i===0){
            All[Cto][0] = Arr[0];
            continue;
        }
        for(var j = 0; j<All[Cto].length; j++){
            if(All[Cto][j]==Arr[i]){
                if(All[Cto].length>All[(Cto+1)%2].length){
                    // All[(Cto+1)%2] = All[Cto];
                    Cto = (Cto+1)%2;
                    All[Cto] = [];
                    for(var index = j+1,indexlen = All[(Cto+1)%2].length; index < indexlen; index++){
                        All[Cto].push(All[(Cto+1)%2][index]);
                    }
                }else{
                    for(var kk = 0, index = j+1; kk < index; kk++){
                        All[Cto].shift();
                    }
                }
                All[Cto].push(Arr[i]);
                j = j+All[Cto].length+1;
                break;
            }
        }
        if(j == All[Cto].length){
            All[Cto].push(Arr[i]);
        }
         //console.log(All);
    }
    var result =  All[0].length>All[1].length?All[0]:All[1];
    //console.log(result);
    var str = result.join("");
    return str.length;
};
// lengthOfLongestSubstring("ggububgvfk");
//  lengthOfLongestSubstring("jbpnbwwd");

改天再弄吧，好累。。。sad。。。（完成了，摩西摩西）

2016-11-02

蛇形矩陣

大家好，至於説好的每天一道算法題呢？是有原因的，之前每天跑跑跑找工作，極度消耗精力的。現在決定冷靜一下，練一下算法，復習一下計算機網絡，操作系統。感受一下大四生活呢。
今天為大家帶來的是蛇形矩陣，大概描述一下就是這樣的，就是將下面這個數組，然後輸出：

1 2 3 4 5 6 7 8 9 10 11 11 13 14 15 16

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15

對了我使用的是typescript
下面貼上代碼吧，如果有時間就再天上注釋

class cont{
    flag:number = 0;
    nti:number;
    ntj:number;
    xy;
    constructor(){
    }
    conFlag(i,j){
        this.nti = i;
        this.ntj = j;
        this.flag = (this.flag+1) % 4;
    }
    access(i,j,width,height){
        console.log(this.flag);
        switch(this.flag){
            case 1:
                    if (this.ntj<j+width){
                        this.ntj++;
                    }break;
            case 2:
                    if (this.nti<i+height) {
                        this.nti++;
                    }break;
            case 3:
                    if (this.ntj>j-width){
                        this.ntj--;
                    }break;
            case 0:
                    if (this.nti>=i-height){
                        this.nti--;
                    }break;
        }
        this.xy =  {
            x:this.nti,
            y:this.ntj
        }
    }
}
var ob = new cont();
function snake(Arr, i, j, width, height){
    if(width==0||height==0){
        return;
    }
    ob.conFlag(i,j);
    var flag = ob.flag %2;
    switch(flag){
        case 1:for(var k = 0;k<width;k++){
            ob.access(i,j,width,height);
            var xy = ob.xy;
            var xyx,xyy;
            xyx = xy.x;xyy = xy.y;
            console.log(xyx,xyy,Arr[xyx][xyy]);
        };
        snake(Arr,xyx,xyy,width,height-1);
            break;
        case 0:for(var k = 0;k<height;k++){
            ob.access(i,j,width,height);
            var xy = ob.xy;
            var xyx,xyy;
            xyx = xy.x;xyy = xy.y;
            console.log(xyx,xyy,Arr[xyx][xyy]);
        };
        snake(Arr,xyx,xyy,width-1,height);
            break;
    }
}

調用方法：

var Arr = [
    [1, 2, 3, 4],
    [12, 13, 14, 5],
    [11, 16, 15, 6],
    [10, 9, 8, 7]
];
snake(Arr, 0, -1, 4, 4);//注意初始的時候確實是-1

var Brr = [
    [1,2,3],
    [12,13,4],
    [11,14,5],
    [10,15,6],
    [9,8,7]
];
snake(Brr,0,-1,3,5);//snake(Brr,0,-1,Brr.length,Brr[0].length);

我的輸入法怎麽成了繁體了，奇怪。。。總之呢測了一下，沒有bug了

###精简版来了，那天因为特殊需求花了二十分钟重新做了一遍，这次是js的

var clockwise = function(arr){
    var flag = 0;
    var height = arr.length;
    if(height){
        var width = arr[0].length;
    }
    function fn(arr, i, j, width, height) {
        var compass;
        if (flag == 2 || flag == 0) {
            compass = width;
        } else {
            compass = height;
        }
        for (var index = 0; index < compass; index++) {
            switch (flag) {
            case 0:
                j++;
                break;
            case 1:
                i++;
                break;
            case 2:
                j--;
                break;
            case 3:
                i--;
                break;
            }
            if (arr[i][j]) {
                console.log(arr[i][j]);
            } else {
                console.log(i, j);
                return;
                // break;
            }
        }
        switch (flag) {
        case 0:
            height--;
            break;
        case 1:
            width--;
            break;
        case 2:
            height--;
            break;
        case 3:
            width--;
            break;
        }
        if (width == 0 || height == 0) {
            return;
        }else{
            flag = (flag + 1) % 4;
            fn(arr, i, j, width, height);
        }
        return;
    }
    fn(arr, 0, -1, width, height);
};
// var flag = 0;

var Arr = [[1, 2, 3, 4], [12, 13, 14, 5], [11, 16, 15, 6], [10, 9, 8, 7]];
clockwise(Arr);
var Brr = [
    [1,2,3],
    [12,13,4],
    [11,14,5],
    [10,15,6],
    [9,8,7]
];
clockwise(Brr);

2016-10-18

自我介绍

git账号:https://github.com/millionbug
技术博客：millionbug.github.io (紧急修复成功了)
[baseball] (https://millionbug.github.io/ENGINE/baseball/index.html)
这个是我最新做的完全依赖于ENGINE的小游戏。主要是求职时的小项目。

ballball.html; Mario.html; 都只是小demo。MaroRes.html怎是依赖引擎完成的动画。basebll怎是完全依赖引擎完成的游戏。使用space按键开始游戏，A，D控制stick移动，击碎所有block完成进入下一个关卡

关于我的git项目的说明，在git上我的 https://github.com/millionbug 是我的git账号，我推了一个我做的一个项目上去。他是一个制作h5游戏的引擎。我完成了这个引擎之后又做了几个demo和一个基于canvas的游戏baseball

我本来是想要赶在19号之前推上去，然后推上我的博客，可以展示我的小作品。但是出bug了，我使用hexo之后就无法展示我的作品。但是在本地webstorm之类的开发工具中依然是可以打开的。所以我希望您能够在百忙中抽出片刻在webstorm中打开查看一下我的小作品（文件：YS杨国栋）。因为我是看到codemao很注重canvas和h5游戏才花了一个月的时间完成的小引擎。谢谢

爱好与自我介绍

非常感谢您能够看到这里来，先说一下如果有机会加入，随时通知可以到岗。因为真的关注codemao蛮久了。最近看的动漫是从零开始的异世界生活，灵能路人，天真与闪电。曾经追的很紧的是火影忍者和海贼王。说到游戏呢有玩LOL哦，但是永远的青铜Ⅲ，因为不想太执着与胜负，开心就好了。最近玩的最多的就是自己制作的baseball了，在我的项目里面可以看到，毕竟要测试。因为完全依赖我的引擎，怎么讲！很开心呢！
爱好呢，喜欢游泳，跑步，希望见到我本人之前您能够相信我。因为看到了之后你可能会怀疑我说的是否是真的。最重要的就是希望加入优秀的团队，和优秀的人共事，正是因此，疯狂想要加入codemao。

2016-09-23

YSengine

首先呢这是一个小引擎，专注于canvas动画与游戏开发的。其实只是自己学习typescript还有h5的新特性用到，算不上开发。但是呢我准备现在开始记录我学习过程中遇到的问题，总结一下解决方法，还有这当中帮助我的朋友们！
其实这是一篇测试我终于找回域名的博客更新的。这个能不能换行啊，这个能不能插入代码呀，（此处应该有换行）
理论上讲应该是三段咯。
[Anima一个动画哦] (https://millionbug.github.io)
[Animation.html] (https://millionbug.github.io/ENGINE/Animation/Animation.html)
[baseball] (https://millionbug.github.io/ENGINE/baseball/index.html)
[int] (https://millionbug.github.io/ENGINE/int/int.html)
[Mario] (https://millionbug.github.io/ENGINE/Mario/AnimaMario.html)
[MarioRes] (https://millionbug.github.io/ENGINE/MarioRes/MarioRes.html)

最后贴一个之前用bootstrap的小demo，本来领导是让我做插件的
[bootstrap-table] (https://millionbug.github.io/bootstrap项目2/new_file.html)

2016-09-22

保留最大整数.md

##首先我要说一下，这个题真的是我笔试的时候做出来了的。但是浏览器bug，关掉电脑，今天打开之后完美运行！很累，再见offer！

一楼爆照—>

输入分两行一行为n, 表示要删除的位数，一行为大整数。输出，大整数删除n位数字之后其他位置不变的情况下最大的数字。

样例输入

1
325

样例输出

35

解析：

哟今天下午什么都不想干，想起还有一个题没有做出来，嗯。灵感乍泄！
我们举个例子5 4 3 2 1 6 5 4。我们从左到右查看，5 4 3 2
1是降序前面肯定不能去掉。1<6,1去掉之后就可以将6提前一位。然后再从右开始
5 4 3 2 6 5 4中2<6去掉2。如果要去掉五个数字的话，去掉了4 3 2 1
之后，就剩下了5 6 5 4，再发现5 < 6，去掉5就好了。大概就是这样下面贴上源码

 function ch(str, n){
    var str = str;
    var len = str.toString().length;
    for(var i = len -1; i>=0; i--){
        arr[i] = str%10;
        str = (str - arr[i])/10;  //一直到这里都是为了处理输入的整数为数组
    }
    var arr = str;
    var len = str.length;
    arr = den(arr,n);   //这里才是正经的对数组删除相应的n位的数字
    var S = arr.join("");
    S = parseInt(S);
    console.log(S);
    return S;
}

function den(arr,n){   //每次从数组中删除一个数字得到当前最大数，并返回删除后的数组
      var len = arr.length;
      var n = n;
      for(var i = 0; i < n; i++){
          arr = de(arr);
      }
      return arr;
  }

function de(arr){   //每次删除时的具体逻辑，使用了splice函数，真的是相当便利呢。请原谅我的怠惰
     var len = arr.length;
     for(var i = 0; i< len; i++){
         if(arr[i] >= arr[i+1]){
             continue;
         }else if(arr[i] < arr[i+1]){
             arr.splice(i, 1);
             break;
         }
         if(i == len){
             arr.splice(i-1, 1);
         }
     }
     arr.length = len - 1;
     return arr;
 }

上面就是最近的那个算法，下面是另外安利一个我的一个做的动画的小demo。做完了之后全部推上去。

Mario

2016-09-22