モダンJavaScript入門-ライフゲームシミュレータ(2 D配列の作成)


モダンjavascript入門の17章には生命ゲームシミュレータの例がある.
この例では、画面のviewに表示される配列を生成する部分があります.コードは次のとおりです.
// 격자의 크기
	state.nx = nx;
	state.ny = ny;
	// 셀의 상태를 저장하는 2차원 배열을 생성하고 초기화한다
	state.cells = new Array(ny);
	for(var ix=0; ix<nx; ix++) {
		state.cells[ix] = new Array(ny);
		for(var iy=0; iy<ny; iy++) {
			state.cells[ix][iy] = 0;
		}
	}
ここで、nxおよびnyの初期値は、特定の関数によって78および60として指定される.78は水平画素の個数、60は垂直画素の個数を表す.横方向に少し長いビューを生成します.
でもここで疑問が出てきました横78、縦60
state.cells = new Array(ny); アレイの作成を初めて使用します.
次に、for文はaixを0からnxに移動します.すなわち,配列のサイズは60であり,下部ではfor文がaixを0から78に回転させ,stateまで回転させる.cells[ix]を介して60を超えるインデックス77に近づいている.
これは初めて混乱した部分です.Javascriptを学ぶ前に他の静的なタイプの言語に慣れていたためか、javascriptの特殊なセクシーさに困惑していた.実際、勉強しているうちに、変な文がいくつかあります.以前は許可されていなかった文法はJavaScriptで許可されていますか?だから混同しないように(特に静的タイプを再利用する場合はミスしないように)努力しています.
とにかく話が長くなって、どうして配列の長さを超えても分配できるのか気になったので、ジャルスの配列の分配方法を探してみましたが、長さはあまり関係ないことに気づきました.デブの場合、arrayindexoutofboundexceptionが発生する可能性がある場合、その値をすべてundefindと指定して簡単にスキップする場合もあります.
その後、直接テストを行い、結果は以下の通りです.

これは、最初のコードを移植して変数ごとに実際の値を割り当ててテストした結果です.iiはより小さいがixのようにいくつかの要素を生成した.その結果,iy値がいくらであってもfor文の回数の要素のみが生成される.
だから写真の中のコードの中でvarar=newArray(iy);どうして存在するの?こんな考えが生まれたから、無駄ではないかもしれないと思います.したがって,この(役に立たないと思われるコード)コードは有用であると結論した.必須var arrはまず配列しなければならないからです.逆にnew Array()では括弧内の任意のパラメータを入れることができます.var arrが配列されていることを示すコードはすべて必要です.(このようにしてこそ順番に操作できるので)
とにかくここまでは焦りだったので今は疑問のある部分を正式に整理しておきます
Postingの先頭のコードに戻ります.
for文stateで.celles[ix] = new Array(ny); 生成中です.すなわち、横78の配列が生成される.
そしてfor文を重ねることでiyのようにstateします.cells[ix][iy]=0は初期化中です.すなわち,78要素ごとに60要素の配列が出現する.(2 D配列)
しかし、ここでよく観察すると、疑問が生じる.
生成された配列の構造は次のとおりです.

60ビット配列は78個.でも横に60個?縦78個?だから、私たちがもともとしなければならないユニットにとって、横は78個で、縦は60個であるべきです.しかし,本当にコードによって生成されるのは行列反転の配列である.
コードは間違っていないはずです(まさか間違っていますか?)本当に実行すれば、表示されると思いますよ~周正常.
だから悩んで、間もなく答えを得ました.
その直接的な原因は以下の通りである.これは、2 D配列を生成し、配列内で特定の要素を呼び出す方法と、ビュー内で特定のセル座標を呼び出す方法の違いです.
2 D配列があると仮定します.

配列arrが上記の配列を生成したと仮定すると、最初の行の3番目の要素にアクセスすると、次の内容が使用されます.
arr[0][2]
2行目の4番目の要素の場合は、次のようになります.
arr[1][3]
今はゆっくりと感じられるかもしれません.
では、view、すなわち画面上の画素が近づくと、以下に示すように座標をどのように撮影するかを示します.
2,0
3,1
1位はx、2位はyです.(これは、ピクセルの左上隅が0、0で、右下隅の値が大きいためです.)
したがって、画素に座標を表示する方式と、画素情報を含んで生成された配列の要素を呼び出す方式は逆である.(x,yは反対です.)
我々が生成したstateは最後にcellsがviewのピクセルでどのように動作しているかを理解します.

(赤字はインデックスを表しません.絶対!、赤字は実際のビューピクセルを表します.)
これは、画素におけるx,y呼び出し方式と完全に一致する.
うん.これは理解できないので、私はずっと考えています.それとも、特定の座標が頭の中にあると仮定して、配列から画素がどのように流れているのかを考えて、解決しました.
しかし、この方法で使うのは初めて見ました.これもまだ経験がないかららしい.これがスタッフと学生の学習レベルが異なる理由です.各要素の制御方法や、特定の状況で使用されるプログラミングテクニックなど...そんなのは自分で編んだことがない限り、知りません.本には載っていないので、なぜかずっと考えなければなりません.
とにかく本当に何行もないハーモニーが面白かったです学んだことも多く、JavaScriptは見れば見るほど特殊な言語だと感じます.とにかく、面白いテクニックを見て嬉しいです.(ん…技法?ちょっと考えれば出てきます.でも私は回り道をしすぎました.画素座標を全く考えていないのが時間がかかった理由です.)
本もいい本です.