Array method in js

js array method finishing

Today, I will share with you some js array methods. We will often use these methods in the project. There are many methods that are not often used, and may be forgotten after a while, so I will sort out some methods for your convenience. Inquire.

1. concat()
function: Merge arrays, you can merge one array or multiple arrays, it will return the data after the merged array, and will not change the original array.
eg:

        var arr=[1,2,3,'hi'];
        var arr1=['你好']
        console.log(arr.concat(arr1));             // [1,2,3,'hi','你好']
        console.log(arr);                         //[1,2,3,'hi']

2. join()
function: convert the array into a string and return the data of the converted string without changing the original array.
Note: Use double quotes in ( ) to include the delimiter you want to use. The default is a comma. For the convenience of viewing, I use - here.
eg:

    var arr=[1,2,3,'hi'];
    var arr1=['你好']
    console.log(arr.join(-));                  // 1-2-3-'hi'
    console.log(arr);                         //[1,2,3,'hi']

3. pop()
function: delete the last digit of the array and return the deleted data, which will change the original array.
eg:

    var arr=[1,2,3,'hi'];
    var arr1=['你好']
    console.log(arr.pop());                    // hi
    console.log(arr);                         //[1,2,3]

4. shift()
function: delete the first data of the array and return the length of the new array, which will change the original array.
eg:

    var arr=[1,2,3,'hi'];
    var arr1=['你好']
    console.log(arr.shift());                  // 1
    console.log(arr);                         //[2,3,'hi']

5. unshift()
function: add one or more data at the first position of the array, and return the length of the new array, which will change the original array.
Note: The data returned by the unshift() method is the length of the new array, and the data it adds can be one or more.
eg:

    var arr=[1,2,3,'hi'];
    var arr1=['你好']
    console.log(arr.unshift('word'));                  // 5
    console.log(arr1.unshift('marry'));               //  2
    console.log(arr);                                // ['word',1,2,3,'hi']
    console.log(arr1);                              // ['marry','你好']

6. push()
function: add one or more data to the last digit of the array, and return the length of the new array, which will change the original array.
Note: The data returned by the push() method is the length of the new array, and the data it adds can be one or more.
eg:

    var arr=[1,2,3,'hi'];
    var arr1=['你好']
    console.log(arr.push('word'));                     // 5
    console.log(arr1.push('marry'));                  //  2
    console.log(arr);                                // [1,2,3,'hi','word']
    console.log(arr1);                              // ['你好','marry']

7. reverse()
function: reverse the data of the array and return the reversed array, which will change the original array.
eg:

    var arr=[1,2,3,'hi'];
    console.log(arr.reverse());                // ['hi',3,2,1]
    console.log(arr);                         // ['hi',3,2,1]

8. splice()
function: add to or delete from the array, or replace the elements in the array, and then return the deleted and replaced elements.
Parameters: splice(start,num,data1,data2,…). All parameters are optional.
eg:

    var arr=[1,2,3,'hi'];
    console.log(arr.spilce(2,0,"a","b"));      // []
    console.log(arr);                         // [1,2,"a","b",3,"hi"]

9. toString()
function: converts an array to a string, similar to join() without parameters, this method will be called when the data is implicitly converted. If it is called manually, it will be directly converted to a string and will not change original array.
eg:

    var arr=[1,2,3,'hi'];
    console.log(arr.spilce(2,0,"a","b"));      // 1,2,3,'hi'
    console.log(arr);                         // [1,2,3,"hi"]

10. valueOf()
function: Returns the original value of the array (usually the array itself), which is usually called by js in the background, and does not appear in the code.
eg:

    var arr=[1,2,3,'hi'];
    console.log(arr.valueOf());                // [1,2,3,'hi']
    console.log(arr);                         // [1,2,3,"hi"]
    console.log(arr.valueOf()==arr);         // true

11. indexOf()
function: According to the specified data, from left to right, query the position in the array, if the specified data does not exist, return -1, find the specified data, and return the index of the data.
Parameters: indexOf(value,start), value is the data to be queried, start is optional, indicating the position to start the query, when start is a negative number, count forward from the end of the data, if the existence of value cannot be queried, then The method returns -1.
Note: If the data is found, return the index of the data directly, and do not continue to search for
eg:

	 var str = ["h","e","l","l","o"];
	 console.log(str.indexOf("l"));        //2
	 console.log(str.indexOf("l",3));      //3
	 console.log(str.indexOf("l",4));      //-1
	 console.log(str.indexOf("l",-1));     //-1
	 console.log(str.indexOf("l",-3));     //2

12. forEach()
function: a new method in es5, used to traverse the array, with no return value.
Parameters: forEach(callback); callback has three parameters by default, namely value (data of the traversed array), index (corresponding index), self (array itself)
eg:

var arr = ["Tom","Jack","Lucy","Lily","May"];
var a = arr.forEach(function(value,index,self){
    
    
     console.log(value + "--" + index + "--" + (arr === self));
})
// 打印结果为:
// Tom--0--true
// Jack--1--true
// Lucy--2--true
// Lily--3--true
// May--4--true
console.log(a);     //undefined---forEach没有返回值
//该方法为遍历方法,不会修改原数组

13. map()
function: 1. Same as forEach function;
2. The callback function of map will return the execution result, and finally map will return the return value of the callback function into a new array to return.
Parameter map(callback); callback has three parameters by default: value, index, self
eg:

//功能1:同forEach
    var arr = ["Tom","Jack","Lucy","Lily","May"];
    var a = arr.map(function(value,index,self){
    
    
        console.log(value + "--" + index + "--" + (arr === self))
    })
    // 打印结果为:
    // Tom--0--true
    // Jack--1--true
    // Lucy--2--true
    // Lily--3--true
    // May--4--true

    //功能2:每次回调函数的返回值被map组成新数组返回
    var arr = ["Tom","Jack","Lucy","Lily","May"];
    var a = arr.map(function(value,index,self){
    
    
        return "hi:"+value;
    })
    console.log(a);     //["hi:Tom", "hi:Jack", "hi:Lucy", "hi:Lily", "hi:May"]
    console.log(arr);   //["Tom", "Jack", "Lucy", "Lily", "May"]---原数组未改变

14. filter()
function: 1. Same as forEach function
2. The callback function of filter needs to return a boolean value. When it is true, the data of the current array is returned to the filter, and finally the filter combines the return values ​​of all callback functions into a new array Return (can be understood as filtering).
Parameters: filter(callback), callback parameters are value, index, self
eg:

//功能1:同forEach
    var arr = ["Tom","Jack","Lucy","Lily","May"];
    var a = arr.filter(function(value,index,self){
    
    
        console.log(value + "--" + index + "--" + (arr === self))
    })
    // 打印结果为:
    // Tom--0--true
    // Jack--1--true
    // Lucy--2--true
    // Lily--3--true
    // May--4--true

    //功能2:当回调函数的返回值为true时,本次的数组值返回给filter,被filter组成新数组返回
    var arr = ["Tom","Jack","Lucy","Lily","May"];
    var a = arr.filter(function(value,index,self){
    
    
        return value.length > 3;
    })
    console.log(a);         //["Jack", "Lucy", "Lily"]
    console.log(arr);       //["Tom", "Jack", "Lucy", "Lily", "May"]---原数组未改变

Guess you like

Origin blog.csdn.net/weixin_44237840/article/details/114012605