Common examples of Javascript Array Operations

Source: Internet
Author: User

This article will give you a summary of the js array operation examples. These are basic js array operation methods. I hope this tutorial will be helpful to you.


1. Create an array

Var arr = []; // create an empty array
Var arr1 = new Array (5); // create an Array and assign 5 lengths (null)
Var arr2 = new Array ('php blog', 'javascript blog', 'mysql blog ','. net blog ', 'it blog'); // create an array with values


2. Read the value of the array


Var arr2 = new Array ('php blog ', 'javascript blog', 'mysql blog ', '. net blog', 'it blog ');
Arr2 [0] = 'bkjia. c0m ';
Console. log (arr2 [0]); // bKjia. c0m 3. Add an array element

Var arr2 = new Array ('php blog ', 'javascript blog', 'mysql blog ', '. net blog', 'it blog ');
Arr2.push ('SQL-Server'); // Add elements (one or more) to the end of the array)
Arr2.unshift ('Think back'); // Add elements (one or more) to the array Header)
Arr2.splice (, 'technical blog'); // Delete num elements (0) from array index position (2) and add new elements
Console. log (arr2); ["Retreat", "php blog", "Technical blog", "javascript blog", "mysql blog ",". net blog "," IT blog "," SQL-server "]


4. Deletion of array elements

Var arr2 = new Array ('php blog ', 'javascript blog', 'mysql blog ', '. net blog', 'it blog ');
Arr2.pop (); // remove the last element
Arr2.shift (); // remove the first element
Arr2.splice (); // Delete num elements from the array index
Console. log (arr2); // ["javascript blog", "mysql blog"]


5. truncation and merging of array elements

Var arr2 = new Array ('php blog ', 'javascript blog', 'mysql blog ', '. net blog', 'it blog ');
Var tmp = arr2.slice (2, 4); // truncates the position from start (2) to end (4) and returns the truncated array.
Console. log (arr2); // ["php blog", "javascript blog", "mysql blog ",". net blog "," IT blog "] console. log (tmp); // ["mysql blog ",". net blog "] var tmp2 = arr2.concat (['aaa', 'ddd ']); // The connected element returns the connected Array
Console. log (arr2); // ["php blog", "javascript blog", "mysql blog ",". net blog "," IT blog "] console. log (tmp2); // ["php blog", "javascript blog", "mysql blog ",". net blog "," IT blog "," aaa "," ddd "]


6. Copy the Array

Var arr2 = new Array ('php blog ', 'javascript blog', 'mysql blog ', '. net blog', 'it blog ');

Var tmp = arr2.slice (0); // copy and return a new array, not pointing
Var tmp2 = arr2.concat (); // copy and return a new array, not pointing
Var tmp3 = arr2;
Arr2 [0] = 'tuisiyuan ';
Console. log (arr2); // ["tuisiyuan", "javascript blog", "mysql blog ",". net blog "," IT blog "] console. log (tmp); // ["php blog", "javascript blog", "mysql blog ",". net blog "," IT blog "] console. log (tmp2); // ["php blog", "javascript blog", "mysql blog ",". net blog "," IT blog "] console. log (tmp3); // ["tuisiyuan", "javascript blog", "mysql blog ",". net blog "," IT blog "]

7. Sorting of array elements


Var arr2 = new Array ('php blog ', 'javascript blog', 'mysql blog ', '. net blog', 'it blog ');
Arr2.reverse (); // reverse the Array
Console. log (arr2); // ["IT blog ",". net blog "," mysql blog "," javascript blog "," php blog "] var arr2 = new Array (10, 5, 50, 65, 38 );
Console. log (arr2 );
Arr2.sort ();
Console. log (arr2); // [10, 38, 5, 50, 65]


8. Convert array elements into strings


