Làm cách nào để lặp trên đối tượng trong JavaScript?

Phương thức

const birds = {
  owl: '🦉',
  eagle: '🦅',
  duck: '🦆',
  chicken: '🐔'
}

for [const key in birds] {
  console.log[`${key} -> ${birds[key]}`]
}

// owl -> 🦉
// eagle -> 🦅
// duck -> 🦆
// chicken -> 🐔

4 đã được thêm vào trong ES6, trong khi đó, phương thức

for [const key in birds] {
  if [birds.hasOwnProperty[key]] {
    console.log[`${key} -> ${birds[key]}`]
  }
}

0 và

const birds = {
  owl: '🦉',
  eagle: '🦅',
  duck: '🦆',
  chicken: '🐔'
}

for [const key in birds] {
  console.log[`${key} -> ${birds[key]}`]
}

// owl -> 🦉
// eagle -> 🦅
// duck -> 🦆
// chicken -> 🐔

5 đã được thêm vào trong ES8. Các phương thức này chuyển đổi đối tượng thành một mảng và sau đó sử dụng các phương thức lặp mảng để lặp lại mảng đó

Lặp lại đối tượng bằng vòng lặp

const birds = {
  owl: '🦉',
  eagle: '🦅',
  duck: '🦆',
  chicken: '🐔'
}

for [const key in birds] {
  console.log[`${key} -> ${birds[key]}`]
}

// owl -> 🦉
// eagle -> 🦅
// duck -> 🦆
// chicken -> 🐔

6

Cách đơn giản và phổ biến nhất để lặp lại các khóa và giá trị của một đối tượng là sử dụng vòng lặp

const birds = {
  owl: '🦉',
  eagle: '🦅',
  duck: '🦆',
  chicken: '🐔'
}

for [const key in birds] {
  console.log[`${key} -> ${birds[key]}`]
}

// owl -> 🦉
// eagle -> 🦅
// duck -> 🦆
// chicken -> 🐔

6

const birds = {
  owl: '🦉',
  eagle: '🦅',
  duck: '🦆',
  chicken: '🐔'
}

for [const key in birds] {
  console.log[`${key} -> ${birds[key]}`]
}

// owl -> 🦉
// eagle -> 🦅
// duck -> 🦆
// chicken -> 🐔

Vòng lặp

const birds = {
  owl: '🦉',
  eagle: '🦅',
  duck: '🦆',
  chicken: '🐔'
}

for [const key in birds] {
  console.log[`${key} -> ${birds[key]}`]
}

// owl -> 🦉
// eagle -> 🦅
// duck -> 🦆
// chicken -> 🐔

6 hoạt động trong tất cả các trình duyệt hiện đại và cũ, bao gồm cả Internet Explorer 6+

Vấn đề duy nhất với vòng lặp

const birds = {
  owl: '🦉',
  eagle: '🦅',
  duck: '🦆',
  chicken: '🐔'
}

for [const key in birds] {
  console.log[`${key} -> ${birds[key]}`]
}

// owl -> 🦉
// eagle -> 🦅
// duck -> 🦆
// chicken -> 🐔

6 là nó lặp qua các thuộc tính trong chuỗi nguyên mẫu

Vì đối tượng JavaScript kế thừa các thuộc tính từ nguyên mẫu của nó, nên vòng lặp

const birds = {
  owl: '🦉',
  eagle: '🦅',
  duck: '🦆',
  chicken: '🐔'
}

for [const key in birds] {
  console.log[`${key} -> ${birds[key]}`]
}

// owl -> 🦉
// eagle -> 🦅
// duck -> 🦆
// chicken -> 🐔

6 cũng sẽ lặp lại các thuộc tính đó

Tuy nhiên, bạn có thể sử dụng phương thức

for [const key in birds] {
  if [birds.hasOwnProperty[key]] {
    console.log[`${key} -> ${birds[key]}`]
  }
}

9 để loại trừ các thuộc tính kế thừa

for [const key in birds] {
  if [birds.hasOwnProperty[key]] {
    console.log[`${key} -> ${birds[key]}`]
  }
}

Lặp lại đối tượng bằng phương pháp

const birds = {
  owl: '🦉',
  eagle: '🦅',
  duck: '🦆',
  chicken: '🐔'
}

for [const key in birds] {
  console.log[`${key} -> ${birds[key]}`]
}

// owl -> 🦉
// eagle -> 🦅
// duck -> 🦆
// chicken -> 🐔

4

Phương thức

const birds = {
  owl: '🦉',
  eagle: '🦅',
  duck: '🦆',
  chicken: '🐔'
}

