Lấy dữ liệu từ JavaScript mảng lồng nhau

Mảng nhiều chiều là một loại cấu trúc dữ liệu lồng nhau đặc biệt, bao gồm một mảng, mỗi phần tử của nó lại là một mảng. Đây là một ví dụ

let myFirstSubarray = [["this", "is"], ["super", "cool"]];

Khi làm việc với mảng hai chiều, nếu bạn muốn in ra tất cả các giá trị, bạn sẽ cần một vòng lặp bên trong vòng lặp. Hãy xem xét điều này một chút nữa

Nhưng nếu chúng ta muốn in ra từng giá trị riêng lẻ (i. e. 1, 2, 3, 4) chứ không chỉ mỗi mảng? . Theo truyền thống, chúng tôi khởi tạo bộ đếm bên trong là j (chữ cái xuất hiện sau i) và chúng tôi sẽ lặp miễn là j nhỏ hơn độ dài của mỗi mảng bên trong

Đây là một ví dụ khác - hãy xem nhanh và thử sao chép nó mà không cần xem mã

let nestedArr = [[1, 2, 3], [4, 5, 6], [7, 8, 9, 10, 11, 12]];
for (let i = 0; i < nestedArr.length; i++) {
  for (let j = 0; j < nestedArr[i].length; j++) {
    console.log(nestedArr[i][j]);
  }
}

Vậy mảng hai chiều được sử dụng khi nào? . Ví dụ: khi xây dựng trò chơi, bạn thường có thể lập mô hình bảng trò chơi giống như một mảng lồng nhau. Bạn có thể sử dụng một mảng lồng nhau cho bảng tic-tac-toe, bảng Minesweeper hoặc có thể cho một vài ván bài xì phé

Tài nguyên bổ sung

Một bài đăng tuyệt vời về cách truy cập tài nguyên lồng nhau - http. // stackoverflow. com/câu hỏi/11922383/access- process-nested-objects-arrays-or-json

bài tập

Cho mảng sau, hãy viết một hàm có tên là printEvens bàn điều khiển đó. ghi tất cả các số chẵn

Cho mảng sau, hãy viết hàm có tên là sumTotal trả về tổng của tất cả các số trong mảng

Đây là giải pháp có thể trông như thế nào đối với hàm sumTotal

function sumTotal() {
  let total = 0;
  for (let i = 0; i < nestedArr.length; i++) {
    for (let j = 0; j < nestedArr[i].length; j++) {
      total += nestedArr[i][j];
    }
  }
  return total;
}

Tiền thưởng tùy chọn

Cho mảng sau, hãy viết một hàm có tên là countVowels, trả về số lượng của tất cả các nguyên âm trong mỗi chuỗi bất kể trường hợp nào. Để xem một giá trị có phải là một mảng hay không, bạn không thể sử dụng

let nestedArr = [[1, 2, 3], [4, 5, 6], [7, 8, 9, 10, 11, 12]];
for (let i = 0; i < nestedArr.length; i++) {
  for (let j = 0; j < nestedArr[i].length; j++) {
    console.log(nestedArr[i][j]);
  }
}

let nestedArr = [[1, 2, 3], [4, 5, 6], [7, 8, 9, 10, 11, 12]];
for (let i = 0; i < nestedArr.length; i++) {
  for (let j = 0; j < nestedArr[i].length; j++) {
    console.log(nestedArr[i][j]);
  }
}

let nestedArr = [[1, 2, 3], [4, 5, 6], [7, 8, 9, 10, 11, 12]];
for (let i = 0; i < nestedArr.length; i++) {
  for (let j = 0; j < nestedArr[i].length; j++) {
    console.log(nestedArr[i][j]);
  }
}

Giải pháp tiền thưởng tùy chọn

Đây là một giải pháp sử dụng phép lặp, khi bạn tiếp tục tìm hiểu thêm về lập trình, bạn sẽ thấy rằng đây là một trường hợp sử dụng đệ quy tuyệt vời (viết một hàm gọi chính nó)

Sau khi khai báo một mảng lồng nhau trong JavaScript, bạn có thể thực hiện các thao tác khác nhau trên mảng đó, chẳng hạn như nối thêm các mảng con, truy cập các phần tử của các mảng con, lặp qua tất cả các phần tử của các mảng con, xóa một mảng con hoặc

Bài viết này sẽ giải thích hoạt động của các mảng lồng nhau trong JavaScript với sự trợ giúp của các ví dụ phù hợp. Vì vậy, hãy bắt đầu