Var arr2 = new Array ('php blog ', 'javascript blog', 'mysql blog ', '. net blog', 'it blog ');
Console. log (arr2.join ('|'); // php Blog | javascript blog | mysql blog |. net blog | IT blog


 

Shift: Delete the first entry of the original array and return the value of the deleted element. If the array is empty, undefined is returned.
Var a = [1, 2, 3, 4, 5];
Var B = a. shift ();

Result a: [2, 3, 4, 5] B: 1

 

Unshift: add the parameter to the beginning of the original array and return the length of the array.
Var a = [1, 2, 3, 4, 5];
Var B = a. unshift (-2,-1 );

Result a: [-2,-,] B: 7

Note: In IE6.0, the test return value is always undefined, and in FF2.0, the test return value is 7. Therefore, the return value of this method is unreliable. You need to use splice instead of this method when returning the value.

 

Pop: Delete the last entry of the original array and return the value of the deleted element. If the array is empty, undefined is returned.
Var a = [1, 2, 3, 4, 5];
Var B = a. pop ();

Result a: [1, 2, 4] B: 5

 

Www.2cto.com push: add the parameter to the end of the original array and return the length of the array.
Var a = [1, 2, 3, 4, 5];
Var B = a. push (6, 7 );

Result a: [1, 2, 3, 4, 5, 6, 7] B: 7

 

Concat: returns a new array consisting of adding parameters to the original array.
Var a = [1, 2, 3, 4, 5];
Var B = a. concat (6, 7 );

Result a: [, 5] B: [, 7]

 

Splice (start, deleteCount, val1, val2,...): Delete the deleteCount item from the start position, and insert val1, val2 ,...
Var a = [1, 2, 3, 4, 5];
Var B = a. splice (2, 2, 7, 8, 9 );

Result a: [,] B: []

Var B = a. splice (0, 1); // same as shift
A. splice (0, 0,-2,-1); var B = a. length; // same as unshift
Var B = a. splice (a. length-1, 1); // same as pop
A. splice (a. length, 7); var B = a. length; // same as push

 

Reverse: returns the reverse order of the array.
Var a = [1, 2, 3, 4, 5];
Var B = a. reverse ();

Result a: [5, 4, 3, 2, 1] B: [5, 4, 3, 2, 1]

 

Sort (orderfunction): sorts arrays by specified parameters.
Var a = [1, 2, 3, 4, 5];
Var B = a. sort ();

Result a: [1, 2, 3, 4, 5] B: [1, 2, 3, 4, 5]

 

Slice (start, end): returns a new array consisting of items from the original array that specify the start subscript to the end subscript
Var a = [1, 2, 3, 4, 5];
Var B = a. slice (2, 5 );

Result a: [1, 2, 3, 4, 5] B: [3, 4, 5]

 

Join (separator): A string is set up for the elements of the array. The separator is separator. If it is omitted, a comma is used as the separator by default.
Var a = [1, 2, 3, 4, 5];
Var B = a. join ("| ");

Result a: [1, 2, 3, 4, 5] B: "1 | 2 | 3 | 4 | 5"

 

 

An array is an internal object provided by JavaScript. It is a standard set. We can add (push), delete (shift) elements, we can also traverse the elements in the for loop, so can we have other sets in addition to arrays in JavaScript?

Because of the language features of JavaScript, We can dynamically add and delete attributes to common objects. Therefore, objects can also be seen as a special set of JS.

 

The following compares the features of Array and Object:

Array:

New: var ary = new Array (); or var ary = [];
Added: ary. push (value );
Delete: delete ary [n];
Traversal: for (var I = 0; I <ary. length; ++ I) ary [I];

  

Object:

New: var obj = new Object (); or var obj = {};
Added: obj [key] = value; (key is string)
Delete: delete obj [key];
Traversal: for (var key in obj) obj [key];

 

From the above comparison, we can see that the Object can be used as a set. in the use of the Popup window to create an infinitely webpage menu (3), I introduced the _ MenuCache __implemented by Eric __, it is also a simulated set object.

 

If we want to retrieve a specified value in Array, We need to traverse the entire Array:

Var keyword =;
For (var I = 0; I <ary. length; ++ I)
{
If (ary [I] = keyword)
{
}
}

 

However, to retrieve a specified key entry in an Object, you only need to use:

Var key = '';
Var value = obj [key];


This feature of the Object can be used to efficiently retrieve the string set of Unique. The time complexity of traversing the Array is O (n), and the time complexity of traversing the Object is O (1 ). Although the for search cost for 10000 sets is dozens of ms, if it is 1000*1000 queries or more, the advantages of using objects are shown. Before that, I made a mapping to map 100 Unique characters to 1000 string arrays, which took 25-30 s! Later, I changed the for traversal to the member reference of the Object simulation set. The same data volume mapping takes only 1.7-2 s !!!

  

For the collection traversal efficiency (from high to low): var value = obj [key];> for (;)> for (in ). The worst efficiency is for (in). If the set is too large, do not use for (in) traversal.

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.