JS實現冒泡排序，插入排序和快速排序并排序輸出

在一次面試中被問到了此問題，但是真是懵了，沒能回答上來，后來通過JS整理了一下，在結合html代碼做了一個文本框，把輸入的內容從文本框排序輸出，再次不做敘述了，下面通過一段代碼給大家展示下：

以下是代碼：

來給這個頁面寫點樣式，不然就太不好看了。

然后就是主要的功能實現了。

輸出按鈕 var inputnum = document.getElementById("number"); //數字輸入框 var resultlbl =document.getElementsByTagName("label"); //結果顯示的label var i,j,temp; //冒泡排序 var bubble = function(arr){ for(i=0;i<9;i++){ for(j=0;j<9-i;j++){ if(arr[j] > arr[j+1]){ temp = arr[j]; arr[j] = arr[j+1]; arr[j+1] = temp; } } } return arr; } //插入排序 var insersort = function(arr){ for(i=1;i<10;i++){ temp = arr[i]; j = i; while(j > 0 && arr[j-1] > temp){ arr[j] = arr[j-1]; j--; } arr[j] = temp; } return arr; } //快速排序 var quicksort = function(arr){ var basenum,basenumIndex; var left = []; var right = []; if(arr.length <= 1){ return arr; } //基準數的位置 basenumIndex = Math.floor(arr.length/2); basenum = arr.splice(basenumIndex,1)[0]; for(i=0;i<arr.length;i++){ if(arr[i] < basenum){ left.push(arr[i]); } else{ right.push(arr[i]); } } //遞歸調用 return quicksort(left).concat([basenum],quicksort(right)); } //判斷輸入的值類型是否為數字 function isNum(num){ var reNum =/^[0-9]+$/; return (reNum.test(num)); } //按鈕點擊事件 btn.onclick = function(){ //判斷輸入的值的類型和長度以及是否為空 if(!isNum(inputnum.value) || inputnum.value == "" || inputnum.value.length > 10 || inputnum.value.length < 10){ resultlbl[0].innerHTML = "Your format is wrong![Must Be 10 numbers]"; resultlbl[0].style.color = "red"; } else{ resultlbl[0].innerHTML = "After Sorted:"; resultlbl[0].style.color = "black"; var inputstream = inputnum.value.toString(); //將輸入的內容轉換為字符串 var data = inputstream.split(""); //將轉換的字符串分割，相當于轉化為數組 //結果輸出 resultlbl[1].innerHTML = "BubbleSort:" + "<br/>" + bubble(data); resultlbl[2].innerHTML = "InsertSort:" + "<br/>" + insersort(data); resultlbl[3].innerHTML = "QuickSort:" + "<br/>" + quicksort(data); } } }

最后的效果是這樣的：

未輸入情況下，一只安靜的文本框，一只安靜的按鈕和一個label：

輸入的不是數字，未輸入十位或者超出十位，或者為空，點擊按鈕之后，都會提示錯誤：

為空：

不是數字且不足十位：

超出十位：

輸入正確的情況下：

提示：輸入的數字之間不用加空格，輸入的數字之間不用加空格，輸入的數字之間不用加空格，重要的事情說三遍

需要注意的是文本框中輸入的數字只能是一位的數字（0-9），有關兩位數字甚至更多位數字的排序方法請繼續追蹤此網站。希望這些內容對大家有所幫助。

更多JS實現冒泡排序，插入排序和快速排序并排序輸出相關文章請關注PHP中文網！

聲明：本網頁內容旨在傳播知識，若有侵權等問題請及時與本網聯系，我們將在第一時間刪除處理。TEL:177 7030 7066 E-MAIL:11247931@qq.com