このpsudocodeブロックをループに最適化するにはどうすればよいですか？

Question

私は9箱にスドックグリッドをグループ化しようとしています。私は列と行を配列していますが、効率的なボックス配列のコード方法を考えることはできません。 私が探していた擬似はこれです：

 add rowArray0 entries 0,1,2 to boxArray0 
     add rowArray1 entries 0,1,2 to boxArray0 
     add rowArray2 entries 0,1,2 to boxArray0 

     add rowArray0 entries 3,4,5 to boxArray1 
     add rowArray1 entries 3,4,5 to boxArray1 
     add rowArray2 entries 3,4,5 to boxArray1 

     add rowArray0 entries 6,7,8 to boxArray2 
     add rowArray1 entries 6,7,8 to boxArray2 
     add rowArray2 entries 6,7,8 to boxArray2 

     add rowArray3 entries 0,1,2 to boxArray3 
     add rowArray4 entries 0,1,2 to boxArray3 
     add rowArray5 entries 0,1,2 to boxArray3 

     add rowArray3 entries 3,4,5 to boxArray4 
     add rowArray4 entries 3,4,5 to boxArray4 
     add rowArray5 entries 3,4,5 to boxArray4 

     add rowArray3 entries 6,7,8 to boxArray5 
     add rowArray4 entries 6,7,8 to boxArray5 
     add rowArray5 entries 6,7,8 to boxArray5 

     add rowArray6 entries 0,1,2 to boxArray6 
     add rowArray7 entries 0,1,2 to boxArray6 
     add rowArray8 entries 0,1,2 to boxArray6 

     add rowArray6 entries 3,4,5 to boxArray7 
     add rowArray7 entries 3,4,5 to boxArray7 
     add rowArray8 entries 3,4,5 to boxArray7 

     add rowArray6 entries 6,7,8 to boxArray8 
     add rowArray7 entries 6,7,8 to boxArray8 
     add rowArray8 entries 6,7,8 to boxArray8 

これはばかげた質問のように思える場合はすみませんが、私はちょうどループの等価を把握するのに十分なスマートではありませんよ。 賢い人が私に解決策を示すことができますか？

編集は、行と列のアレイ構造を追加する：

<table> 
<tr class="r0"> 
<td contenteditable="true" class="c0" onkeyup="inputFilter(this)">1</td> 
<td contenteditable="true" class="c1" onkeyup="inputFilter(this)">2</td> 
<td contenteditable="true" class="c2" onkeyup="inputFilter(this)">3</td> 
<td contenteditable="true" class="c3" onkeyup="inputFilter(this)">4</td> 
<td contenteditable="true" class="c4" onkeyup="inputFilter(this)">5</td> 
<td contenteditable="true" class="c5" onkeyup="inputFilter(this)">6</td> 
<td contenteditable="true" class="c6" onkeyup="inputFilter(this)">7</td> 
<td contenteditable="true" class="c7" onkeyup="inputFilter(this)">8</td> 
<td contenteditable="true" class="c8" onkeyup="inputFilter(this)">9</td> 
</tr> 
<tr class="r1"> 
etc 

<script> 
     //columns 
     for(i=0;i<9;i++){ 
      str = "c" + i; 
      allCols[i] = document.getElementsByClassName(str); 
     } 

     //rows 
     for(i=0;i<9;i++){ 
      rowArray = new Array(); 
      for(ii=0;ii<9;ii++){ 
       colArray = allCols[ii]; 
       elem = colArray[i]; 
       rowArray[ii] = elem; 
      } 
      allRows[i] = rowArray; 
     } 

だからCOLSは、左から右へ、上から下へです。 行が右から左に、上から下に向かって表示されます。 複数配列の必要性に関するコメントには、これが各構造を参照する最良の方法ではないでしょうか？私はhtml要素を見つけるために毎回数学を使うことができると思いますが、initで配列にグループ化するのは理にかなっています...多分私は間違っていますか？ getElementsByClassNameを配列にグループ化する方法に対する反応だったと思います。私はそれらを1次元配列に解凍することができましたが、なぜですか？

Answer 1

基礎となるデータモデルとその表現との明確な分離は、常に有用です。

• スドクは9 x 9の数字のマトリックスと考えることができます。行列は、その列または行を長い1次元シーケンスに連結することによって、9×9要素の平坦な配列として表すことができる。スドクジェネレータまたはソルバを実装する予定の場合は、線形代数ライブラリと互換性のあるフォーマットを選択することをお勧めします。

• スドクの視覚的表現は、通常、9 x 9テーブルの3 x 3ブロックに配置された数字を含みます。

簡単な非対話型の例：これはJavaScriptに関連しているか

function getNumberAt(numbers, x, y) { 
 
    return numbers[x + 9 * y]; 
 
} 
 

 
function setNumberAt(numbers, x, y, value) { 
 
    return numbers[x + 9 * y] = value; 
 
} 
 

 
function render(numbers, table) { 
 
    let tbody = document.createElement('tbody'); 
 
    for (let x = 0; x < 9; ++x) { 
 
    let tr = document.createElement('tr'); 
 
    for (var y = 0; y < 9; ++y) { 
 
     let td = document.createElement('td'); 
 
     td.textContent = getNumberAt(numbers, x, y); 
 
     tr.appendChild(td); 
 
    } 
 
    tbody.appendChild(tr); 
 
    } 
 
    table.appendChild(tbody); 
 
} 
 

 
// Example: 
 
const numbers = new Array(9 * 9); 
 
setNumberAt(numbers, 0, 0, 1); 
 
setNumberAt(numbers, 0, 1, 2); 
 
setNumberAt(numbers, 1, 0, 3); 
 
setNumberAt(numbers, 8, 8, 9); 
 
render(numbers, document.getElementById('sudoku'));

#sudoku td { 
 
    border: thin black solid; 
 
    width: 1em; 
 
    height: 1em; 
 
} 
 

 
#sudoku td:nth-child(3n) { 
 
    border-right: thick black solid; 
 
} 
 

 
#sudoku tr:nth-child(3n) td { 
 
    border-bottom: thick black solid; 
 
}

<table id="sudoku"></table>