我有一個一維陣列,代表一個二維網格。行和列的數量是已知的。它從 "左上角 "讀到 "右下角",所以第一項是R1C1,最后一項是RXCY(其中X=行數,Y=列數;
我的目標是 "翻轉 "或 "旋轉 "二維陣列,并回傳一個新的一維陣列,代表轉換結果。我嘗試了位操作,但由于行/列的數量可能是奇數或偶數,因此無法使其發揮作用。我還嘗試了一種迭代的方法,但在邏輯的雜草中迷失了方向。
一個最小的javascript例子:在一個9項陣列中的一個3^3的booleans網格,以及我正在糾結的三個函式的占位符:
。let startingArray =
[true, false, false,
true, true, true,
false, false, false]。
let rows = 3;
let cols = 3;
function flipVertical(arrayToFlip){
//Logic to replace here[/span]。
let flippedArray = arrayToFlip;
return flippedArray;
function flipHorizontal(arrayToFlip){
//Logic to replace here[/span]。
let flippedArray = arrayToFlip;
return flippedArray;
function rotate90Clockwise(arrayToRotate){
//Logic to replace here[/span]。
let rotatedArray = arrayToRotate;
return rotatedArray ;
}
console.log(flipVertical(startingArray))。
//應該回傳。
// false, false, false, .
//true, true, true,
//true, false, false
console.log(flipHorizontal(startingArray))。
//應該回傳。
// false, false, true, .
//true, true, true,
//假的,假的,假的。
console.log(rotate90Clockwise(startingArray))。
//應該回傳。
/false, true, true, 。
//false, true, false,
//false, true, false
<iframe name="sif1" sandbox="allow-forms allow-modals allow-scripts" class="snippet-box-edit snippet-box-result" frameborder="0"></iframe>
uj5u.com熱心網友回復:
對于一個基本的迭代,你可以通過行進行回圈,并且在每一行中,通過列進行回圈。
關鍵部分是:
arr[r * cols c] 。
從一個 "復制 "函式開始,簡單地在行數或列數和列數之間回圈
let rows = 3;
let cols = 3;
并推送給一個新的陣列
function duplicate(arr) {
var result = [] 。
for (var r = 0; r < rows; r ) {
for (var c = 0; c < cols; c ) {
result.push(arr[r * cols c])。
}
}
return result。
}
然后你可以操作這個基本的迭代來倒轉行(flipVertical):
for (var r = rows - 1; r >= 0; r-) {
或者反轉列(flipHorizontal)
for (var c = cols - 1; c >= 0; c-) {
要旋轉,你把r * cols c換成c * rows r,這取決于你想以何種方式旋轉
給定:
let startingArray = [true, false, false,
true, true, true,
false, false, false.
];
let rows = 3;
let cols = 3;
console.log(startingArray)。
console.log(duplicate(startingArray))。
console.log(flipVertical(startingArray))。
console.log(flipHorizontal(startingArray))。
console.log(rotate90Clockwise(startingArray))。
function duplicate(arr) {
var result = [] 。
for (var r = 0; r < rows; r ) {
for (var c = 0; c < cols; c ) {
result.push(arr[r * cols c])。
}
}
return result。
}
function flipVertical(arr) {
var result = [] 。
for (var r = rows - 1; r >= 0; r -) {
for (var c = 0; c < cols; c ) {
result.push(arr[r * cols c])。
}
}
return result。
}
function flipHorizontal(arr) {
var result = [] 。
for (var r = 0; r < rows; r ) {
for (var c = cols - 1; c >=0; c-) {
result.push(arr[r * cols c])。
}
}
return result。
}
function rotate90Clockwise(arr) {
var result = [];
for (var r = 0; r < rows; r ) {
for (var c = cols - 1; c >=0; c-) {
result.push(arr[c * rows r])。
}
}
return result。
}
<iframe name="sif2" sandbox="allow-forms allow-modals allow-scripts" class="snippet-box-edit snippet-box-result" frameborder="0"></iframe>
uj5u.com熱心網友回復:
這里有一個flipVertical的例子。
基本上我創建了2個函式來將陣列索引映射到col/row并回傳。
我還創建了一個函式來轉換一個陣列,使用一個函式將一個索引映射到另一個索引。
所以為了創建flipVertical我寫了這樣的邏輯:
- 將原始索引映射到柱子上。
- 映射原始索引到col/row
- 計算新的行(如果需要的話,還有col)
- 將新的行/列映射到新的索引 。
對于那里,我認為你可以寫其他的函式:)
。let startArray =
[true, false, false,
true, true, true,
false, false, false]。
let rows = 3;
let cols = 3;
function transformArray(originalArray, indexMapFn) {
const resultArray = originalArray.concat()。
for (let i = 0; i < originalArray.length; i ) {
resultArray[i] = originalArray[indexMapFn(i)]。
}
return resultArray;
}
function mapIndexToColRow(i) {
const row = Math.floor(i / cols)。
const col = i % cols;
return { row, col };
}
function mapColRowToIndex(col, row) {
return row * cols col;
}
function flipVertical(arrayToFlip) {
return transformArray(arrayToFlip, (i) => {
const { row, col } = mapIndexToColRow(i)。
const pivotRow = (rows-1)/ 2;
const distToPivot = pivotRow - row;
const newRow = pivotRow distToPivot;
//一旦你得到了這個邏輯,你就可以簡化為:
//newRow = (rows - 1) - row
return mapColRowToIndex(col, newRow)。
});
}
console.log(flipVertical(startingArray))。
//應該回傳。
// false, false, false, .
//true, true, true,
// true, false, false
<iframe name="sif3" sandbox="allow-forms allow-modals allow-scripts" class="snippet-box-edit snippet-box-result" frameborder="0"></iframe>
轉載請註明出處,本文鏈接:https://www.uj5u.com/qiye/308797.html
標籤:
