Summary of examples of common methods of JavaScript arrays

Common array methods
concat() Method
join() method
pop() Method
push() method
reverse() method
shift() method
slice() Method
sort() method
splice() method
toSource() method
toString() Method
toLocaleString() Method
unshift() Method
valueOf() Method

Introduction: In actual development, front-end engineers not only need to write page layouts and styles but also need to process the data returned by the back-end. Most of the returned data is in JSON format, and generally an object or array is returned. The following summarizes the usage of commonly used arrays to facilitate easy use in development!

Common array methods

concat() Method

The concat() method is used to concatenate two or more arrays.

This method does not mutate the existing array, but simply returns a copy of the concatenated array.

var arr = new Array(3)
arr[0] = "George"
arr[1] = "John"
arr[2] = "Thomas"
 
var arr2 = new Array(3)
arr2[0] = "James"
arr2[1] = "Adrew"
arr2[2] = "Martin"
 
var arr3 = new Array(2)
arr3[0] = "William"
arr3[1] = "Franklin"
 
document.write(arr.concat(arr2,arr3))
//George, John, Thomas, James, Andrew, Martin, William, Franklin

join() method

The join() method is used to put all the elements in an array into a string.

Elements are separated by the specified delimiter.

var arr = new Array(3)
arr[0] = "George"
arr[1] = "John"
arr[2] = "Thomas"
 
document.write(arr.join("."))
//George.John.Thomas

pop() Method

The pop() method is used to remove and return the last element of an array.

var arr = new Array(3)
arr[0] = "George"
arr[1] = "John"
arr[2] = "Thomas"
 
document.write(arr)
 
//George, John, Thomas
 
document.write(arr.pop())
 
//Thomas
 
document.write(arr)
//George, John

push() method

The push() method adds one or more elements to the end of an array and returns the new length.

var arr = new Array(3)
arr[0] = "George"
arr[1] = "John"
arr[2] = "Thomas"
 
document.write(arr + "<br />")//George, John, Thomas
document.write(arr.push("James") + "<br />")
 
document.write(arr)//George, John, Thomas, James

reverse() method

The reverse() method is used to reverse the order of elements in an array.

var arr = new Array(3)
arr[0] = "George"
arr[1] = "John"
arr[2] = "Thomas"
 
document.write(arr + "<br />")//George, John, Thomas
 
document.write(arr.reverse()) //Thomas, John, George

shift() method

The shift() method is used to remove the first element of an array from it and return the value of the first element.

var arr = new Array(3)
arr[0] = "George"
arr[1] = "John"
arr[2] = "Thomas"
 
document.write(arr + "<br />")//George, John, Thomas
document.write(arr.shift() + "<br />")//George
document.write(arr)//John,Thomas

slice() Method

The slice() method returns selected elements from an existing array.

var arr = new Array(3)
arr[0] = "George"
arr[1] = "John"
arr[2] = "Thomas"
 
document.write(arr + "<br />")//George, John, Thomas
document.write(arr.slice(1) + "<br />")//John,Thomas
document.write(arr) //George, John, Thomas

sort() method

The sort() method is used to sort the elements of an array.

function sortNumber(a,b)
{
return a - b
}
 
var arr = new Array(6)
arr[0] = "10"
arr[1] = "5"
arr[2] = "40"
arr[3] = "25"
arr[4] = "1000"
arr[5] = "1"
 
document.write(arr + "<br />")//10,5,40,25,1000,1
document.write(arr.sort(sortNumber))//1,5,10,25,40,1000

splice() method

The splice() method adds or removes elements to or from an array and returns the removed elements.

var arr = new Array(6)
arr[0] = "George"
arr[1] = "John"
arr[2] = "Thomas"
arr[3] = "James"
arr[4] = "Adrew"
arr[5] = "Martin"
 
document.write(arr + "<br />")//George, John, Thomas, James, Adrew, Martin
arr.splice(2,0,"William")
document.write(arr + "<br />")//George, John, William, Thomas, James, Adrew, Martin

toSource() method

The toSource() method represents the source code of an object.

This primitive value is inherited by all objects derived from the Array object.

The toSource() method is usually called automatically by JavaScript behind the scenes and does not appear explicitly in your code.

function employee(name,job,born)
{
this.name=name;
this.job=job;
this.born=born;
}
 
var bill = new employee("Bill Gates","Engineer",1985);
 
document.write(bill.toSource()); //({name:"Bill Gates", job:"Engineer", born:1985})

toString() Method

The toString() method converts an array to a string and returns the result.

var arr = new Array(3)
arr[0] = "George"
arr[1] = "John"
arr[2] = "Thomas"
 
document.write(arr.toString()) //George, John, Thomas

toLocaleString() Method

Convert an array to a local string.

var arr = new Array(3)
arr[0] = "George"
arr[1] = "John"
arr[2] = "Thomas"
 
document.write(arr.toLocaleString()) //George, John, Thomas

unshift() Method

The unshift() method adds one or more elements to the beginning of an array and returns the new length.

var arr = new Array()
arr[0] = "George"
arr[1] = "John"
arr[2] = "Thomas"
 
document.write(arr + "<br />")//George, John, Thomas
document.write(arr.unshift("William") + "<br />")
document.write(arr) // William, George, John, Thomas

valueOf() Method

The valueOf() method returns the primitive value of the Array object.

This primitive value is inherited by all objects derived from the Array object.

The valueOf() method is usually called automatically by JavaScript behind the scenes and does not appear explicitly in your code.

arrayObject.valueOf()

To sum up (the marked array methods are more commonly used and must be mastered)

If you think there are other useful and commonly used array methods, please leave a message and communicate with me! For example, reduce method, etc.!

var result = [
    {
        subject: 'math',
        score: 10
    },
    {
        subject: 'chinese',
        score: 20
    },
    {
        subject: 'english',
        score: 30
    }
];
 
var sum = result.reduce(function(prev, cur) {
    return cur.score + prev;
}, 0);
console.log(sum) //60

Okay, that’s all for this issue. The more you know, the more you don’t know!

This is the end of this article about the examples of common methods of JavaScript arrays. For more relevant JavaScript array content, please search for previous articles on 123WORDPRESS.COM or continue to browse the related articles below. I hope everyone will support 123WORDPRESS.COM in the future!

You may also be interested in:

Summary of several common methods of JavaScript arrays
Summary of some common methods of JavaScript array
Learn the common methods and techniques in JS arrays and become a master
Detailed explanation of common methods for deleting specified values in JS array
Detailed explanation of common methods of JavaScript arrays

<<: MySQL master-slave replication principle and practice detailed explanation

>>: How to view the docker run startup parameter command (recommended)