-
Hajipur, Bihar, 844101
Hajipur, Bihar, 844101
JS Basics
JS Variables & Operators
JS Data Types & Conversion
JS Numbers & Math
JS Strings
JS Dates
JS Arrays
JS Control Flow
JS Loops & Iteration
JS Functions
JS Functions
Function Definitions
Function Parameters
Function Invocation
Function Call
Function Apply
Function Bind
Function Closures
JS Arrow Function
JS Objects
JS Objects
JS Object Properties
JS Object Methods
JS Object Display
JS Object Constructors
Object Definitions
Object Get / Set
Object Prototypes
Object Protection
JS Classes & Modules
JS Async Programming
JS Advanced
JS Destructuring
JS Bitwise
JS RegExp
JS Precedence
JS Errors
JS Scope
JS Hoisting
JS Strict Mode
JS this Keyword
JS HTML DOM
DOM Intro
DOM Methods
DOM Document
DOM Elements
DOM HTML
DOM Forms
DOM CSS
DOM Animations
DOM Events
DOM Event Listener
DOM Navigation
DOM Nodes
DOM Collections
DOM Node Lists
JS BOM (Browser Object Model)
JS Window
JS Screen
JS Location
JS History
JS Navigator
JS Popup Alert
JS Timing
JS Cookies
Web Storage API
JS Web APIs
JS AJAX
AJAX Intro
AJAX XMLHttp
AJAX Request
AJAX Response
AJAX XML File
AJAX PHP
AJAX ASP
AJAX Database
AJAX Applications
AJAX Examples
JS JSON
JSON Intro
JSON Syntax
JSON vs XML
JSON Data Types
JSON Parse
JSON Stringify
JSON Objects
JSON Arrays
JSON Server
JSON PHP
JSON HTML
JSON JSONP
JS Canvas
JS Graphics & Charts
JS Basics
JS Variables & Operators
JS Data Types & Conversion
JS Numbers & Math
JS Strings
JS Dates
JS Arrays
JS Control Flow
JS Loops & Iteration
JS Functions
JS Functions
Function Definitions
Function Parameters
Function Invocation
Function Call
Function Apply
Function Bind
Function Closures
JS Arrow Function
JS Objects
JS Objects
JS Object Properties
JS Object Methods
JS Object Display
JS Object Constructors
Object Definitions
Object Get / Set
Object Prototypes
Object Protection
JS Classes & Modules
JS Async Programming
JS Advanced
JS Destructuring
JS Bitwise
JS RegExp
JS Precedence
JS Errors
JS Scope
JS Hoisting
JS Strict Mode
JS this Keyword
JS HTML DOM
DOM Intro
DOM Methods
DOM Document
DOM Elements
DOM HTML
DOM Forms
DOM CSS
DOM Animations
DOM Events
DOM Event Listener
DOM Navigation
DOM Nodes
DOM Collections
DOM Node Lists
JS BOM (Browser Object Model)
JS Window
JS Screen
JS Location
JS History
JS Navigator
JS Popup Alert
JS Timing
JS Cookies
Web Storage API
JS Web APIs
JS AJAX
AJAX Intro
AJAX XMLHttp
AJAX Request
AJAX Response
AJAX XML File
AJAX PHP
AJAX ASP
AJAX Database
AJAX Applications
AJAX Examples
JS JSON
JSON Intro
JSON Syntax
JSON vs XML
JSON Data Types
JSON Parse
JSON Stringify
JSON Objects
JSON Arrays
JSON Server
JSON PHP
JSON HTML
JSON JSONP
JS Canvas
JS Graphics & Charts
In JavaScript, an iterable is a data structure that allows you to access its elements one at a time using a loop, especially the for...of
loop.
An object is iterable if it has a method with the key Symbol.iterator
.
The most common built-in iterables in JavaScript are:
Arrays
Strings
Sets
Maps
NodeLists
And others...
for...of
with Iterableslet arr = ["a", "b", "c"];
for (let value of arr) {
console.log(value);
}
// Output: a b c
let word = "Hello";
for (let char of word) {
console.log(char);
}
// Output: H e l l o
let set = new Set([1, 2, 3]);
for (let num of set) {
console.log(num);
}
let map = new Map([
["name", "John"],
["age", 25]
]);
for (let [key, value] of map) {
console.log(`${key}: ${value}`);
}
Feature | Iterable | Array-like Object |
---|---|---|
Has Symbol.iterator |
✅ Yes | ❌ No |
Can be looped with for...of |
✅ Yes | ❌ No |
Has indexed elements | ✅ Yes (usually) | ✅ Yes |
Has length property |
❌ Not required | ✅ Yes |
You can make your own object iterable by defining a [Symbol.iterator]()
method:
const customIterable = {
*[Symbol.iterator]() {
yield 1;
yield 2;
yield 3;
}
};
for (let val of customIterable) {
console.log(val);
}
// Output: 1 2 3
*
(function*) creates a generator function which returns an iterator.
Q1. What is an iterable in JavaScript and how is it different from an array?
Q2. List some built-in JavaScript objects that are iterable.
Q3. How can you use the for...of
loop to loop through a string?
Q4. What happens if you try to use for...of
on a non-iterable object like {}
?
Q5. How does JavaScript determine whether an object is iterable?
Q6. How can you manually iterate over an iterable using its iterator?
Q7. Write a code snippet to loop through a Set using for...of
.
Q8. What is the purpose of Symbol.iterator
in an iterable object?
Q9. How can you create a custom iterable using a generator function?
Q10. Explain the difference between iterable objects and array-like objects.
Q1: Which of the following is iterable?
Q2: Which method must an object have to be iterable?
Q3: What does the for...of loop iterate over?
Q4: Which of the following is NOT iterable by default?
Q5: What keyword is used to define a generator function?
Q6: What does the spread operator (...) require the object to be?
Q7: How do you loop through a Map using for...of?
Q8: Which statement about array-like objects is TRUE?
Q9: What is the result of spreading a Set like this: [...new Set([1, 2, 2, 3])]?