JavaScript Array Functions

Array Functions In JavaScript that make your code clean!

In the programming field, an array is a collection of elements or items. Arrays keep the information as factors and retrieve them again whilst you want them. The array records structure is broadly utilized in all programming languages. In this manual, I will guide you all about arrays in JavaScript. You’ll come to know about some complicated statistics coping, destructuring, some most used array methods and more.

An array is a linear data structure in JavaScript. It can store primitive data like strings, numbers, boolean values and even non-primitive data like objects and arrays. We will be discussing array functions in-depth further in this blog. Arrays in JS are the information typically used to keep a record of values. JavaScript array objects can be stored in variables and can be handled in the same way as other regular variables.

The elements in an array are enclosed within square brackets. For example –

let products = ["eggs", "bread", "milk"];

Let us look at the javascript in-built array functions now.

Popping and Pushing

It becomes easy to add and remove elements when we code with arrays. Popping elements out of an array and pushing elements into an array can be done as follows.

Array pop() – the pop() method eliminates the last object from an array.

const products = ["milk", "eggs", "bread", "butter"];
products.pop();
console.log(products)    // ["milk", "eggs", "bread"]

Array push() – the push() method adds a new item at the end of the array.

const products = ["milk", "eggs", "bread", "butter"];
products.push("jam");console.log(products)    //  ["milk", "eggs", "bread", "butter", "jam"]

Shifting Elements

Shifting is the same as popping, but instead of the last element, it pops out the first element and then shifts the array. The shifting happens such that, the second element comes to the zeroth index.

Array shift() – in shift() method it eliminates the first element and moves(shifts) all elements to a bottom index.

const products = ["milk", "eggs", "bread", "butter"];
products.shift();
console.log(products)    //  ["eggs", "bread", "butter"]

Array unshift() – this method adds a new element at the beginning of an array and shifts the rest of the elements to the right.

const products = ["milk", "eggs", "bread", "butter"]; 
products.unshift("oats");
console.log(products)    //  ["oats", "milk", "eggs", "bread", "butter"]

Splicing and Slicing Arrays

Array splice() – This method allows both addition and removal of items in an array. The first argument is basically the index where new elements need to be added or removed. The second element tells the number of elements to delete from the mentioned index. The rest of the arguments in splice() are the new elements to be added starting from the mentioned index in the first argument.

const products = ["milk", "eggs", "bread", "butter"]; 
products.splice(2, 1, "oats", "jam");
console.log(products);    //  ["milk", "eggs", "oats", "jam", "butter"]

Above “oats” and “jam” are added at index 2. And one element (bread) is removed at index 2. The deletion happens before the addition. Also, splice() changes the original array.

Array slice() – This method returns the selected piece of an array. It doesn’t change the original array. The first argument is the index to start the slicing from. The second argument is the index before which we want to end the slicing.

let products = ["milk", "eggs", "bread", "butter"]; 
let slice1 = products.slice(1);
console.log(slice1);    // ["eggs", "bread", "butter"]
let slice2 = products.slice(1, 2);
console.log(slice2);    // ["eggs"]

Array.Prototype.filter() – It returnsa new array that has selective elements from the array. The elements are accepted or rejected based on some set condition. It accepts a callback function which contains the condition logic. This callback function has to givea true or false value. Elements for which the callback value is true are accepted in the newreturned array.

<script>
    const arr = [1, 1, 0, 7, 2, 3, 4] 
    const filteredArray = arr.filter( element => element > 2 )
    console.log(filteredArray)    // [7, 3, 4]
</script>

Conclusion

With all the above points and array functions i.e, popping and pushing, shifting elements, splicing and slicing array and array.prototype.filter, we conclude this blog. All these above array functions in JS were the most important which makes our code easy and clean. Hope you learned something new today. If you are interested in learning javascript decently, then Codedamn is the best platform. You will find blogs, courses and a lot more to learn from.

Array Functions In JavaScript that make your code clean!

Popping and Pushing

Shifting Elements

Splicing and Slicing Arrays

Conclusion

No comments so far