Witam,
Trafiłem na 2 przykłady kodu JS które nie rozumiem jak działają. Może mi ktoś wytłumaczyć mi jak to działa? Są to dwie tablice, dwie pętle i zasieg.
W 1 wersji jest zasieg globalny, tablica ROW jest na zewnątrz pętli FOR 1 lvl. W 2 wersji jest zasięg lokalny, tablica ROW jest wewnątrz pętli FOR 1 lvl.
Od razy uprzedzam, że kod dla tych przykładów jest złożony i długi. Starałem się moimi słowami krok po kroku opisać jak powinien on według mnie działać, tak aby to było dobrze zrozumiałe dla osób to czytających. Jeśli coś napisałem niejasno to napiszcie, to spróbuje to lepiej wytłumaczyć.
Z góry dziekuję za pomoc.
Budowa: najpierw podaje kod, potem opisuje co kod robi i na końcu jaki jest problem.
Wersja 1
function zeroArray(m, n) {
let newArray = [];
let row = []; // zasieg globalny
for (let i = 0; i < m; i++) {
for (let j = 0; j < n; j++) {
row.push(0);
}
newArray.push(row);
console.log(newArray)
}
return newArray;
}
let matrix = zeroArray(3, 2);
console.log(matrix);
Opis:
Funkcja ma 2 parametry: ‘m’ dla 1 lvl for i ‘n’ dla 2 lvl for.
Według mojego zrozumienia kod powinien działać tak:
idzie od góry, jest 1 obrót pętli FOR 1 lvl.
W niej petla 2 lvl do tablicy ‘row’ dodaje dwa razy ‘0’, więc teraz jest w ‘row’ [0,0].
Dalej dodaje do tablicy ‘newArray’ treść z ‘row’, czyli w ‘newArray’ jest teraz: [ [0,0] ].
koniec 1 obrotu pętli FOR 1 lvl.
Nastepuje 2 obórt petli FOR 1 lvl.
UWAGA: Tablica ‘row’ ma zasieg globalny więc po 1 oborcie petli FOR 1 lvl ta tablica ma już tresc i jest to: [0,0].
Petla FOR 2 lvl dodaje do niej dwa razy ‘0’, więc ‘row’ ma teraz wartosc [0,0 , 0,0].
Dalej dodaje do tablicy ‘newArray’ treść z ‘row’. Po 1 obrocie petli FOR 1 lvl w ‘newArray’ jest [0,0]. W tym obrocie ‘row’ ma wartosc [0,0 , 0,0]. Dlatego: teraz będzie: [ [0,0] ,[0,0 , 0,0] ].
koniec 2 obrotu pętli FOR 1 lvl.
Nastepuje 3 obórt petli FOR 1 lvl.
UWAGA: Tablica ‘row’ ma zasieg globalny więc po 2 oborcie petli FOR 1 lvl ta tablica ma już tresc i jest to: [0,0,0,0].
Petla FOR 2 lvl dodaje do niej dwa razy ‘0’, więc ‘row’ ma teraz wartosc [0,0 , 0,0 , 0 ,0 ].
Dalej dodaje do tablicy ‘newArray’ treść z ‘row’. Po 2 obrocie petli FOR 1 lvl w ‘newArray’ jest [ [0,0] ,[0,0 , 0,0] ].
W tym obrocie ‘row’ ma wartosc [0,0 , 0,0 , 0,0]. Dlatego: teraz będzie: [ [0,0] ,[0,0 , 0,0] , [0,0 , 0,0 ,0 , 0] ].
koniec 3 obrotu pętli FOR 1 lvl
Na koniec funkcji dla ‘return newArray’ zwraca: [ [0,0 , 0,0 ,0,0] , [0,0 , 0,0 ,0,0] , [0,0, 0,0 ,0,0] ].
Problem:
Moje pytanie: czemu zwraca taki wynik, skoro według mnie powinno być:
[ [0,0] ,[0,0 , 0,0] , [0,0 , 0,0 ,0,0]] ?
wersja 2
function zeroArray2(m, n) {
let newArray = [];
for (let i = 0; i < m; i++) {
let row = []; // zasieg lokalny
for (let j = 0; j < n; j++) {
row.push(0);
}
newArray.push(row);
console.log(newArray)
}
return newArray;
}
let matrix2 = zeroArray2(3, 2);
console.log(matrix2);
Opis
Funkcja ma 2 parametry: ‘m’ dla 1 lvl for i ‘n’ dla 2 lvl for.
Według mojego zrozumienia kod powinien działać tak:
idzie od góry, jest 1 obrót pętli FOR 1 lvl.
W niej petla 2 lvl do tablicy ‘row’ dodaje dwa razy ‘0’, więc teraz jest w ‘row’ [0,0].
Dalej dodaje do tablicy ‘newArray’ treść z ‘row’, czyli w ‘newArray’ jest teraz: [ [0,0] ].
koniec 1 obrotu pętli FOR 1 lvl.
Nastepuje 2 obórt petli FOR 1 lvl.
Tablica ‘row’ jest wyczyszczona (bo tablica jest zmienna lokalna), więc jest pusta. Petla FOR 2 lvl dodaje do niej dwa razy ‘0’, więc ‘row’ ma teraz wartosc [0,0].
Dalej dodaje do tablicy ‘newArray’ treść z ‘row’. Po 1 obrocie petli FOR 1 lvl w ‘newArray’ jest [0,0], więc teraz będzie: [ [0,0] ,[0,0] ].
koniec 2 obrotu pętli FOR 1 lvl.
Nastepuje 3 obórt petli FOR 1 lvl.
Tablica ‘row’ jest wyczyszczona, więc jest pusta. Petla FOR 2 lvl dodaje do niej dwa razy ‘0’, więc ‘row’ ma teraz wartosc [ [0,0] ].
Dalej dodaje do tablicy ‘newArray’ treść z ‘row’. Po 2 obrocie petli FOR 1 lvl w ‘newArray’ jest [ [0,0] ,[0,0] ], więc teraz będzie: [ [0,0] ,[0,0] ,[0,0] ].
koniec 3 obrotu pętli FOR 1 lvl
Na koniec funkcji dla ‘return newArray’ zwraca: [ [0,0] ,[0,0] ,[0,0] ].
Problem:
Kod działa zgodnie z założeniem, ale: dla każdego obrotu pętli FOR 1 lvl (poziomu) ‘console.log(newArray)’ pokazuje w konsoli taka tresc jaka ta tablica powinna mieć na koniec wykonania kodu, tak gdzie jest ‘return newArray’.
Powinno to pokazywac:
[ [0,0] ].
[ [0,0] ,[0,0] ].
[ [0,0] ,[0,0] ,[0,0] ].
Zamiast tego pokazuje 3 razy ta treść:
[ [0,0] ,[0,0] ,[0,0] ].
Czemu tak jest? Jakby wypisywało przy każdym ‘console.log’ wartość jaka tablica będzie mieć na końcu wykonania kodu.
Codepen dodatkowo
https://codepen.io/luk21/pen/RwoBZyL