Arraymethods in Javascript

Learn about arraymethods in javascript with practical examples and code snippets.

Example 1

ARRAY METHODS IN JAVASCRIPT Comprehensive guide to commonly used array methods in JavaScript FIND - Returns first element that satisfies condition FINDINDEX - Returns index of first element that satisfies condition SOME - Returns true if at least one element satisfies condition EVERY - Returns true if all elements satisfy condition INCLUDES - Checks if array includes a value With index INDEXOF - Returns first index of element LASTINDEXOF - Returns last index of element SLICE - Returns shallow copy of portion of array SPLICE - Changes array by removing/replacing elements Remove 2 elements from index 1 Insert elements Replace elements CONCAT - Merges arrays Modern approach with spread JOIN - Joins array elements into string REVERSE - Reverses array (mutates original) Create reversed copy SORT - Sorts array (mutates original) Default sort (converts to strings) Numeric sort Sort objects [{ name: "Suresh", age: 20 }, { name: "Kuldeep", age: 25 }, { name: "Ramesh", age: 30 }] FLAT - Flattens nested arrays FLATMAP - Maps then flattens Equivalent to: arr8.

map(x => [x, x 2]).

flat() FILL - Fills array with value Method Chaining.

Code

const numbers = [1, 2, 3, 4, 5, 6];
const found = numbers.find(num => num > 3);
console.log(found); // 4
const users = [
  { id: 1, name: "Kuldeep", age: 25 },
  { id: 2, name: "Ramesh", age: 30 },
  { id: 3, name: "Suresh", age: 25 }
];
const user = users.find(u => u.age === 25);
console.log(user); // { id: 1, name: "Kuldeep", age: 25 }
const index = numbers.findIndex(num => num > 3);
console.log(index); // 3
const userIndex = users.findIndex(u => u.name === "Ramesh");
console.log(userIndex); // 1
const hasEven = numbers.some(num => num % 2 === 0);
console.log(hasEven); // true
const hasAdult = users.some(u => u.age >= 18);
console.log(hasAdult); // true
const allEven = numbers.every(num => num % 2 === 0);
console.log(allEven); // false
const allAdults = users.every(u => u.age >= 18);
console.log(allAdults); // true
const fruits = ["apple", "banana", "orange"];
console.log(fruits.includes("banana")); // true
console.log(fruits.includes("grape")); // false
const numbers2 = [1, 2, 3, 4, 5];
console.log(numbers2.includes(3, 2)); // true (starts from index 2)
const index2 = fruits.indexOf("banana");
console.log(index2); // 1
const index3 = fruits.indexOf("grape");
console.log(index3); // -1 (not found)
const numbers3 = [1, 2, 3, 2, 1];
console.log(numbers3.lastIndexOf(2)); // 3
const arr = [1, 2, 3, 4, 5];
console.log(arr.slice(1, 3)); // [2, 3] (doesn't modify original)
console.log(arr.slice(2)); // [3, 4, 5] (from index 2 to end)
console.log(arr.slice(-2)); // [4, 5] (last 2 elements)
console.log(arr); // [1, 2, 3, 4, 5] (original unchanged)
const arr2 = [1, 2, 3, 4, 5];
const removed = arr2.splice(1, 2);
console.log(removed); // [2, 3]
console.log(arr2); // [1, 4, 5] (modified)
arr2.splice(1, 0, 2, 3);
console.log(arr2); // [1, 2, 3, 4, 5]
arr2.splice(1, 2, 10, 20);
console.log(arr2); // [1, 10, 20, 4, 5]
const arr3 = [1, 2];
const arr4 = [3, 4];
const arr5 = [5, 6];
const merged = arr3.concat(arr4, arr5);
console.log(merged); // [1, 2, 3, 4, 5, 6]
console.log(arr3); // [1, 2] (original unchanged)
const merged2 = [...arr3, ...arr4, ...arr5];
console.log(merged2); // [1, 2, 3, 4, 5, 6]
const words = ["Hello", "World", "JavaScript"];
console.log(words.join()); // "Hello,World,JavaScript"
console.log(words.join(" ")); // "Hello World JavaScript"
console.log(words.join("-")); // "Hello-World-JavaScript"
const arr6 = [1, 2, 3, 4, 5];
arr6.reverse();
console.log(arr6); // [5, 4, 3, 2, 1]
const arr7 = [1, 2, 3, 4, 5];
const reversed = [...arr7].reverse();
console.log(reversed); // [5, 4, 3, 2, 1]
console.log(arr7); // [1, 2, 3, 4, 5] (original unchanged)
const numbers4 = [3, 1, 4, 1, 5, 9, 2, 6];
numbers4.sort();
console.log(numbers4); // [1, 1, 2, 3, 4, 5, 6, 9]
const numbers5 = [3, 1, 4, 1, 5, 9, 2, 6];
numbers5.sort((a, b) => a - b); // Ascending
console.log(numbers5); // [1, 1, 2, 3, 4, 5, 6, 9]
numbers5.sort((a, b) => b - a); // Descending
console.log(numbers5); // [9, 6, 5, 4, 3, 2, 1, 1]
const users2 = [
  { name: "Kuldeep", age: 25 },
  { name: "Ramesh", age: 30 },
  { name: "Suresh", age: 20 }
];
users2.sort((a, b) => a.age - b.age);
console.log(users2);
const nested = [1, [2, 3], [4, [5, 6]]];
console.log(nested.flat()); // [1, 2, 3, 4, [5, 6]]
console.log(nested.flat(2)); // [1, 2, 3, 4, 5, 6]
console.log(nested.flat(Infinity)); // [1, 2, 3, 4, 5, 6]
const arr8 = [1, 2, 3];
const result = arr8.flatMap(x => [x, x * 2]);
console.log(result); // [1, 2, 2, 4, 3, 6]
const arr9 = new Array(5);
arr9.fill(0);
console.log(arr9); // [0, 0, 0, 0, 0]
const arr10 = [1, 2, 3, 4, 5];
arr10.fill(0, 1, 3); // Fill with 0 from index 1 to 3 (exclusive)
console.log(arr10); // [1, 0, 0, 4, 5]
const result2 = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10]
  .filter(num => num % 2 === 0) // [2, 4, 6, 8, 10]
  .map(num => num * 2) // [4, 8, 12, 16, 20]
  .reduce((acc, num) => acc + num, 0); // 60
console.log(result2); // 60

Summary

Understanding arraymethods is essential for mastering javascript. Practice these examples and experiment with variations to deepen your understanding.

Key Takeaways

• arraymethods is a fundamental concept in javascript
• Practice with these examples to build confidence
• Experiment with variations to explore edge cases
• Understanding arraymethods will help you in technical interviews