Trong JavaScript, khi bạn nghe thuật ngữ "vòng lặp", có lẽ bạn sẽ nghĩ đến việc sử dụng các phương thức vòng lặp khác nhau như vòng lặp
const population = {
male: 4,
female: 93,
others: 10
};
// Iterate through the object
for [const key in population] {
if [population.hasOwnProperty[key]] {
console.log[`${key}: ${population[key]}`];
}
}
6, vòng lặp const population = {
male: 4,
female: 93,
others: 10
};
// Iterate through the object
for [const key in population] {
if [population.hasOwnProperty[key]] {
console.log[`${key}: ${population[key]}`];
}
}
7, const population = {
male: 4,
female: 93,
others: 10
};
// Iterate through the object
for [const key in population] {
if [population.hasOwnProperty[key]] {
console.log[`${key}: ${population[key]}`];
}
}
8 và các vòng lặp khácNhưng thật không may, trong trường hợp của các đối tượng, các phương thức này không hoạt động vì các đối tượng không thể lặp lại
Điều này không có nghĩa là chúng ta không thể lặp qua một đối tượng – nhưng điều này có nghĩa là chúng ta không thể lặp trực tiếp qua một đối tượng giống như cách chúng ta làm với một mảng
let arr = [24, 33, 77];
arr.forEach[[val] => console.log[val]]; // ✅✅✅
for [val of arr] {
console.log[val]; // ✅✅✅
}
let obj = { age: 12, name: "John Doe" };
obj.forEach[[val] => console.log[val]]; // ❌❌❌
for [val of obj] {
console.log[val]; // ❌❌❌
}
Trong bài viết này, Bạn sẽ tìm hiểu cách bạn có thể lặp qua một đối tượng trong JavaScript. Có hai phương pháp bạn có thể sử dụng - và một trong số đó có trước ngày giới thiệu ES6
Cách lặp qua một đối tượng trong JavaScript bằng vòng lặp const population = {
male: 4,
female: 93,
others: 10
};
// Iterate through the object
for [const key in population] {
if [population.hasOwnProperty[key]] {
console.log[`${key}: ${population[key]}`];
}
}
9
const population = {
male: 4,
female: 93,
others: 10
};
// Iterate through the object
for [const key in population] {
if [population.hasOwnProperty[key]] {
console.log[`${key}: ${population[key]}`];
}
}
Trước ES6, chúng tôi dựa vào phương thức
const population = {
male: 4,
female: 93,
others: 10
};
let genders = Object.keys[population];
console.log[genders]; // ["male","female","others"]
0 bất cứ khi nào chúng tôi muốn lặp qua một đối tượngVòng lặp
const population = {
male: 4,
female: 93,
others: 10
};
let genders = Object.keys[population];
console.log[genders]; // ["male","female","others"]
0 lặp qua các thuộc tính trong chuỗi nguyên mẫu. Điều này có nghĩa là chúng ta cần kiểm tra xem thuộc tính có thuộc về đối tượng hay không bằng cách sử dụng const population = {
male: 4,
female: 93,
others: 10
};
let genders = Object.keys[population];
console.log[genders]; // ["male","female","others"]
2 bất cứ khi nào chúng ta lặp qua một đối tượng bằng vòng lặp const population = {
male: 4,
female: 93,
others: 10
};
// Iterate through the object
for [const key in population] {
if [population.hasOwnProperty[key]] {
console.log[`${key}: ${population[key]}`];
}
}
9const population = {
male: 4,
female: 93,
others: 10
};
// Iterate through the object
for [const key in population] {
if [population.hasOwnProperty[key]] {
console.log[`${key}: ${population[key]}`];
}
}
Để tránh căng thẳng và khó lặp lại và sử dụng phương thức
const population = {
male: 4,
female: 93,
others: 10
};
let genders = Object.keys[population];
console.log[genders]; // ["male","female","others"]
2, ES6 và ES8 đã giới thiệu các phương thức tĩnh đối tượng. Chúng chuyển đổi các thuộc tính đối tượng thành mảng, cho phép chúng ta sử dụng trực tiếp các phương thức mảngCách lặp qua một đối tượng trong JavaScript bằng các phương thức tĩnh đối tượng
Một đối tượng được tạo thành từ các thuộc tính có các cặp khóa-giá trị, tức là mỗi thuộc tính luôn có một giá trị tương ứng
Các phương thức tĩnh đối tượng cho phép chúng tôi trích xuất
const population = {
male: 4,
female: 93,
others: 10
};
let genders = Object.keys[population];
console.log[genders]; // ["male","female","others"]
5, const population = {
male: 4,
female: 93,
others: 10
};
let genders = Object.keys[population];
console.log[genders]; // ["male","female","others"]
6 hoặc cả khóa và giá trị dưới dạng const population = {
male: 4,
female: 93,
others: 10
};
let genders = Object.keys[population];
console.log[genders]; // ["male","female","others"]
7 trong một mảng, cho phép chúng tôi có nhiều sự linh hoạt đối với chúng như chúng tôi làm với các mảng thực tếChúng tôi có ba phương thức tĩnh đối tượng, đó là
8const population = { male: 4, female: 93, others: 10 }; let genders = Object.keys[population]; console.log[genders]; // ["male","female","others"]
9const population = { male: 4, female: 93, others: 10 }; let genders = Object.keys[population]; console.log[genders]; // ["male","female","others"]
60const population = { male: 4, female: 93, others: 10 }; // Iterate through the object for [const key in population] { if [population.hasOwnProperty[key]] { console.log[`${key}: ${population[key]}`]; } }
Cách lặp qua một đối tượng trong JavaScript bằng phương thức const population = {
male: 4,
female: 93,
others: 10
};
let genders = Object.keys[population];
console.log[genders]; // ["male","female","others"]
8
const population = {
male: 4,
female: 93,
others: 10
};
let genders = Object.keys[population];
console.log[genders]; // ["male","female","others"]
Phương thức
const population = {
male: 4,
female: 93,
others: 10
};
let genders = Object.keys[population];
console.log[genders]; // ["male","female","others"]
8 được giới thiệu trong ES6. Nó lấy đối tượng mà chúng ta muốn lặp lại làm đối số và trả về một mảng chứa tất cả các tên thuộc tính [còn được gọi là khóa]const population = {
male: 4,
female: 93,
others: 10
};
let genders = Object.keys[population];
console.log[genders]; // ["male","female","others"]
Điều này bây giờ mang lại cho chúng ta lợi thế khi áp dụng bất kỳ phương thức lặp mảng nào để lặp qua mảng và truy xuất giá trị của từng thuộc tính
const population = {
male: 4,
female: 93,
others: 10
};
// Iterate through the object
for [const key in population] {
if [population.hasOwnProperty[key]] {
console.log[`${key}: ${population[key]}`];
}
}
6Điều này sẽ trở lại
const population = {
male: 4,
female: 93,
others: 10
};
// Iterate through the object
for [const key in population] {
if [population.hasOwnProperty[key]] {
console.log[`${key}: ${population[key]}`];
}
}
1Chúng tôi cũng có thể sử dụng khóa để lấy giá trị bằng cách sử dụng ký hiệu ngoặc, chẳng hạn như
const population = {
male: 4,
female: 93,
others: 10
};
// Iterate through the object
for [const key in population] {
if [population.hasOwnProperty[key]] {
console.log[`${key}: ${population[key]}`];
}
}
63 như bên dướiconst population = {
male: 4,
female: 93,
others: 10
};
// Iterate through the object
for [const key in population] {
if [population.hasOwnProperty[key]] {
console.log[`${key}: ${population[key]}`];
}
}
3Điều này sẽ trở lại
const population = {
male: 4,
female: 93,
others: 10
};
// Iterate through the object
for [const key in population] {
if [population.hasOwnProperty[key]] {
console.log[`${key}: ${population[key]}`];
}
}
4Trước khi tiếp tục, hãy sử dụng phương pháp này để tổng hợp tất cả dân số bằng cách lặp qua để biết tổng dân số
const population = {
male: 4,
female: 93,
others: 10
};
// Iterate through the object
for [const key in population] {
if [population.hasOwnProperty[key]] {
console.log[`${key}: ${population[key]}`];
}
}
5Cách lặp qua một đối tượng trong JavaScript bằng phương thức const population = {
male: 4,
female: 93,
others: 10
};
let genders = Object.keys[population];
console.log[genders]; // ["male","female","others"]
9
const population = {
male: 4,
female: 93,
others: 10
};
let genders = Object.keys[population];
console.log[genders]; // ["male","female","others"]
Phương thức
const population = {
male: 4,
female: 93,
others: 10
};
let genders = Object.keys[population];
console.log[genders]; // ["male","female","others"]
9 rất giống với phương thức const population = {
male: 4,
female: 93,
others: 10
};
let genders = Object.keys[population];
console.log[genders]; // ["male","female","others"]
8 và được giới thiệu trong ES8. Phương thức này lấy Đối tượng mà chúng ta muốn lặp lại làm đối số và trả về một mảng chứa tất cả các giá trị khóaconst population = {
male: 4,
female: 93,
others: 10
};
// Iterate through the object
for [const key in population] {
if [population.hasOwnProperty[key]] {
console.log[`${key}: ${population[key]}`];
}
}
9Điều này bây giờ mang lại cho chúng ta lợi thế khi áp dụng bất kỳ phương thức lặp mảng nào để lặp qua mảng và truy xuất
const population = {
male: 4,
female: 93,
others: 10
};
// Iterate through the object
for [const key in population] {
if [population.hasOwnProperty[key]] {
console.log[`${key}: ${population[key]}`];
}
}
67 của mỗi thuộc tínhlet arr = [24, 33, 77];
arr.forEach[[val] => console.log[val]]; // ✅✅✅
for [val of arr] {
console.log[val]; // ✅✅✅
}
let obj = { age: 12, name: "John Doe" };
obj.forEach[[val] => console.log[val]]; // ❌❌❌
for [val of obj] {
console.log[val]; // ❌❌❌
}
1Điều này sẽ trở lại
const population = {
male: 4,
female: 93,
others: 10
};
// Iterate through the object
for [const key in population] {
if [population.hasOwnProperty[key]] {
console.log[`${key}: ${population[key]}`];
}
}
0Chúng ta có thể thực hiện phép tính tổng một cách hiệu quả vì chúng ta có thể lặp trực tiếp
const population = {
male: 4,
female: 93,
others: 10
};
// Iterate through the object
for [const key in population] {
if [population.hasOwnProperty[key]] {
console.log[`${key}: ${population[key]}`];
}
}
1Cách lặp qua một đối tượng trong JavaScript với Object. phương thức entry[]
Phương pháp
const population = {
male: 4,
female: 93,
others: 10
};
// Iterate through the object
for [const key in population] {
if [population.hasOwnProperty[key]] {
console.log[`${key}: ${population[key]}`];
}
}
60 cũng được giới thiệu với ES8. Theo nghĩa cơ bản, những gì nó làm là xuất ra một mảng các mảng, theo đó mỗi mảng bên trong có hai phần tử là thuộc tính và giá trịconst population = {
male: 4,
female: 93,
others: 10
};
// Iterate through the object
for [const key in population] {
if [population.hasOwnProperty[key]] {
console.log[`${key}: ${population[key]}`];
}
}
2kết quả này
const population = {
male: 4,
female: 93,
others: 10
};
// Iterate through the object
for [const key in population] {
if [population.hasOwnProperty[key]] {
console.log[`${key}: ${population[key]}`];
}
}
3Điều này trả về một mảng các mảng, với mỗi mảng bên trong có
const population = {
male: 4,
female: 93,
others: 10
};
// Iterate through the object
for [const key in population] {
if [population.hasOwnProperty[key]] {
console.log[`${key}: ${population[key]}`];
}
}
69. Bạn có thể sử dụng bất kỳ phương thức mảng nào để lặp quaconst population = {
male: 4,
female: 93,
others: 10
};
// Iterate through the object
for [const key in population] {
if [population.hasOwnProperty[key]] {
console.log[`${key}: ${population[key]}`];
}
}
4Chúng tôi có thể quyết định hủy cấu trúc mảng, vì vậy chúng tôi nhận được
const population = {
male: 4,
female: 93,
others: 10
};
// Iterate through the object
for [const key in population] {
if [population.hasOwnProperty[key]] {
console.log[`${key}: ${population[key]}`];
}
}
10 và giá trịconst population = {
male: 4,
female: 93,
others: 10
};
// Iterate through the object
for [const key in population] {
if [population.hasOwnProperty[key]] {
console.log[`${key}: ${population[key]}`];
}
}
5Bạn có thể tìm hiểu thêm về cách lặp qua mảng trong bài viết này
kết thúc
Trong hướng dẫn này, bạn đã biết rằng cách tốt nhất để lặp qua một đối tượng là sử dụng bất kỳ phương thức tĩnh nào của đối tượng dựa trên nhu cầu của bạn để chuyển đổi thành một mảng trước khi lặp
Chúc các bạn code vui vẻ
QUẢNG CÁO
QUẢNG CÁO
QUẢNG CÁO
Nhà phát triển Frontend & Người viết kỹ thuật
Nếu bạn đọc đến đây, hãy tweet cho tác giả để cho họ thấy bạn quan tâm. Tweet một lời cảm ơn
Học cách viết mã miễn phí. Chương trình giảng dạy mã nguồn mở của freeCodeCamp đã giúp hơn 40.000 người có được việc làm với tư cách là nhà phát triển. Bắt đầu