Interview question

How do you convert between arrays and other data structures (Array.from, Array.of, spread)? Arrays और अन्य data structures के बीच कैसे convert करें (Array.from, Array.of, spread)?

Answer

JavaScript provides several utilities for creating arrays from array-like or iterable objects, which is common when working with DOM collections, strings, Sets, or Maps.

// Array.from - converts array-like or iterable objects into real arrays
const nodeList = document.querySelectorAll('div'); // NodeList, not a real array
const divsArray = Array.from(nodeList);
divsArray.map(div => div.textContent); // now array methods work

// Array.from with a string
console.log(Array.from('hello')); // ['h', 'e', 'l', 'l', 'o']

// Array.from with a Set (removing duplicates then converting)
const uniqueSet = new Set([1, 2, 2, 3]);
console.log(Array.from(uniqueSet)); // [1, 2, 3]

// Array.from with a mapping function (2nd argument)
const doubled = Array.from([1, 2, 3], x => x * 2);
console.log(doubled); // [2, 4, 6]

// Array.from to create a sequence of numbers
const range = Array.from({ length: 5 }, (_, i) => i);
console.log(range); // [0, 1, 2, 3, 4]

// Array.of - creates an array from arguments (avoids Array() constructor quirk)
console.log(Array.of(7));    // [7]
console.log(new Array(7));   // [ <7 empty items> ] - creates array of LENGTH 7, not [7]!
console.log(Array.of(1, 2, 3)); // [1, 2, 3]

// Spread operator - similar to Array.from for iterables
const spreadFromSet = [...uniqueSet];
console.log(spreadFromSet); // [1, 2, 3]

const spreadFromString = [...'abc'];
console.log(spreadFromString); // ['a', 'b', 'c']

// Converting a Map to an array of entries
const map = new Map([['a', 1], ['b', 2]]);
console.log(Array.from(map)); // [['a', 1], ['b', 2]]
console.log([...map]);        // same result

JavaScript array-like या iterable objects से real arrays बनाने के utilities देता है, DOM collections, strings, Sets, Maps के साथ काम करते समय common है।

// Array.from - array-like/iterable को real array में convert करना
const nodeList = document.querySelectorAll('div');
const divsArray = Array.from(nodeList);
divsArray.map(div => div.textContent);

// String के साथ
console.log(Array.from('hello')); // ['h', 'e', 'l', 'l', 'o']

// Set के साथ (duplicates हटाना)
const uniqueSet = new Set([1, 2, 2, 3]);
console.log(Array.from(uniqueSet)); // [1, 2, 3]

// Mapping function के साथ
const doubled = Array.from([1, 2, 3], x => x * 2);
console.log(doubled); // [2, 4, 6]

// Numbers की sequence बनाना
const range = Array.from({ length: 5 }, (_, i) => i);
console.log(range); // [0, 1, 2, 3, 4]

// Array.of - arguments से array बनाना (Array() constructor की quirk से बचना)
console.log(Array.of(7));    // [7]
console.log(new Array(7));   // length 7 का empty array!
console.log(Array.of(1, 2, 3)); // [1, 2, 3]

// Spread operator
const spreadFromSet = [...uniqueSet];
const spreadFromString = [...'abc'];
console.log(spreadFromString); // ['a', 'b', 'c']

// Map को array में convert करना
const map = new Map([['a', 1], ['b', 2]]);
console.log(Array.from(map)); // [['a', 1], ['b', 2]]

Was this answer clear?

Subjects

Related questions