Detailed description of JavaScript Array object, javascriptarray

Source: Internet
Author: User
Tags javascript array

Detailed description of JavaScript Array object, javascriptarray

This article introduces the Array objects of Js. The details are as follows:

Directory
1. Introduction: Describes the description, definition method, and attributes of Array objects.

2. instance method: This section describes how to use an Array object as an example: concat, every, filter, forEach, indexOf, join, lastIndexOf, map, pop, push, reverse, shift, slice, sort, splice, toString, tounshift, etc.

3. Static Method: Introduce the static method of Array object: Array. isArray ().

4. Actual Operation: perform the following operations on the Array: Index, for traversal, shortest copy, and deep copy.

I. Introduction
1.1 description

An array is an ordered set of values. Each value is called an element, and each element has a position in the array, which is represented by numbers and is called an index. JavaScript arrays are non-typed: array elements can be of any type, and different elements in the same Array may have different types. -- JavaScript authoritative guide (version 6)

1.2 definition method

Var names = new array ("Zhang San", "Li Si", "Wang Wu");
/ / or
Var names = ["Zhang San", "Li Si", "Wang Wu"];

1.3 attributes

Length: the length of elements in the array.

Ii. instance method
Common Methods:

1) unshift (): insert an element in the array Header

2) shift (): removes and returns the first element of the array.

3) push (): insert an element at the end of the array

4) pop (): removes and returns the last element of the array.

2.1 concat (): concatenates an element into an array. The original array is not modified, and a new array is returned.

Parameters:

① Value1, value2...... valueN: any number of values

Return Value:

{Array} is a new Array that contains the original Array and new elements.

Example:

var demoArray = ['a', 'b', 'c'];
var demoArray2 = demoArray.concat('e');
Console.log (demoarray); / / = > demoarray: ['a ',' B ',' C '] the original array does not change
console.log(demoArray2); // => ['a','b','c','e']

2.2 every (): traverse the elements in sequence to determine whether each element is true.

Parameters:

① Function (value, index, self) {}: each element uses this function to determine whether it is true. When it is determined that it is false, the traversal ends immediately.

Value: Elements of array traversal.

Index: element number

Self: Array itself

Return Value:

{Boolean}: true is returned only when each element is true. If one element is false, false is returned.

Example:

var demoArray = [1, 2, 3];
var rs = demoArray.every(function (value, index, self) {
 return value > 0;
});
console.log(rs); // => true

2.3 filter (): traverses elements in sequence and returns a new array containing elements that meet the conditions.

Parameters:

① Function (value, index, self) {}: each element calls this function in turn and returns a new array containing the elements that meet the conditions.

Value: Elements of array traversal.

Index: element number

Self: Array itself

Return Value:

{Array} a new Array containing qualified elements

Example:

var demoArray = [1, 2, 3];
var rs = demoArray.filter(function (value, index, self) {
 return value > 0;
});
console.log(rs); // => [1, 2, 3]

2.4 forEach (): traverses elements in sequence and executes the specified function. No return value is returned.

Parameters:

① Function (value, index, self) {}: each element calls this function in turn

Value: Elements of array traversal.

Index: element number

Self: Array itself

Return Value: None

Example:

