Iterables เป็นวัตถุที่สามารถทำซ้ำได้ (เช่น Arrays)
Iterables สามารถเข้าถึงได้ด้วยโค้ดที่เรียบง่ายและมีประสิทธิภาพ
การวนซ้ำสามารถวนซ้ำได้โดยใช้ for..of ลูป
คำสั่ง for..of ของ JavaScript วนซ้ำ ผ่านองค์ประกอบของวัตถุที่ทำซ้ำได้
for (variable of iterable) {
// code block to be executed
}การวนซ้ำนั้นง่ายต่อการเข้าใจ
มันหมายถึงการวนซ้ำตามลำดับขององค์ประกอบ
นี่คือตัวอย่างง่ายๆ:
วนซ้ำบนสตริง
การวนซ้ำบนอาร์เรย์
คุณสามารถใช้ลูป for..of เพื่อวนซ้ำองค์ประกอบของสตริง:
const name = "W3Schools";
for (const x of name) {
// code block to be executed
}ลองด้วยตัวคุณเอง →
<!DOCTYPE html>
<html>
<body>
<h2>JavaScript Iterables</h2>
<p>Iterate over a String:</p>
<p id="demo"></p>
<script>
// Create a String
const name = "W3Schools";
// List all Elements
let text = ""
for (const x of name) {
text += x + "<br>";
}
document.getElementById("demo").innerHTML = text;
</script>
</body>
</html>
คุณสามารถใช้ลูป for..of เพื่อวนซ้ำองค์ประกอบของอาร์เรย์:
const letters = ["a","b","c"];
for (const x of letters) {
// code block to be executed
}ลองด้วยตัวคุณเอง →
<!DOCTYPE html>
<html>
<body>
<h2>JavaScript Iterables</h2>
<p>Iterate over an Array:</p>
<p id="demo"></p>
<script>
// Create aa Array
const letters = ["a","b","c"];
// List all Elements
let text = "";
for (const x of letters) {
text += x + "<br>";
}
document.getElementById("demo").innerHTML = text;
</script>
</body>
</html>
คุณสามารถเรียนรู้รายละเอียดเพิ่มเติมเกี่ยวกับ Iterables ได้ในบท JS Object Iterables
คุณสามารถใช้ลูป for..of เพื่อวนซ้ำองค์ประกอบของ Set:
const letters = new Set(["a","b","c"]);
for (const x of letters) {
// code block to be executed
}ลองด้วยตัวคุณเอง →
<!DOCTYPE html>
<html>
<body>
<h2>JavaScript Iterables</h2>
<p>Iterate over a Set:</p>
<p id="demo"></p>
<script>
// Create a Set
const letters = new Set(["a","b","c"]);
// List all Elements
let text = "";
for (const x of letters) {
text += x + "<br>";
}
document.getElementById("demo").innerHTML = text;
</script>
</body>
</html>
ชุดและแผนที่จะกล่าวถึงในบทถัดไป
คุณสามารถใช้ลูป for..of เพื่อวนซ้ำองค์ประกอบของแผนที่:
const fruits = new Map([
["apples", 500],
["bananas", 300],
["oranges", 200]
]);
for (const x of fruits) {
// code block to be executed
}ลองด้วยตัวคุณเอง →
<!DOCTYPE html>
<html>
<body>
<h2>JavaScript Iterables</h2>
<p>Iterate over a Map:</p>
<p id="demo"></p>
<script>
// Create a Map
const fruits = new Map([
["apples", 500],
["bananas", 300],
["oranges", 200]
]);
// List all entries
let text = "";
for (const x of fruits) {
text += x + "<br>";
}
document.getElementById("demo").innerHTML = text;
</script>
</body>
</html>