JS實現順時針列印陣列

xiaoxiao亮發表於2017-03-18
JS陣列

序

今天中午吃飯的時候，遇到了一位同學，平時關係還算不錯，最近他在準備面試，有一道面試題提了出來，就是關於5*5矩陣順時針列印的問題。他是學習C語言和c++語言的，而我主要學習JavaScript。但是這有什麼關係。這道題主要考察的是演算法和判斷邊界問題。不論什麼語言都可以實現的。每一門語言都有其獨特的解決問題的場景，比如我學的JavaScript，在瀏覽器這塊沒有其他語言比它更加合適了。學習語言到最後，基本上核心就是演算法和資料結構。新的問題產生，如何用簡單高效的方法用語言解決，這是需要不斷學習的。

過程

在吃飯的時候想了想。第一個想法就是用陣列表示矩陣，然後遍歷陣列，重新組成一個新的字串，就得到我們想要的結果了。這個思路很簡單，就是不斷遍歷，將外圍的一圈遍歷完後，繼續裡面的一圈。而且需要判斷邊界問題。這也是自己在最後才明白這道面試題的考察點。吃飯結束後，回來在電腦上試了試，最開始就卡在二維陣列的問題上，JavaScript中是動態陣列，與之前學習的C語言陣列還是有點區別的。於是取巧，再函式內宣告一個陣列，不需要再次輸入。原本面試題還需要輸入陣列，然後再得出結果的。這個就不是重點了，重要的是如何將陣列順時針列印出來。
反正就是慢慢試，將一個3*3陣列慢慢列印出來，用了四個for迴圈。沒有考慮邊界檢查，也沒有函式的概念，結果是出來了，雖然是3*3陣列，但是距離5*5還遠嗎？
確實，需要承認的是，還有好遠的額！我那個程式碼我都不想再看了，實在有點糟糕。沒有邊界檢查，很容易出現錯誤，而且如果變成4*4或者其他的，就又要寫一堆的廢程式碼。接下來認真想了想，於是將處理過程放在一個函式中，並用遞迴的思想將其實現。程式立馬不一樣了，提高了可用性。

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>順時針列印陣列</title>
</head>
<body>
    <script type="text/javascript">
        window.onload = function() {

        var columns=4,rows=4,start=0;//行 列 起始位置
        var array=[[1,2,3,4],[5,6,7,8],[9,10,11,12],[13,14,15,16]];//定義二維陣列
        var result=new Array();
        printArray(array,columns,rows,start);
        document.write(result.split(","))
        function printArray(array,columns,rows,start){

            if(columns < 1 || rows < 1 || start < 0 )   
              return;  
            if( columns <= 2*start || rows <= 2*start )   
              return;  

            var stopX = columns - 1 - start;//一圈最右列在座標中的位置  
            var stopY = rows - 1 - start;//一圈最大行在座標中位置  

            //列印此圈中的最上行  
            for(var i=start; i<=stopX; i++)  
              result+=array[start][i]+",";  
            //列印此圈中的最右列  
            if(start < stopX) //如果此圈中不止有一列  
            for(var i=start+1; i<=stopY; i++) 
              result+=array[i][stopX]+",";  
             //列印次圈中的最下行  
            if(start < stopX && start < stopY)  
            for(var i=stopX-1; i >= start; i--)  
              result+=array[stopY][i]+",";

            //列印次圈中的最左行  
            if(start < stopX && start < stopY - 1)  
            for(var i=stopY-1; i >= start+1; i--) 
              result+=array[i][start]+","; 

            printArray(array,columns,rows,start+1);//下一圈迴圈       
        }
    }
    </script>
</body>
</html>

結果

測試結果沒有問題，當然這個問題還有不用遞迴的解法，暫時就寫在這裡，歡迎各位大神指點程式碼不足之處，共同進步。

相關文章