var demoArray = [1, 2, 3];
demoArray.forEach(function (value, index, self) {
Console.log (value); / / = > output successively: 1 2 3
};

2.5 indexOf (): searches for matching elements in the array. If no matching element exists,-1 is returned. When searching, use the "=" operator. Therefore, distinguish between 1 and '1'

Parameters:

① Value: the value to be searched in the array.

② Start: the position of the sequence number to start searching. If it is omitted, It is 0.

Return Value:

{Int}: returns the sequence number of the first matched value in the array. If no value exists,-1 is returned.

Example:

['a', 'b', 'c'].indexOf('a'); // =>0
['a', 'b', 'c'].indexOf('a', 1); // =>-1
['a', 'b', 'c'].indexOf('d'); // =>-1
[1, 2, 3]. Indexof ('1 '); / / = > 1: adopted' = = 'matching method

2.6 join (): concatenates all elements in the array into a string using a separator.

Parameters:

① Sparator {String}: The separator between each element. If omitted, it is separated by commas (,) by default.

Return Value:

{String}: A String concatenated by sparator.

Example:

['a', 'b', 'c'].join(); // => 'a,b,c'
['a', 'b', 'c'].join('-'); // => 'a-b-c'

2.7 lastIndexOf: reverse searches for matching elements in the array. If no matching element exists,-1 is returned. When searching, use the "=" operator. Therefore, distinguish between 1 and '1'

Parameters:

① Value: the value to be searched in the array.

② Start: the position of the sequence number to start searching. If this parameter is omitted, the sequence number is searched from the last element.

Return Value:

{Int}: searches for the sequence number of the first matched value in the array from right to left. If no value exists,-1 is returned.

Example:

['a', 'b', 'c'].lastIndexOf('a'); // => 0
['a', 'b', 'c'].lastIndexOf('a', 1); // => 0
['a', 'b', 'c'].lastIndexOf('d'); // => -1
[1, 2, 3]. LastIndexOf ('1 '); / / = > 1: used' = = 'matching method

2.8 map (): traverse and calculate each element in sequence, and return the array of the calculated elements.

Parameters:

① Function (value, index, self) {}: each element calls this function in sequence and returns the computed element.

Value: Elements of array traversal.

Index: element number

Self: Array itself

Return Value:

{Array} a new Array containing even good elements

Example:

[1, 2, 3].map(function (value, index, self) {
 return value * 2;
}); // => [2, 4, 6]

2.9 pop (): removes and returns the last element of the array.

Parameter: None

Return Value:

The last element of the {Object} array. If the array is empty, undefined is returned.

Example:

var demoArray = ['a', 'b', 'c'];
demoArray.pop(); // => c
demoArray.pop(); // => b
demoArray.pop(); // => a
demoArray.pop(); // => undefined

2.10 push (): add the element to the end of the array

Parameters:

① Value1, value2...... valueN: add any number of values to the end of the array.

Return Value:

New length of {int} Array

Example:

var demoArray = ['a', 'b', 'c'];
demoArray.push('d'); // => 4, demoArray : ['a', 'b', 'c', 'd']
demoArray.push('e', 'f'); // => 6, demoArray :['a', 'b', 'c', 'd', 'e', 'f']
console.log(demoArray); // => ['a', 'b', 'c', 'd', 'e', 'f']

2.11 reverse (): reverse the order of array elements

Parameter: None

Returned value: none (reverse element order in the original number group ).

Example:

var demoArray = ['a', 'b', 'c', 'd', 'e'];
demoArray.reverse();
console.log(demoArray); // => ["e", "d", "c", "b", "a"]

2.12 shift (): Remove and return the first element of the array

Parameter: None

Return Value:

The first element of the {Object} array. If the array is empty, undefined is returned.

Example:

var demoArray = ['a', 'b', 'c'];
demoArray.shift(); // => a
demoArray.shift(); // => b
demoArray.shift(); // => c
demoArray.shift(); // => undefined

2.13 slice (startIndex, endIndex): return part of the array

Parameters:

① StartIndex: sequence number at the beginning. If it is a negative number, it indicates that the calculation starts from the end.-1 indicates the last element,-2 indicates the second to last, and so on.

② EndIndex: The last sequence number of the end element. If it is not specified, it is the end. The intercepted element does not contain the element of the sequence number. It ends with the first element of the sequence number.

Return Value:

{Array} is a new Array that contains all elements of the previous element from startIndex to endIndex.

Example:

[1, 2, 3, 4, 5, 6]. slice (); // => [1, 2, 3, 4, 5, 6] [1, 2, 3, 4, 5, 6]. slice (1); // => [2, 3, 4, 5, 6]: [1, 2, 3, 4, 5, 6] Starting from number 1. slice (0, 4); // => [1, 2, 3, 4]: intercept the element [1, 2, 3, 4, 5, 6]. slice (-2); // => [5, 6]: truncates two elements

2.14 sort (opt_orderFunc): sort by certain rules

Parameters:

① Opt_orderFunc (v1, v2) {Function}: an optional sorting rule Function. If omitted, the elements are sorted in ascending order by letters.

V1: the element before the traversal.

V2: elements after the time.

Sorting rules:

Compare v1 and v2, and return a number to represent the v1 and v2 sorting rules:

Smaller than 0: v1 is smaller than v2, and v1 is at the top of v2.

Equal to 0: v1 is equal to v2, and v1 is placed before v2.

Greater than 0: v1 is greater than v2, and v1 is placed behind v2.

Returned value: none (sorting in the original array ).

Example:

[1, 3, 5, 2, 4, 11, 22]. sort (); // => [1, 11, 2, 22, 3, 4, 5]: All elements are converted to characters, the characters before 11 are [1, 3, 5, 2, 4, 11, 22]. sort (function (v1, v2) {return v1-v2;}); // => [1, 2, 3, 4, 5, 11, 22]: sort [1, 3, 5, 2, 4, 11, 22] in ascending order. sort (function (v1, v2) {return-(v1-v2); // you can convert it to large to small}); // => [22, 11, 5, 4, 3, 2, 1]

2.15 splice (): insert or delete array elements

Parameters:

① Start {int}: start sequence number for start insertion, deletion, or replacement.

② DeleteCount {int}: number of elements to be deleted, which is calculated from start.

③ Value1, value2... valueN {Object}: an optional parameter that indicates the element to be inserted and is inserted from start. If the ② parameter is not 0, the delete operation is performed first, and then the insert operation is performed.

Return Value:

{Array} returns a new Array containing the deleted elements. If the ② parameter is 0, no elements are deleted, and an empty array is returned.

Example:

// 1. delete var demoArray = ['A', 'B', 'C', 'D', 'E']; var demoArray2 = demoArray. splice (0, 2); // Delete two elements starting from 0 and return an array containing the deleted elements: ['A', 'B'] console. log (demoArray2); // => ['A', 'B'] console. log (demoArray); // => ['C', 'D', 'E'] // 2. insert var demoArray = ['A', 'B', 'C', 'D', 'E']; var demoArray2 = demoArray. splice (0, 0, '1', '2', '3'); // If the parameter is 0, an empty array console is returned. log (demoArray2); // => [] console. log (demoArray); // => ['1', '2', '3', 'A', 'B', 'C', 'D ', 'E'] // 3. first Delete and then insert var demoArray = ['A', 'B', 'C', 'D', 'E']; // when parameter ② is not 0, then, execute the delete operation (delete the four elements whose sequence number starts from 0 and return an array containing the deleted elements), and then execute the insert operation var demoArray2 = demoArray. splice (0, 4, '1', '2', '3'); console. log (demoArray2); // => ['A', 'B', 'C', 'D'] console. log (demoArray); // => ['1', '2', '3', 'A', 'B', 'C', 'D ', 'E']

2.16 toString (): concatenates all elements in the array with a comma (,) into a string.

Parameter: None

Return Value:

All elements in the {String} array are concatenated into a String with a comma (,) and returned. It is the same as calling the join () method without parameters.

Example:

[1, 2, 3, 4, 5].toString(); // => '1,2,3,4,5'['a', 'b', 'c', 'd', 'e'].toString(); // => 'a,b,c,d,e'

2.17 unshift (): insert an element in the array Header

Parameters:

① Value1, value2...... valueN: add any number of values to the array header.

Return Value:

New length of {int} Array

Example:

var demoArray = [];demoArray.unshift('a'); // => demoArray:['a']demoArray.unshift('b'); // => demoArray:['b', 'a']demoArray.unshift('c'); // => demoArray:['c', 'b', 'a']demoArray.unshift('d'); // => demoArray:['d', 'c', 'b', 'a']demoArray.unshift('e'); // => demoArray:['e', 'd', 'c', 'b', 'a']

Iii. Static Methods
3.1 Array. isArray (): determines whether the object is an Array.

Parameters:

① Value {Object}: Any Object

Return Value:

{Boolean} returns the judgment result. If it is true, it indicates that the object is an array; if it is false, it indicates that the object is not an array.

Example:

Array.isArray([]); // => trueArray.isArray(['a', 'b', 'c']); // => trueArray.isArray('a'); // => falseArray.isArray('[1, 2, 3]'); // => false

Iv. Actual operations
4.1 Index

Note: Each element has a position in the array, which is represented by numbers and is called an index. The index starts from 0, that is, the index of the first element is 0, and the index of the second element is 1;

When an index does not exist in an array is obtained, undefined is returned.

Example:

Var demoArray = ['A', 'B', 'C', 'D', 'E']; demoArray [0]; // => get the first element: 'A' demoArray [0] = 1; // set the first element to 1console. log (demoArray); // => demoArray: [1, 'B', 'C', 'D', 'E'] console. log (demoArray [9]); // => undefined: When the retrieved index does not exist, undefined is returned.

4.2 for statement

Views: You can use the for statement to traverse arrays one by one.

Example:

Var demoArray = ['A', 'B', 'C', 'D', 'E']; for (var I = 0, length = demoArray. length; I <length; I ++) {console. log (demoArray [I]); // => outputs elements in the array one by one}

4.3 Replication

Note: The Array type is a reference type. When Array a is copied to Array B, elements of Array B are modified, and Array a is also modified.

Example:

Var demoArrayA = ['A', 'B', 'C', 'D', 'E']; var demoArrayB = demoArrayA; // assign array A to array BdemoArrayB [0] = 1; // modify the elements of array B on the console. log (demoArrayA); // => [1, 'B', 'C', 'D', 'E']: The elements of array A have also changed.

4.4 deep Replication

Note: The concat () method is used to return a new array. The element modification operation is performed on Array B to prevent the replication of array.

Example:

Var demoArrayA = ['A', 'B', 'C', 'D', 'E']; var demoArrayB = demoArrayA. concat (); // use the concat () method to return the new array demoArrayB [0] = 1; // modify the elements of array B on the console. log (demoArrayA); // => ['A', 'B', 'C', 'D', 'E']: The elements of array a have not changed the console. log (demoArrayB); // => [1, 'B', 'C', 'D', 'E']: Elements of array B have changed.

4.5 determine whether two arrays are equal

Note: Array is a reference type. Therefore, even [] = [] returns false. Therefore, you can use the Array toString () method to determine whether the returned strings are equal.

Example:

console.log([]===[]); // => falseconsole.log(['a', 'b'] === ['a', 'b']); // => falseconsole.log(['a', 'b'].toString() === ['a', 'b'].toString()); // true

The above is all of the content in this article, hoping to help you learn javascript Array objects.

Articles you may be interested in:
  • JS Array object entry-level analysis
  • Summary of javascript Array object usage
  • Summary of basic knowledge about javascript Array objects
  • Introduction to js objects: Array object operations
  • Use of Array objects in JavaScript
  • Js Array object extension function code
  • How to transmit Array objects in JS to the background in JSON format
  • JavaScript Array object extension indexOf () method
  • Summary of adding and deleting elements to and from Array objects in JavaScript Array
  • Javascript system Array object learning notes


Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.