Cách tạo một mảng lồng nhau trong JavaScript

Để tạo một mảng lồng nhau trong JavaScript, bạn phải tuân theo cú pháp dưới đây

let mảng = [ [ inner_array1 ], [inner_array2], [inner_array3]....];

Ở đây, “mảng” đại diện cho mảng lồng nhau có chứa nhiều mảng bên trong, chẳng hạn như “inner_array1”, “inner_array2”, “inner_array3”

Thí dụ. Cách tạo một mảng lồng nhau trong JavaScript

Chúng ta sẽ tạo một mảng đa chiều hoặc mảng lồng nhau có tên là “sở thích” bao gồm thêm năm mảng bên trong

hãy để sở thích = [

['Đọc' , 4],

['Làm vườn' , 2],

['Trò chơi' , 1],

['Tranh' , 8],

['Nấu ăn' , 5]

];

Trong mảng “sở thích” đã khai báo, thứ nguyên đầu tiên được thêm vào biểu thị “sở thích” và thứ nguyên thứ hai biểu thị số “giờ” tối đa đã sử dụng khi thực hiện hoạt động đó

Bây giờ, để hiển thị mảng lồng nhau “sở thích” đã tạo, chúng ta sẽ sử dụng “bảng điều khiển. table()” trong khi chuyển mảng “sở thích” làm đối số

bảng điều khiển. bàn( sở thích );

Việc thực thi đoạn mã đã cho ở trên sẽ hiển thị các giá trị của mảng “sở thích” ở định dạng bảng, trong đó cột đầu tiên biểu thị chỉ mục của các mảng bên trong và hai cột còn lại chứa các phần tử của chúng có mặt ở “[0] đầu tiên

Cách truy cập các phần tử của mảng lồng nhau trong JavaScript

Cần truy cập các phần tử của một mảng lồng nhau?

mảng. [ a ][ b ]

Ở đây, “a” đại diện cho chỉ mục của mảng “bên trong” trong mảng lồng nhau đã tạo và “b” đại diện cho chỉ mục của “phần tử” trong mảng bên trong hoặc mảng con được chỉ định

Thí dụ. Cách truy cập các phần tử của mảng lồng nhau trong JavaScript

Chẳng hạn, chúng tôi muốn truy cập sở thích “Nấu ăn” tồn tại dưới dạng phần tử “Đầu tiên” “[0]” của mảng bên trong thứ năm “[4]”

Để thực hiện thao tác đã chỉ định, chúng tôi sẽ thực thi câu lệnh mã được cung cấp bên dưới

bảng điều khiển. nhật ký( sở thích [4][0]);

Như bạn có thể thấy từ đầu ra, chúng ta đã truy cập thành công giá trị của mảng “sở thích” được đặt ở chỉ mục đầu tiên của mảng bên trong thứ năm

Cách thêm phần tử vào mảng lồng nhau trong JavaScript

JavaScript cung cấp hai cách để thêm các phần tử vào một mảng lồng nhau đã được tạo;

Thí dụ. Cách thêm phần tử vào mảng lồng nhau trong JavaScript

Để đẩy mảng con “[Cycling, 6]” ở cuối mảng lồng nhau “sở thích”, chúng ta sẽ chuyển nó làm đối số cho mảng “sở thích. phương pháp đẩy()”

sở thích. đẩy(['Đạp xe', 6]);

bảng điều khiển. bàn( sở thích );

Khi những “sở thích” nhất định. push()” được thực thi, nó sẽ thêm mảng con đã chỉ định vào cuối mảng “sở thích”

Trong khi đó, để chèn một mảng con vào giữa các mảng bên trong khác, hãy sử dụng phương thức “splice()” theo cách sau

sở thích. mối nối(1 , 0, ['Singing', 3]);

bảng điều khiển. bàn( sở thích );

Ở đây, “sở thích. splice()” sẽ ghi đè mảng “hobbies” và thêm mảng con “[‘Singing’, 3]” ở vị trí thứ hai

Cho đến thời điểm này, chúng ta đã học được thủ tục để tạo một mảng lồng nhau và thêm các phần tử vào nó. Trong phần tiếp theo, chúng ta sẽ nói về việc lặp qua các phần tử của một mảng lồng nhau trong JavaScript

Cách lặp qua các phần tử của mảng lồng nhau trong JavaScript

Bạn có thể biết rằng vòng lặp “for” trong JavaScript chủ yếu được sử dụng để lặp qua các phần tử của một mảng. Tuy nhiên, như trong trường hợp của chúng ta, chúng ta có một mảng “lồng nhau”, vì vậy chúng ta sẽ thêm hai vòng lặp “for” lồng vào nhau

