CRUD Operation with Array in JavaScript

We often use an array in every project for data manipulation.

Let’s play with the CRUD operation.

Create

Create an array. It will contain programming languages.

const programmingLanguages = ["JavaScript", "Python"];

Read

We have a lot of options to read it.

Print the entire array in a referenced way.

console.log(programmingLanguges); // (2) ["JavaScript", "Python"]

Print the first item by using index

console.log(programmingLanguages[0]); // JavaScript

Print all items by using for loop

for(var i = 0; i<programmingLanguages.length; i++) {
    console.log(programmingLanguages[i]);
    // JavaScript
    // Python
}

The above snippet will print all items of the array individually.

Print all items by using forEach

Cleaner way to print all items.

programmingLanguages.forEach((item, index) => {
     console.log(`${index}. ${item}`);
     // 0. JavaScript
     // 1. Python
});

Add New

Let’s add a new language to the array using push().

programmingLanguages.push("Java");
// ["JavaScript", "Python", "Java"]

Update

Let’s update java with C# using splice()

programmingLanguages.splice(2, 1, "C#")
// (3) ["JavaScript", "Python", "C#"]

splice() is used to add, update or delete an item from the array

The first parameter selects the item by index

2nd parameter selects the number of items

3rd parameter add a new item of the selected item

Read more about splice

Delete

Let’s delete the C# from the language array.

We will use splice() again but this time we will pass only 2 parameters.

programmingLanguages.splice(2, 1);
// (2) ["JavaScript", "Python"]

That's It.

${HappyCode}