Most useful Array method in JavaScript.

Most useful Array method in JavaScript.

Javascript Arrays methods in Hindi Top 18 Method in JavaScript learn Array | JavaScript array


Array in JavaScript Create a array in javascript and how to used it.

In JavaScript, arrays aren't primitives but are instead Array objects with the following core characteristics.

JavaScript arrays are resizable and can contain a mix of different data types. (When those characteristics are undesirable, use typed arrays instead.)

Full array video click here

How to create a new array in javascript.

  1. you can used to using array literal notation like this

const fruits = ['Apple', 'Orange', 'Banana'];

console.log(fruits); // ['Apple', 'Orange', 'Banana']

console.log(fruits.length) // 3        

2. you can used to Array() constructor like this


const fruits_2 = new Array('Apple', 'Orange', 'Banana');

console.log(fruits_2); // ['Apple', 'Orange', 'Banana']

console.log(fruits_2.length) // 3
        

3. you can used to String.prototype.split() like this


const fruits_3 = 'Apple, Orange, Banana'.split(', ');

console.log(fruits_3); // ['Apple', 'Orange', 'Banana']

console.log(fruits_3.length) // 3

        

4. Create a string from an array with .join()


const fruits_4 = ['Apple', 'Orange', 'Banana'];

const fruitsString = fruits_4.join(', ');

console.log(fruitsString) // 'Apple, Orange, Banana'
        

5. Access an array item by its index

The index of an array's first element is always 0


const fruits_5 = ['Apple', 'Orange', 'Banana']

console.log(fruits_5[0]) // Apple
console.log(fruits_5[1]) // Orange
console.log(fruits_5[2]) // Banana


        

Using a index number larger than the array's length

returns 'undefined'.


fruits_5[9999] // undefined
        

6. Find the index of an item in an array


const fruits_6 = ['Apple', 'Orange', 'Banana']

console.log(fruits_6.indexOf('Banana')) // 2 it's give to you array of index
        

7. Check if an array contains a certain item

This example shows two ways to check if the fruits_7 array contains "Banana" and "Cherry": first with the includes() method, and then with the indexOf() method to test for an index value that's not -1


    const fruits_7 = ['Apple', 'Orange', 'Banana']
    
          fruits_7.includes('Banana'); // true
        
          fruits_7.includes('Cherry'); // false
      
                

If indexOf() doesn't return -1, the array contains the given item.


fruits_7.indexOf('Banana') !== -1; 

fruits_7.indexOf('Cherry') !== -1; 
        

8. Append an item to an array push method to append a new string to the fruits_8 array


const fruits_8 = ['Apple', 'Orange', 'Banana'];

fruits_8.push('Cherry');

console.log(fruits_8.length) // 4

        

9. Remove the last item from an array

pop method to remove a string to the fruits_9 array


const fruits_9 = ['Apple', 'Orange', 'Banana'];

const removedItem = fruits_9.pop();

console.log(fruits_9.length) // 2
        

10. Remove multiple items from the end of an array


const fruits_10 = ['Apple', 'Banana', 'Strawberry', 'Mango', 'Cherry'];

const start = -3;

const removedItems = fruits_10.splice(start);

console.log(fruits_10) // ['Apple', 'Banana']
        



const fruits_11 = ['Apple', 'Banana', 'Strawberry', 'Mango', 'Cherry'];

const start = 2;

const removedItems = fruits_11.splice(start);

console.log(fruits_11) // ['Apple', 'Banana']
        


12. Remove the first item from an array shift() method to remove the first item


const fruits_12 = ['Apple', 'Banana'];

const removedItem = fruits_12.shift();

console.log(fruits_12); // ['Banana'];
        


13. Remove multiple items from the beginning of an array splice() method to remove the first 3 items


const fruits_13 = ['Apple', 'Strawberry', 'Cherry', 'Banana', 'Mango']

 const start = 0;

 const deleteCount = 3;

 const removedItems = fruits_13.splice(start, deleteCount);

 console.log(fruits_13); // ['Banana', 'Mango']
        

14. Add a new first item to an array unshift() method to add, at index 0


const fruits_14 = ['Banana', 'Mango']

 const newLength = fruits_14.unshift('Strawberry');

 console.log(fruits_14); // ['Strawberry', 'Banana', 'Mango']

 console.log(newLength); // 3
        

15. Remove a single item by index uses the splice() method to remove the string "Banana" from the fruits array — by specifying the index position of "Banana".


const fruits_15 = ['Strawberry', 'Banana', 'Mango']

 const start = fruits_15.indexOf('Banana');

 const deleteCount = 1;

 const removedItems = fruits_15.splice(start, deleteCount);

 console.log(fruits_15); // ['Strawberry', 'Mango']

 console.log(removedItems); // ['Banana']
        


16. Merge multiple arrays together concat() method to merge


const fruits_16 = ['Apple', 'Banana', 'Strawberry']

 const moreFruits = ['Mango', 'Cherry'];

 const combinedFruits = fruits_16.concat(moreFruits);

 console.log(combinedFruits); // ?['Apple', 'Banana', 'Strawberry', 'Mango', 'Cherry']
        

17. Copy an array with ...spread operator ES6


const fruits_17 = ['Strawberry', 'Mango']

 const fruitsCopy = [...fruits_17];
        

18. Deep copy and shallow different copy different and how to resolve It's.


const fruits_18 = ['Apple',{'name':'Rohit', 'age':34, 'address':{'city':'delhi', 'country':'In'}}, true, 23, [1,2,3,4,5,6,{'office':[{'address':'Noida UP India'}]}]]

        

we try to this


const shallowCopy_Array = [...fruits_18]

shallowCopy_Array[1].name = 'RAM';

console.log(shallowCopy_Array[1].name) // RAM

console.log(fruits_18[1].name) // RAM

        

we used to ...spread operator but it's copy only shallow not deep copy

we used to here JSON.stringify() and JSON.parse() for Deep Copy


const deepCopy_Array = JSON.stringify(fruits_18);

      deepCopy_Array = JSON.parse(deepCopy_Array);

      deepCopy_Adrray[1].name ='Ram'?
      
      console.log(deepCopy_Adrray[1].name) // Ram
      
      console.log(fruits_18[1].name) // Rohit
                    


If you want watch to this in video then go to my youtube channel

Chetan Nada

React.js | Next.js | 35k+ @Linkedin | JavaScript | Frontend Developer

2 年

useful methods.

要查看或添加评论,请登录

Rohit Azad的更多文章

社区洞察

其他会员也浏览了