Đối tượng có thể duyệt của JavaScript

Đối tượng có thể lặp lại là các đối tượng có thể được lặp lại (như mảng).

Đối tượng có thể lặp lại có thể được truy cập bằng cách viết mã đơn giản và hiệu quả.

Đối tượng có thể lặp lại có thể được sử dụng for..of Vòng lặp thực hiện việc lặp lại.

Vòng lặp for..of

for..of câu lệnh được sử dụng để lặp qua các phần tử của đối tượng có thể lặp lại.

Cú pháp

for (variable of iterable) {
  // mã cần thực hiện
}

Lặp lại

Việc lặp lại rất dễ hiểu.

Nó chỉ có nghĩa là lặp qua một loạt các phần tử.

Dưới đây là một số ví dụ đơn giản:

  • Lặp qua chuỗi
  • Lặp qua mảng

Lặp qua chuỗi

sử dụng for..of Lặp qua các phần tử của chuỗi:

Ví dụ

const name = "W3Schools";
for (const x of name) {
  // mã cần thực hiện
}

Thử trực tiếp

Lặp qua mảng

sử dụng for..of Lặp qua các phần tử của mảng:

Ví dụ 1

const letters = ["a","b","c"];
for (const x of letters) {
  // mã cần thực hiện
}

Thử trực tiếp

Ví dụ 2

const numbers = [2,4,6,8];
for (const x of numbers) {
  // mã cần thực hiện
}

Thử trực tiếp

Lặp qua Set

sử dụng for..of Lặp qua các phần tử của Set:

Ví dụ

const letters = new Set(["a","b","c"]);
for (const x of letters) {
  // mã cần thực hiện
}

Thử trực tiếp

Chú ý:Chúng ta sẽ giải thích kỹ hơn về Set và Map trong các chương sau.

lặp qua Map

sử dụng for..of lặp qua các phần tử của Map:

Ví dụ

const fruits = new Map([
  ["apples", 500],
  ["bananas", 300],
  ["oranges", 200]
});
for (const x of fruits) {
  // mã cần thực hiện
}

Thử trực tiếp

JavaScript bộ điều khiển

ký hiệu hiệu chỉnh của bộ điều khiển định nghĩa cách từ đối tượng tạo ra các giá trị.một loạt các giá trị.

khi đối tượng thực hiện next() khi đối tượng thực hiện phương thứcBộ điều khiển.

next() Phương thức phải trả về một đối tượng chứa hai thuộc tính:

  • value (giá trị tiếp theo)
  • done (true hoặc false)
value

Giá trị trả về bởi bộ điều khiển.

nếu done là true, có thể bỏ qua.

done

nếu bộ điều khiển đã hoàn thành,则为 true.

nếu bộ điều khiển tạo ra giá trị mới,则为 false.

Lưu ý:

Technically, các đối tượng có thể lặp phải thực hiện phương thức Symbol.iterator.

Chuỗi, Mảng, TypedArray, Map và Set đều là đối tượng có thể lặp vì chúng có phương thức Symbol.iterator trong đối tượng nguyên mẫu của chúng.

Đối tượng có thể lặp tùy chỉnh

Dưới đây là một ví dụ về đối tượng có thể lặp tùy chỉnh, nó sẽ không bao giờ kết thúc, mỗi lần gọi next() sẽ luôn trả về 10, 20, 30, 40, ...:

Ví dụ

// Tạo đối tượng có thể lặp tùy chỉnh
function myNumbers() {
  let n = 0;
  return {
    next: function() {
      n += 10;
      return { value: n, done: false };
    }
  };
}
// Tạo đối tượng có thể lặp
const n = myNumbers();
n.next(); // Trả về 10
n.next(); // Trả về 20
n.next(); // Trả về 30

Thử trực tiếp

Vấn đề là:

Các đối tượng có thể lặp tùy chỉnh không hỗ trợ JavaScript for..of .

hỗ trợ câu lệnh for..of

JavaScript các đối tượng có thể lặp là những đối tượng có Symbol.iterator của đối tượng.

Symbol.iterator là một đối tượng trả về next() hàm của phương thức.

sử dụng mã sau để lặp lại các đối tượng có thể lặp:

for (const x of iterable}) { }

Ví dụ

// Tạo một đối tượng
myNumbers = {};
// Làm cho nó có thể lặp lại
myNumbers[Symbol.iterator] = function() {
  let n = 0;
  done = false;
  return {
    next() {
      n += 10;
      if (n == 100) { done = true; }
      return { value: n, done: done };
    }
  };
};
// Bây giờ có thể sử dụng for..of
for (const num of myNumbers) {
  // Mã ngẫu nhiên
}

Thử trực tiếp

Phương thức Symbol.iterator sẽ được for..of Gọi tự động.

Nhưng chúng ta cũng có thể gọi nó thủ công:

Ví dụ

let iterator = myNumbers[Symbol.iterator]();
while (true) {
  const result = iterator.next();
  if (result.done) break;
  // Mã ngẫu nhiên
}

Thử trực tiếp