Summary of JavaScript Array Method

1. Generating arrays from strings

split() splits the string and saves the split part as an element in a new array.

    var  str1 = "this is an emample to using the method of array .";
    var str2 = str1.split(" "); //Spaces as the partition condition
    for(var i = 0; i< str2.length; i++ ){
        console.log(str2[i]);
    }

2. Finding Elements

indexOf() is used to find whether an element exists in the target array. If it exists, it returns the location index of the element that appears for the first time in the array. If it does not exist, it returns - 1.

lastIndexof() works the same as indexOf(), but returns the location index of the last element in the same element.

    var names = ["one", "two", "three", "four", "five", "one"];
    var position = names.indexOf("one");
    if(position >= 0){
        console.log("Found " + name + " at position " + position);
    }else{
        console.log(name + "not found in array .");
    }
    // Found  at position 0
    var position2 = names.lastIndexOf("one");
    console.log("Found at position " + position2); 
    // Found at position 5

3. String representation

Convert arrays to strings: join() and toString()

    var str1 = ["one", "two", "three", "four", "five"];

    var str2= str1.join();
    console.log(str2); // one,two,three,four,five

    str2= str1.toString();
    console.log(str2); // one,two,three,four,five

    console.log(str1); // ["one", "two", "three", "four", "five"]

4. Create new arrays from existing arrays

concat() is used to merge multiple arrays to create a new array.

splice() intercepts a subset of an array to create a new array.

    var str1 = ["one", "two", "three", "four", "five"];
    var str2 = ["six", "seven", "eight","nine","ten"];

    var str3 = str1.concat(str2);
    console.log(str3);  // ["one", "two", "three", "four", "five", "six", "seven", "eight"]

    var str4 = str2.splice(2,4);
    console.log(str4);  // ["eight", "nine", "ten"]

5. Adding elements to arrays

push() adds an element to the end of the array.

unshift() adds elements to the beginning of an array.

    var num1 = [1, 2, 3, 4, 5];
    console.log(num1);   // [1, 2, 3, 4, 5]

    num1.push(6);
    console.log(num1);   // [1, 2, 3, 4, 5, 6]

    var s1 = num1.push();
    console.log(s1); // 6

    num1[num1.length] = 10;
    console.log(num1);  // [1, 2, 3, 4, 5, 6, 10]

    num1.unshift("one", "two");
    console.log(num1); //  ["one", "two", 1, 2, 3, 4, 5, 6, 10]

    var s2 = num1.unshift();
    console.log(s2); // 9

6. Delete elements from arrays

pop() deletes the element at the end of the array.

shift() deletes the first element in the array.

    var num1 = [1, 2, 3, 4, 5];

    num1.pop();
    console.log(num1); // [1, 2, 3, 4]

    var  s = num1.pop(); 
    console.log(s); // 4

    num1.shift();
    console.log(num1); //  [2, 3]

    var s3 = num1.shift(); 
    console.log(s3); //  2
    console.log(num1); // [3]

7. Adding and deleting elements from the middle of the array

splice

    var str = [1, 2, 3, 7, 8 , 9];
    var nStr = [4, 5, 6];

    str.splice(6,0,10,11,12);
    console.log(str);  //  [1, 2, 3, 7, 8, 9, 10, 11, 12]

    str.splice(3, 0, nStr);
    console.log(str);  //  [1, 2, 3, Array [3], 7, 8, 9, 10] Array [3] is an array: [4, 5, 6]

    str.splice(3,4);
    console.log(str);  // [1, 2, 3, 10, 11, 12]

8. Sort arrays

reverse() reverses the order of elements in an array.

sort() sorts the elements in dictionary order.

    var num1 = [1, 2, 3, 4, 5];
    var num2  = [2, 5,1 ,7, 100, 3, 20];
    var str = ["one", "two", "three", "four", "five"];

    num1.reverse();
    console.log(num1);  // [5, 4, 3, 2, 1]

    str.sort();
    console.log(str);   // ["five", "four", "one", "three", "two"]

    // sort()Just sort in dictionary order
    num2.sort();
    console.log(num2);  //  [1, 100, 2, 20, 3, 5, 7]  

    // Improvementsort()sort
    function compare(n1, n2){
        return n1-n2;
    }
    num2.sort(compare);
    console.log(num2);  // [1, 2, 3, 5, 7, 20, 100]

9. Iterator Method

(1) Iterator method without generating new arrays

The foreach() method takes a function as a parameter and uses it for each element in the array.

