5 Array Methods in JavaScript | Part 1 | Mastering JavaScript
Hey and welcome to another video in Mastering JavaScript series in this video we gonna take look at 5 array methods and they are push, pop, find, isArray and some. understanding each one use cases, without further to say.
let's get start with first method which is push.
PUSH
The push() method is used to add one or more elements to the end of an array and returns the new length of the array. It mutates the original array by adding the specified element(s) to it. This method is commonly used to dynamically grow an array by appending new values to it.
Easy Example:
1
2
3
4
5
6
7
8
9
// Define an empty array
let fruits = [];
// Use push() to add elements to the array
fruits.push("apple");
fruits.push("banana");
fruits.push("cherry");
console.log(fruits); // Output: ["apple", "banana", "cherry"]
Advanced Example:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
// Define an array of numbers
let numbers = [1, 2, 3, 4, 5];
// Define a function to generate and push squares of numbers
function pushSquares(arr, n) {
for (let i = 1; i <= n; i++) {
arr.push(i * i);
}
}
// Use the pushSquares function to add squares of numbers up to 7
pushSquares(numbers, 7);
console.log(numbers); // Output: [1, 2, 3, 4, 5, 1, 4, 9, 16, 25, 36, 49]
POP
the second method in list is the pop() method is used to remove and return the last element from an array. It mutates the original array by removing the last element.
Easy Example:
1
2
3
4
5
6
7
8
// Define an array of colors
let colors = ["red", "green", "blue", "yellow"];
// Use pop() to remove and return the last color
let lastColor = colors.pop();
console.log(lastColor); // Output: "yellow"
console.log(colors); // Output: ["red", "green", "blue"]
Advanced Example:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
// Define an array of tasks
let tasks = [
{ id: 1, description: "Write code", completed: false },
{ id: 2, description: "Read documentation", completed: false },
{ id: 3, description: "Test functionality", completed: true }
];
// Define a function to remove and return the last task
function popLastTask(arr) {
if (arr.length === 0) {
return null; // Return null if the array is empty
} else {
return arr.pop();
}
}
// Use the popLastTask function to remove the last task
let removedTask = popLastTask(tasks);
console.log(removedTask); // Output: { id: 3, description: "Test functionality", completed: true }
console.log(tasks); // Output: [{ id: 1, description: "Write code", completed: false }, { id: 2, description: "Read documentation", completed: false }]
FIND
next method, the find() method is used to search for the first element in an array that satisfies a given condition and returns that element. If no element satisfies the condition, it returns undefined.
Easy Example:
1
2
3
4
5
6
7
8
9
// Define an array of numbers
let numbers = [1, 3, 5, 7, 9];
// Use find() to find the first even number
let evenNumber = numbers.find(function (element) {
return element % 2 === 0;
});
console.log(evenNumber); // Output: undefined (no even number found)
Advanced Example:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
// Define an array of objects representing books
let books = [
{ id: 1, title: "The Catcher in the Rye", author: "J.D. Salinger" },
{ id: 2, title: "To Kill a Mockingbird", author: "Harper Lee" },
{ id: 3, title: "1984", author: "George Orwell" },
{ id: 4, title: "The Great Gatsby", author: "F. Scott Fitzgerald" }
];
// Define a function to find a book by its title
function findBookByTitle(title) {
return books.find(function (book) {
return book.title === title;
});
}
// Use the findBookByTitle function to find a book by title
let book = findBookByTitle("1984");
console.log(book); // Output: { id: 3, title: "1984", author: "George Orwell" }
IsArray
fourth method, the Array.isArray() method is used to check if a given value is an array or not. It returns true if the value is an array and false otherwise.
Easy Example:
1
2
3
4
5
6
// Check if a variable is an array
let fruits = ["apple", "banana", "cherry"];
let number = 42;
console.log(Array.isArray(fruits)); // Output: true
console.log(Array.isArray(number)); // Output: false
Advanced Example:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
// Define a function that accepts an array and checks its type
function processArray(arr) {
if (Array.isArray(arr)) {
console.log("Processing the array:", arr);
// Perform array-specific operations here
} else {
console.log("Input is not an array:", arr);
// Handle non-array input
}
}
let myArray = [1, 2, 3];
let myString = "Hello, World!";
processArray(myArray); // Output: Processing the array: [1, 2, 3]
processArray(myString); // Output: Input is not an array: Hello, World!
SOME
final method, the some() method is used to check if at least one element in an array satisfies a given condition. It returns true if at least one element meets the condition, otherwise, it returns false.
Easy Example:
1
2
3
4
5
6
7
8
// Check if there is at least one even number in an array
let numbers = [1, 3, 5, 6, 7, 9];
let hasEvenNumber = numbers.some(function (element) {
return element % 2 === 0;
});
console.log(hasEvenNumber); // Output: true (6 is an even number)
Advanced Example:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
// Define an array of objects representing users
let users = [
{ id: 1, name: "Alice", isAdmin: true },
{ id: 2, name: "Bob", isAdmin: false },
{ id: 3, name: "Charlie", isAdmin: false },
{ id: 4, name: "David", isAdmin: true }
];
// Check if there is at least one admin user
let hasAdminUser = users.some(function (user) {
return user.isAdmin === true;
});
console.log(hasAdminUser); // Output: true (Alice and David are admin users)
conclusion
As we wrap up, I'd like to express my gratitude for your engagement up to this point. If you have any questions, please don't hesitate to ask in the video comments section. Also, if you find value in content, dot not forget to like video and subscribing to channel. Stay tuned for more exciting content in the future!