1

さて、私は並べ替えアプリケーションを作成しようとしていますが、それは私の頭を悩ませています。考えすぎたせいかもしれません。

私が欲しかったもの

  1. おそらくバブルソートを使用して、配列から値をソートしたい
  2. <tr>各反復をテーブルにプッシュしたい
  3. どの値が置き換えられたかを知ることができます

何が起こらなければならないか

  1. 反復ごとに、値のリストを取得します
  2. 各リストは、影響を受ける値を強調表示します

私が現在持っているもの

var sort = {
    init : function() {
        sort.vars.$oldList = [6,4,7,1,8];
        sort.play.bubble();
    }
}

sort.vars =  {
    $oldList : new Array(),
    $newList : new Array()
}

sort.play = {
    bubble : function() {
        var list = sort.vars.$oldList;
        var n = list.length;
        var isSorted = false;
        while(!isSorted) {
            var tmp, i;
            isSorted = true;
            for (i = 0; i < n; i++) {
                if (list[i] > list[i+1]) {
                    tmp = list[i];
                    list[i] = list[i+1];
                    list[i+1] = tmp;
                    isSorted = false;
                }
                sort.ui.pushtToTable(list);
            }
        }        
    }
}

sort.ui = {
    pushtToTable : function(list) {
        $.each(list, function(n, val){
            $('tr').append('<td>' + val);
        })
    }
}

$(document).ready(function(){
    sort.init();
})

可能であれば、タイムアウトを設定して、値を 1 つずつ表示したかったのではないでしょうか。

4

1 に答える 1

3

はい、setTimeoutアルゴリズムの進行状況を「見たい」場合は良い考えです。ただし、setTimeout引数として関数のみを受け入れるため、並べ替えアルゴリズムの各反復は別の関数で実行する必要があります。例については、次のコードを参照してください (コードは各反復で出力を生成するのではなく、代わりにスワッピング アクションを「アニメーション化」しますが、ニーズに合わせてこれを簡単に調整できると確信しています)。

デモ(JSFiddle) 

var SORT = function(type, list, selector){
    var container, containerTr, animSteps = [];
    // Show all elements in the container
    var printArray = function(list){
        var str = ["<table>"], i = 0, l = list.length;
        for (i; i < l; ++i) {
            str.push("<tr><td>", list[i], "</td></tr>");
        }
        str.push("</table>");
        container.html(str.join(""));
    };
    // This is the interesting part... ;)
    var swap = function(list, i1, i2) {
        var tmp = list[i1];
        list[i1] = list[i2];
        list[i2] = tmp;
        // Add 3 functions for each swapping action:
        // 1. highlight elements, 2. swap, 3. remove highlight
        animSteps.push(function(){
            containerTr.eq(i1).add(containerTr.eq(i2)).addClass("highlight");
        }, function(){
            var tmp = containerTr.eq(i1).text();
            containerTr.eq(i1).text(containerTr.eq(i2).text());
            containerTr.eq(i2).text(tmp);
        }, function(){
            containerTr.eq(i1).add(containerTr.eq(i2)).removeClass("highlight");
        });
    };
    var animation = function(){
        // Execute all iteration functions one after another
        if (animSteps.length) {
            setTimeout(function(){
                animSteps.splice(0,1)[0]();
                animation();
            }, 250);
        }
    };

    // Collection of sorting algorithms
    var algorithms = {
        bubblesort: function(list) {
            for (var n = list.length; n > 1; --n) {
                for (var i = 0; i < n-1; ++i) {
                    if (list[i] > list[i+1]) {
                        swap(list, i, i+1);
                    }
                }
            }
        }
        // Add more algorithms using "swap" here...
    };

    if (algorithms[type] != undefined) {
        container = $(selector);
        printArray(list);
        containerTr = container.find("tr");
        algorithms[type](list);
        this.sorted = list;
        animation();
    }
};

// Usage:
var s = new SORT("bubblesort", [5,8,2,4,1,9,7,3,0,6], "#container");
console.log(s.sorted);    //the sorted array
于 2013-02-10T22:28:36.583 に答える