js算法：分治法-归并排序之合并有序数组

最新推荐文章于 2022-05-06 22:26:08 发布

推敲

最新推荐文章于 2022-05-06 22:26:08 发布

阅读量3.9k

点赞数 2

分类专栏： web开发文章标签：合并有序数组合并排序 js演示

本文链接：https://blog.csdn.net/jrn1012/article/details/47865689

版权

web开发专栏收录该内容

24 篇文章 1 订阅

订阅专栏

合并有序数组是合并排序重要的一步，下面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="初始化" οnclick="mergin()"/>
	<input type="button" value="逐步合并" οnclick="nextStep()"/>
	<input type="button" value="一键合并" οnclick="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>