for [const key in birds] {
  console.log[`${key} -> ${birds[key]}`]
}

// owl -> 🦉
// eagle -> 🦅
// duck -> 🦆
// chicken -> 🐔

4 lấy một đối tượng làm đầu vào và trả về một mảng các tên thuộc tính có thể đếm được của chính đối tượng đó

const birds = {
  owl: '🦉',
  eagle: '🦅',
  duck: '🦆',
  chicken: '🐔'
}

const keys = Object.keys[birds]

console.log[keys]
// [ 'owl', 'eagle', 'duck', 'chicken' ]

Bây giờ chúng ta có thể sử dụng vòng lặp

const birds = {
  owl: '🦉',
  eagle: '🦅',
  duck: '🦆',
  chicken: '🐔'
}

const keys = Object.keys[birds]

console.log[keys]
// [ 'owl', 'eagle', 'duck', 'chicken' ]

2 để lặp lại mảng và lấy giá trị của từng thuộc tính

keys.forEach[key => {
  console.log[`${key} -> ${birds[key]}`]
}]

// owl -> 🦉
// eagle -> 🦅
// duck -> 🦆
// chicken -> 🐔

Lặp lại đối tượng bằng phương pháp

const birds = {
  owl: '🦉',
  eagle: '🦅',
  duck: '🦆',
  chicken: '🐔'
}

for [const key in birds] {
  console.log[`${key} -> ${birds[key]}`]
}

// owl -> 🦉
// eagle -> 🦅
// duck -> 🦆
// chicken -> 🐔

5

Phương thức

const birds = {
  owl: '🦉',
  eagle: '🦅',
  duck: '🦆',
  chicken: '🐔'
}

for [const key in birds] {
  console.log[`${key} -> ${birds[key]}`]
}

// owl -> 🦉
// eagle -> 🦅
// duck -> 🦆
// chicken -> 🐔

5, không giống như

const birds = {
  owl: '🦉',
  eagle: '🦅',
  duck: '🦆',
  chicken: '🐔'
}

for [const key in birds] {
  console.log[`${key} -> ${birds[key]}`]
}

// owl -> 🦉
// eagle -> 🦅
// duck -> 🦆
// chicken -> 🐔

4, trả về một mảng các giá trị thuộc tính có thể đếm được của chính đối tượng đã cho

const birds = {
  owl: '🦉',
  eagle: '🦅',
  duck: '🦆',
  chicken: '🐔'
}

Object.values[birds].forEach[item => console.log[item]]

// 🦉
// 🦅
// 🦆
// 🐔

Lặp lại đối tượng bằng phương thức

for [const key in birds] {
  if [birds.hasOwnProperty[key]] {
    console.log[`${key} -> ${birds[key]}`]
  }
}

0

Phương thức

for [const key in birds] {
  if [birds.hasOwnProperty[key]] {
    console.log[`${key} -> ${birds[key]}`]
  }
}

0 trả về một mảng các mảng, theo đó mỗi mảng lồng nhau có hai phần tử. Phần tử đầu tiên là thuộc tính và phần tử thứ hai là giá trị

const birds = {
  owl: '🦉',
  eagle: '🦅',
  duck: '🦆',
  chicken: '🐔'
}

for [const key in birds] {
  console.log[`${key} -> ${birds[key]}`]
}

// owl -> 🦉
// eagle -> 🦅
// duck -> 🦆
// chicken -> 🐔

0

Để lặp lại mảng lồng nhau được trả về bởi

for [const key in birds] {
  if [birds.hasOwnProperty[key]] {
    console.log[`${key} -> ${birds[key]}`]
  }
}

0, hãy sử dụng vòng lặp

const birds = {
  owl: '🦉',
  eagle: '🦅',
  duck: '🦆',
  chicken: '🐔'
}

const keys = Object.keys[birds]

console.log[keys]
// [ 'owl', 'eagle', 'duck', 'chicken' ]

9 hoặc phương thức

const birds = {
  owl: '🦉',
  eagle: '🦅',
  duck: '🦆',
  chicken: '🐔'
}

const keys = Object.keys[birds]

console.log[keys]
// [ 'owl', 'eagle', 'duck', 'chicken' ]

2 như hình bên dưới

Chúng ta có thể sử dụng vòng lặp for trên đối tượng trong JavaScript không?

Làm cách nào để lặp lại đối tượng đối tượng trong JavaScript?

Bạn có thể sử dụng vòng lặp for trên một đối tượng không?

Làm cách nào để lặp qua các thuộc tính đối tượng trong JavaScript?