js演算法：分治法-歸併排序之合併有序陣列
阿新 • • 發佈：2019-02-10
合併有序陣列是合併排序重要的一步，下面js演示了每一步的操作過程
附程式碼：
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"> <HTML> <HEAD> <TITLE> js合併有序陣列 </TITLE> <META NAME="Generator" CONTENT="EditPlus"> <META NAME="Author" CONTENT=""> <META NAME="Keywords" CONTENT=""> <META NAME="Description" CONTENT=""> <script type="text/javascript" src="jquery-1.7.2.min.js"></script> <script type="text/javascript" src="json2.js"></script> <style> table,td{ border:1px solid gray; text-align:center; color:white; } </style> <script> var arr1,arr2; var i,hi; var mid; var k; var aux; var j; var array; function mergin(){ var arr1_str=$("#arr1").val(); var arr2_str=$("#arr2").val(); arr1=arr1_str.split(","); arr2=arr2_str.split(","); //alert(arr1_str+","+arr2_str); $("#lab1,#lab2").text(arr1_str+","+arr2_str); hi=arr1.length+arr2.length-1; mid=arr1.length-1; aux=$("#lab1").text().split(","); j=mid+1; array=$("#lab1").text().split(","); i=0; k=0; $("#detail").html(''); } function nextStep(){ //var array=$("#lab2").text().split(","); if(k<=hi){ if(i>mid){//左邊的資料沒有了，直接拷貝右邊的資料 $("#detail").append(k+"：i="+(i)+"; j="+(j)+"; array[k]="+array[k]+"<br/>"); array[k]=aux[j++]; }else if(j>hi){//右邊資料沒有，直接拷貝左邊的資料 $("#detail").append(k+"：i="+(i)+"; j="+(j)+"; array[k]="+array[k]+"<br/>"); array[k]=aux[i++]; }else if(parseInt(aux[i])<parseInt(aux[j])){//左邊資料比右邊小，拷貝左邊資料 $("#detail").append(k+"：aux["+(i)+"]="+aux[i]+"<aux["+(j)+"]="+aux[j]+"; array[k]="+array[k]+"<br/>"); array[k]=aux[i++]; }else{ $("#detail").append(k+"：aux["+(i)+"]="+aux[i]+">=aux["+(j)+"]="+aux[j]+"; array[k]="+array[k]+"<br/>"); array[k]=aux[j++]; } k++; $("#lab2").text(array.join()); }else{ $("#detail").append("合併排序結束<br/>"); alert("合併排序結束！"); } } //一鍵合併 function mergeArr(){ mergin(); for(var a=0;a<=hi;a++){ if(i>mid){ $("#detail").append(a+"：i="+(i)+"; j="+(j)+"; array[k]="+array[a]+"<br/>"); array[a]=aux[j++]; }else if(j>hi){ $("#detail").append(a+"：i="+(i)+"; j="+(j)+"; array[k]="+array[a]+"<br/>"); array[a]=aux[i++]; }else if(parseInt(aux[i])<parseInt(aux[j])){ $("#detail").append(a+"：aux["+(i)+"]="+aux[i]+"<aux["+(j)+"]="+aux[j]+"; array[k]="+array[a]+"<br/>"); array[a]=aux[i++]; }else{ $("#detail").append(a+"：aux["+(i)+"]="+aux[i]+">=aux["+(j)+"]="+aux[j]+"; array[k]="+array[a]+"<br/>"); array[a]=aux[j++]; } } $("#lab2").text(array.join()); $("#detail").append("合併排序結束<br/>"); alert("合併排序結束！"); } </script> </HEAD> <BODY style="text-align:center"> 陣列一： <input type="text" name="arr1" id="arr1" style="width:600px" value="1,3,4,12,33,34"/> <br/> 陣列二： <input type="text" name="arr2" id="arr2" style="width:600px" value="4,4,12,35,67,87"/> <br/> <input type="button" value="初始化" onclick="mergin()"/> <input type="button" value="逐步合併" onclick="nextStep()"/> <input type="button" value="一鍵合併" onclick="mergeArr()"/> <br/> 合併初始陣列：<label id="lab1"></label><br/> 合併結果陣列：<label id="lab2"></label><br/> <div id="detail" style="border:1px solid blue;width:500px;height:100%;margin:0 auto;text-align:left;padding-left:20px;"> </div> </BODY> </HTML>