Thí dụ. Cách lặp qua các phần tử của mảng lồng nhau trong JavaScript

Vòng lặp “for” đầu tiên sẽ lặp qua các phần tử mảng bên ngoài theo kích thước của nó và vòng lặp “for” lồng nhau của nó sẽ thực hiện lặp qua các mảng con bên trong

for ( leti = 0; i<hobbies.độ dài; i ++) {
    varinnerArrayLength = sở thích [ i ].độ dài;
      cho ( let j = 0; j <innerArrayLength; j++) {
      bảng điều khiển. log('[' + i + ',' + j + '] = ' + hobbies[i][j]);
    }
}

Thao tác lặp được chỉ định sẽ hiển thị tất cả các phần tử của mảng lồng nhau "sở thích"

Bạn cũng có thể sử dụng phương thức “ForEach()” cho mục đích tương tự

Cách làm phẳng một mảng lồng nhau trong JavaScript

Có một số tình huống nhất định mà bạn có thể cần tạo một mảng bao gồm tất cả các phần tử mảng JavaScript lồng nhau theo thứ tự ban đầu của chúng. Nếu đúng như vậy, hãy làm phẳng mảng lồng nhau đã tạo để giảm số chiều của nó

“Mảng. phẳng ()” được nhúng trong ES6, hỗ trợ làm phẳng một Mảng JavaScript lồng nhau. Phương thức này trả về một mảng mới sau khi nối tất cả các phần tử của mảng con

Thí dụ. Cách làm phẳng một mảng lồng nhau trong JavaScript

Chẳng hạn, để làm phẳng mảng “sở thích”, chúng ta sẽ thực thi đoạn mã sau trong cửa sổ giao diện điều khiển

const flatArray = sở thích. phẳng();

bảng điều khiển. log( flatArray );

“Sở thích” nhất định. flat()” sẽ làm giảm số chiều của mảng “sở thích” và làm phẳng các phần tử của mảng bên trong

Cách xóa các phần tử của mảng lồng nhau trong JavaScript

Để xóa các phần tử khỏi bất kỳ mảng con nào của mảng lồng nhau, hãy sử dụng phương thức “pop()”. Phương thức “pop()” thường xóa mảng bên trong cuối cùng khỏi mảng lồng nhau;

Thí dụ. Cách xóa các phần tử của mảng lồng nhau trong JavaScript

Trước khi sử dụng phương thức “pop()”, chúng ta có các mảng con sau trong mảng lồng nhau “sở thích”

Bây giờ khi chúng ta gọi phương thức “pop()”, mảng con cuối cùng sẽ bị xóa cùng với các phần tử của nó

sở thích. bốp();

bảng điều khiển. bàn( sở thích );

đầu ra

Để xóa phần tử thứ hai của mỗi “mảng con”, chúng ta sẽ lặp qua mảng “sở thích” bằng cách sử dụng phương thức “forEach()” và tại mỗi lần lặp, phương thức “pop()” sẽ xóa phần tử được định vị ở chỉ mục đầu tiên

sở thích. cho mỗi người(( sở thích ) => {
    sở thích. bật(1);
});
bảng điều khiển. bàn( sở thích );

Có thể thấy trong kết quả được cung cấp bên dưới, phần tử đại diện cho số giờ tối đa dành cho mỗi sở thích đã bị xóa cho tất cả các mảng con

Chúng tôi đã tổng hợp tất cả các thông tin cần thiết liên quan đến hoạt động của các mảng lồng nhau trong JavaScript. Bạn có thể khám phá thêm chúng theo sở thích của bạn

Phần kết luận

Khi một mảng bên trong hoặc mảng con được thêm vào một mảng bên ngoài, nó được gọi là mảng lồng nhau. Sau khi tạo một mảng lồng JavaScript, bạn có thể sử dụng phương thức “push()” và “splice()” để thêm phần tử, phương thức “for loop” và “forEach()” để lặp qua các phần tử của mảng bên trong, “flat . Bài viết này giải thích hoạt động của các vòng lặp lồng nhau trong JavaScript

Làm cách nào để truy cập giá trị của một mảng lồng nhau trong JavaScript?

Làm cách nào để truy cập mảng đối tượng lồng nhau trong JavaScript?

Làm cách nào để gọi một mảng lồng nhau trong JavaScript?

Làm cách nào để truy cập danh sách lồng nhau trong JavaScript?