In-depth exploration of Javascript Array methods, exploration of javascript Array

Source: Internet
Author: User
Tags javascript array

In-depth exploration of Javascript Array methods, exploration of javascript Array

In JavaScript, Arrays can be created using an Array constructor or [] for quick creation. This is the preferred method. An array is a prototype inherited from an Object and has no special return value for typeof. Only 'object' is returned '.

1. Array. prototype. slice Method
The array slice method is usually used to extract parts from an array. However, it also has the ability to convert "class arrays" (such as arguments and HTMLCollection) into real arrays.

Copy codeThe Code is as follows:
Var nodesArr = Array. prototype. slice. call (document. forms );
Var argsArr = Array. prototype. slice. call (arguments );

I wondered why the array slice method has such a skill and how it is implemented in the javascript engine? Is slice's sibling method capable of doing this?

With curiosity, download Google's V8 javascript Engine source code to your local device. For V8 source code: https://github.com/v8/v8.

Find "array. prototype. slice" in v8-master/src/Array. js ":

Copy codeThe Code is as follows:
Function ArraySlice (start, end ){
CHECK_OBJECT_COERCIBLE (this, "Array. prototype. slice ");
...
Var result = []; // This sentence is critical
If (end_ I <start_ I) return result;
If (UseSparseVariant (array, len, IS_ARRAY (array), end_ I-start_ I )){
...
SparseSlice (array, start_ I, end_ I-start_ I, len, result );
} Else {
SimpleSlice (array, start_ I, end_ I-start_ I, len, result );
}
...
Return result;

Then I guess the SimpleSlice method should be used to call the "class Array", and then find "SimpleSlice" in the source code to find the Array. prototype. the SimpleSlice method is also called in the splice source code, and the result variable is also initialized as an empty array. However, to use the splice method to convert a "class array" to a real array, you must input the starting position parameter 0, that is:

Copy codeThe Code is as follows:
Var nodesArr = Array. prototype. splice. call (document. forms, 0 );

Because its implementation principle is to make the deleted array items into a new array. For more information, see the source code implementation of Array. prototype. splice.
In addition, slice can also clone an array:

Copy codeThe Code is as follows:
Var arr = [1, 2, 3];
Var cloneArr = arr. slice (); // cloneArr: [1, 2, 3]

2. Array. prototype. push method
You can use the push method to merge Arrays:

Copy codeThe Code is as follows:
Var arr1 = [1, 'str', {name: 'lang '}];
Var arr2 = [2, 'in'];
Array. prototype. push. apply (arr1, arr2 );
// Return result: [1, "str", {name: 'lang '}, 2, "ing"]

3. Array. prototype. sort Method
First run the Code:

Copy codeThe Code is as follows:
Var arr = ['1', '2', '10', '12'];
Arr. sort ();
// Return result: ["1", "10", "12", "2"]

The above results are generally not what we want, so how to sort by numerical value:

Copy codeThe Code is as follows:
Arr. sort (function (a, B ){
Return a-B;
})
// Return result: ["1", "2", "10", "12"]

With the sorting comparator function, you can customize many comparator to achieve personalized sorting.

4. length attribute
The length attribute of the array is not read-only, so it can be written. For example, you can use the length attribute to truncate the array:

Copy codeThe Code is as follows:
Var arr = [1, 2, 3, 4];
Arr. length = 2;
// Arr: [1, 2]
Arr. length = 0;
// Arr: []

At the same time, if the length attribute is increased, the length value of the array increases and the undefined attribute is used to fill the new element.

Copy codeThe Code is as follows:
Var arr = [];
Arr. length = 3;
// Arr: [undefined, undefined, undefined]

Now, we will summarize it here today. It's early in the morning, and we will append any new discoveries to it in the future.
Previously, I didn't have the habit of writing a blog. I just used to put my summary in youdao cloud notes. I didn't expect to write my opinion out of my mind because I had to think about how to express it, in order to make others better understand.

I hope you can help me correct the incorrect expression or misunderstanding.

Some common javascript Array methods are attached.

Concat () connects two or more arrays and returns results.
Join () puts all elements of the array into a string. The elements are separated by the specified delimiter.
Pop () deletes and returns the last element of the array.
Push () adds one or more elements to the end of the array and returns a new length.
The order of elements in the array is reversed by reverse.
Shift () deletes and returns the first element of the array.
Slice () returns the selected element from an existing array
Sort () sorts array elements
Splice () deletes an element and adds a new element to the array.
ToSource () returns the source code of the object
ToString () converts an array to a string and returns the result.
ToLocaleString () converts the array to a local array and returns the result.
Unshift () adds one or more elements to the beginning of the array and returns a new length.
ValueOf () returns the original value of the array object

Related Article

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.