W tym samouczku za pomocą przykładów nauczysz się wielowymiarowych tablic JavaScript.
Tablica wielowymiarowa to tablica zawierająca inną tablicę. Na przykład,
// multidimensional array const data = ((1, 2, 3), (1, 3, 4), (4, 5, 6));
Utwórz wielowymiarową tablicę
Oto, jak możesz tworzyć wielowymiarowe tablice w JavaScript.
Przykład 1
let studentsData = (('Jack', 24), ('Sara', 23), ('Peter', 24));
Przykład 2
let student1 = ('Jack', 24); let student2 = ('Sara', 23); let student3 = ('Peter', 24); // multidimensional array let studentsData = (student1, student2, student3);
Tutaj zarówno przykład 1, jak i przykład 2 tworzą wielowymiarową tablicę z tymi samymi danymi.
Dostęp do elementów tablicy
Możesz uzyskać dostęp do elementów tablicy wielowymiarowej za pomocą indeksów (0, 1, 2…) . Na przykład,
let x = ( ('Jack', 24), ('Sara', 23), ('Peter', 24) ); // access the first item console.log(x(0)); // ("Jack", 24) // access the first item of the first inner array console.log(x(0)(0)); // Jack // access the second item of the third inner array console.log(x(2)(1)); // 24
Możesz wyobrazić sobie tablicę wielowymiarową (w tym przypadku x) jako tabelę z 3 wierszami i 2 kolumnami.
Dostęp do wielowymiarowych elementów tablicy
Dodaj element do wielowymiarowej tablicy
Możesz użyć metody push () Array lub notacji indeksowania, aby dodać elementy do tablicy wielowymiarowej.
Dodawanie elementu do tablicy zewnętrznej
let studentsData = (('Jack', 24), ('Sara', 23),); studentsData.push(('Peter', 24)); console.log(studentsData); //(("Jack", 24), ("Sara", 23), ("Peter", 24)
Dodawanie elementu do wewnętrznej tablicy
// using index notation let studentsData = (('Jack', 24), ('Sara', 23),); studentsData(1)(2) = 'hello'; console.log(studentsData); // (("Jack", 24), ("Sara", 23, "hello"))
// using push() let studentsData = (('Jack', 24), ('Sara', 23),); studentsData(1).push('hello'); console.log(studentsData); // (("Jack", 24), ("Sara", 23, "hello"))
Możesz również użyć metody splice () tablicy Array, aby dodać element o określonym indeksie. Na przykład,
let studentsData = (('Jack', 24), ('Sara', 23),); // adding element at 1 index studentsData.splice(1, 0, ('Peter', 24)); console.log(studentsData); // (("Jack", 24), ("Peter", 24), ("Sara", 23))
Usuń element z wielowymiarowej tablicy
Możesz użyć metody pop () Array, aby usunąć element z tablicy wielowymiarowej. Na przykład,
Usuń element z tablicy zewnętrznej
// remove the array element from outer array let studentsData = (('Jack', 24), ('Sara', 23),); studentsData.pop(); console.log(studentsData); // (("Jack", 24))
Usuń element z wewnętrznej tablicy
// remove the element from the inner array let studentsData = (('Jack', 24), ('Sara', 23)); studentsData(1).pop(); console.log(studentsData); // (("Jack", 24), ("Sara"))
Możesz również użyć splice()metody, aby usunąć element o określonym indeksie. Na przykład,
let studentsData = (('Jack', 24), ('Sara', 23),); // removing 1 index array item studentsData.splice(1,1); console.log(studentsData); // (("Jack", 24))
Iteracja po wielowymiarowej tablicy
Możesz iterować po tablicy wielowymiarowej, używając metody forEach () Array do iteracji po tablicy wielowymiarowej. Na przykład,
let studentsData = (('Jack', 24), ('Sara', 23),); // iterating over the studentsData studentsData.forEach((student) => ( student.forEach((data) => ( console.log(data); )); ));
Wynik
Jacek 24 Sara 23
Pierwsza forEach()metoda służy do iteracji po zewnętrznych elementach tablicy, a druga forEach()do iteracji po wewnętrznych elementach tablicy.
Możesz również użyć for… ofpętli do iteracji po tablicy wielowymiarowej. Na przykład,
let studentsData = (('Jack', 24), ('Sara', 23),); for (let i of studentsData) ( for (let j of i) ( console.log(j); ) )
Możesz również użyć pętli for do iteracji po tablicy wielowymiarowej. Na przykład,
let studentsData = (('Jack', 24), ('Sara', 23),); // looping outer array elements for(let i = 0; i < studentsData.length; i++)( // get the length of the inner array elements let innerArrayLength = studentsData(i).length; // looping inner array elements for(let j = 0; j < innerArrayLength; j++) ( console.log(studentsData(i)(j)); ) )
