如何使用JavaScript转置二维数组？

给定一个二维数组（矩阵），如何使用JavaScript进行矩阵的转置？下面本篇文章就来给大家介绍一下使用JavaScript转置二维数组的方法，希望对大家有所帮助。

方法1：

●　将二维数组存储到变量中。

●　显示二维数组(矩阵)内容。

●　调用map()方法，它为数组中的每个元素提供一次回调函数，相对于数组对角线调换数组中元素的位置。

示例：使用array.map()方法

<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
	</head>

	<body style = "text-align:center;">  
      
        <p id = "Array" style = "font-size: 16px; font-family: sans-serif; font-weight: bold;"></p> 
          
        <button onclick = "Run()"> 点击这里</button> 
          
        <p id = "Array_DOWN" style = "color:green; font-size: 20px; font-weight: bold;"></p> 
          
        <script> 
            var el_up = document.getElementById("Array"); 
            var el_down = document.getElementById("Array_DOWN"); 
              
            var array = [ 
                            [1, 1, 1], 
                            [2, 2, 2], 
                            [3, 3, 3], 
                        ]; 
              
            el_up.innerHTML = "[ [ " + array[0] + " ] ], [ [ "  
                             + array[1] + " ] ], [ [ " + array[2] + " ] ]"; 
              
            function transpose(mat) { 
                for (var i = 0; i < mat.length; i++) { 
                    for (var j = 0; j < i; j++) { 
                        const tmp = mat[i][j]; 
                        mat[i][j] = mat[j][i]; 
                        mat[j][i] = tmp; 
                    } 
                } 
            } 
              
            function Run() { 
                array = array[0].map((col, i) => array.map(row => row[i])); 
                  
                el_down.innerHTML = "[ [ " + array[0] + " ] ], [ [ " 
                        + array[1] + " ] ], [ [ " + array[2] + " ] ]"; 
            }          
        </script>  
    </body>  
</html>

效果图：

方法2：

●　将二维数组存储到变量中。

●　将数组中的每个元素替换为其相对于数组对角线的镜像。

示例：创建一个函数，该函数用镜像替换每个元素以获取数组的转置。

<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
	</head>

	<body style = "text-align:center;">  
      
        <p id = "Array" style = "font-size: 16px; font-family: sans-serif; font-weight: bold;"></p> 
          
        <button onclick = "gfg_Run()"> 点击这里</button> 
          
        <p id = "Array_DOWN" style = "color:red; font-size: 20px; font-weight: bold;"></p> 
          
        <script> 
            var el_up = document.getElementById("Array"); 
            var el_down = document.getElementById("Array_DOWN"); 
              
            var array = [ 
                            [1, 1, 1], 
                            [2, 2, 2], 
                            [3, 3, 3], 
                        ]; 
              
            el_up.innerHTML = "[ [ " + array[0] + " ] ], [ [ " 
                    + array[1] + " ] ], [ [ " + array[2] + " ] ]"; 
              
            function transpose(mat) { 
                for (var i = 0; i < mat.length; i++) { 
                    for (var j = 0; j < i; j++) { 
                        const tmp = mat[i][j]; 
                        mat[i][j] = mat[j][i]; 
                        mat[j][i] = tmp; 
                    } 
                } 
            } 
              
            function gfg_Run() { 
                transpose(array); 
                el_down.innerHTML = "[ [ " + array[0] + " ] ], [ [ " 
                        + array[1] + " ] ], [ [ " + array[2] + " ] ]"; 
            }           
        </script>  
    </body>  
</html>

效果图：