every() method accepts a function whose return value is Boolean, and uses it for each element in the array. If it returns true for all elements, the method returns true, otherwise it returns false.

some() method also accepts a function whose return value is Boolean, but this method returns true as long as it has an element to make the function return true.

The reduce() method accepts a function and returns a value. This method starts with an accumulative value and calls the function on the accumulative value and subsequent elements in the array until the last element in the array is returned to the accumulative value.

The difference between the reduceRight() method and the reduce() method is that it executes from right to left.

    // forEach() method
    function square(num){
        console.log(num, num * num);
    }
    var num1 = [1, 2, 3, 4, 5];
    num1.forEach(square);


    // every() method
    function isEven(num){
        return num % 2 == 0;
    }
    var num2 = [6, 7, 8, 9, 10];
    var even = num2.every(isEven);
    if(even){
        console.log("all numbers are even .");
    }else{
        console.log("not all numbers are even .");
    }
    // Results: not all numbers are even


    // some() method
    function isEven(num){
        return num % 2 == 0;
    }
    var num3 = [1, 2, 3, 4, 5, 6, 7];
    var someEven1 = num3.some(isEven);
    if(someEven1){
        console.log("some numbers are even .");
    }else{
        console.log("no numbers are even .");
    }
    // Results: some numbers are even.

    var num4 = [1,3,5,7,9];
    var someEven2 = num4.some(isEven);
    if(someEven2){
        console.log("some numbers are even .");
    }else{
        console.log("no numbers are even .");
    }
    //Results: no numbers are even.


    // reduce() method
    function add(runTotal, currentValue){
        return runTotal + currentValue;
    }
    var num6 = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10];
    var num7 = num6.reduce(add);
    console.log(num7); //Results: 55

    function concat(accString, item){
        return accString + item;
    }
    var str1= ["one", "two", "three", "four", "five"];
    var str2 = str1.reduce(concat) ;
    console.log(str2);  // onetwothreefourfive


    // ReducRight () method
    function concat(accString, item){
        return accString + item;
    }
    var str3= ["one", "two", "three", "four", "five"];
    var str4 = str3.reduceRight(concat) ;
    console.log(str4); // fivefourthreetwoone
(2) Iterator method for generating new arrays

The map() method uses a function for each element in an array, which is the result of a function of the original element.

The filter() method passes in a function whose return value is Boolean. When all elements in an array are used with the function, the result is true, unlike every() method, which returns true, the filter() method returns a new array, which contains elements whose result is true after using the function.

    // map() method
    function curve(num){
        return num += 5;
    }
    var num1 = [5, 15, 25, 35, 45];
    var num2 = num1.map(curve);
    console.log(num2); // [10, 20, 30, 40, 50]

    function getFirstWord(str){
        return str[0];
    }
    var str1 = ["one", "two", "three", "four"];
    var str2 = str1.map(getFirstWord);
    console.log(str2); // ["o", "t", "t", "f"]


    // filter () method

    //Example 1
    function isEven(num){
        return num % 2 == 0;
    }
    function isOdd(num){
        return num % 2 != 0;
    }
    var num3 = [];
    for(var i = 0 ; i < 20; i++){
        num3[i] = i+1;
    }
    var even = num3.filter(isEven);
    console.log("Even numbers :  " + even);  // Even numbers :  2,4,6,8,10,12,14,16,18,20

    var odd = num3.filter(isOdd);
    console.log("Even numbers :  " +odd);  // Even numbers :  1,3,5,7,9,11,13,15,17,19

    //Example 2
    function passing(num){
        return num >= 60;
    }
    var num4 = [];
    for(var i = 0 ; i < 20; i++){
        num4[i] = Math.floor(Math.random() * 101);
    }
    var num5 = num4.filter(passing);
    console.log("all numbers :  " + num4);
    // all numbers :  91,92,12,21,99,98,37,99,64,37,47,49,64,75,45,7,85,94,29,24
    console.log("passing numbers :  " + num5);
    // passing numbers :  91,92,99,98,99,64,64,75,85,94

    // Example 3
    function delAfterC (str){
        if(str.indexOf("cie") > -1){
            return true;
        }
        return false;
    }
    var str3 = ["recieve", "deceive", "percieve", "deceit", "concieve"];
    var str4 = str3.filter(delAfterC);
    console.log(str4); // ["recieve", "percieve", "concieve"]

PS: This article is just a summary of personal learning. If there are any deficiencies, please contact us for guidance.

Posted by Percadan on Thu, 13 Jun 2019 10:32:43 -0700