JavaScript array Operations Common examples

Source: Internet
Author: User
Tags comparison javascript array


1. The creation of the array

var arr = []; Create an empty array
var arr1 = new Array (5); Create an array and assign 5 lengths (empty)
var arr2 = new Array (' PHP blog ', ' JavaScript blog ', ' MySQL blog ', '. NET blog ', ' It blog '); To create an array with a value


2. Read the values in the array


var arr2 = new Array (' PHP blog ', ' JavaScript blog ', ' MySQL blog ', '. NET blog ', ' It blog ');
Arr2[0] = ' 111cn.net ';
Console.log (Arr2[0]); 111cn.net 3. Addition of array elements

var arr2 = new Array (' PHP blog ', ' JavaScript blog ', ' MySQL blog ', '. NET blog ', ' It blog ');
Arr2.push (' Sql-server '); Add an element (one or more) to the end of the array
Arr2.unshift (' Retreat from the Garden '); Add an element (one or more) to the head of an array
Arr2.splice (2,0, ' technology blog '); Deletes the NUM element (0) and adds a new element to the index position (2) of the array
Console.log (ARR2); ["Retreat", "PHP Blog", "Technology 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 (2,1); Remove the num element from the array's index position
Console.log (ARR2); ["JavaScript blog", "MySQL Blog"]


5. Intercepting merging of array elements

var arr2 = new Array (' PHP blog ', ' JavaScript blog ', ' MySQL blog ', '. NET blog ', ' It blog ');
var tmp = Arr2.slice (2,4); Intercepts the position of end (4) from Start (2) and returns the captured 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 ']); connect the new element to return the concatenated 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 of array

var arr2 = new Array (' PHP blog ', ' JavaScript blog ', ' MySQL blog ', '. NET blog ', ' It blog ');

var tmp = arr2.slice (0); Copy returns the new array, not pointing to the
var tmp2 = Arr2.concat (); Copy returns the new array, not pointing to the
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. Ordering of array elements


var arr2 = new Array (' PHP blog ', ' JavaScript blog ', ' MySQL blog ', '. NET blog ', ' It blog ');
Arr2.reverse (); Reverse 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. The array element is converted to a string


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: Deletes the first item of the original array and returns the value of the deleted element, or returns undefined if the array is empty
var a = [1,2,3,4,5];
var B = A.shift ();

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

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

Results a:[-2,-1,1,2,3,4,5] B:7

Note: The test return value under IE6.0 is always undefined,ff2.0 the test return value is 7, so the return value of this method is unreliable, and it is necessary to use splice instead of this method with the return value.

Pop: Deletes the last item of the original array and returns the value of the deleted element, or returns undefined if the array is empty
var a = [1,2,3,4,5];
var B = A.pop ();

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

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

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

Concat: Returns a new array that adds a parameter to the original array.
var a = [1,2,3,4,5];
var B = A.concat (6,7);

Results a:[1,2,3,4,5] b:[1,2,3,4,5,6,7]

Splice (Start,deletecount,val1,val2,...) : Deletes the DeleteCount entry from the start position and inserts the Val1,val2 from that location,...
var a = [1,2,3,4,5];
var B = A.splice (2,2,7,8,9);

Results a:[1,2,7,8,9,5] b:[3,4]

var B = a.splice (0,1); With shift
A.splice (0,0,-2,-1);                     var B = a.length; With Unshift
var B = A.splice (a.length-1,1); Same pop
A.splice (a.length,0,6,7);                 var B = a.length; Same push

Reverse: Reverse-order the array
var a = [1,2,3,4,5];
var B = A.reverse ();

Results a:[5,4,3,2,1] b:[5,4,3,2,1]

Sort (orderfunction): Sorting by specified array of parameters
var a = [1,2,3,4,5];
var B = A.sort ();

Results a:[1,2,3,4,5] b:[1,2,3,4,5]

Slice (Start,end): Returns a new array of items from the original array specifying the start subscript to the end subscript
var a = [1,2,3,4,5];
var B = a.slice (2,5);

Results a:[1,2,3,4,5] b:[3,4,5]

Join (Separator): Sets the element of an array to a string, separator as a delimiter, and omitted by default with a comma as the delimiter
var a = [1,2,3,4,5];
var B = A.join ("|");

Results 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, and we can iterate through the elements in the for loop, so can we have any other collection in JavaScript except the array?

Because of the language characteristics of JavaScript, we can dynamically add and remove properties to common objects. So object can also be considered as a special set of JS.

Here's a comparison of the array and object features:

Array:

NEW: var ary = new Array (); or var ary = [];
Increase: 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 = {};
Add: Obj[key] = value; (Key is String)
Delete: delete Obj[key];
Traversal: for (var key in obj) Obj[key];

From the comparison above, you can see that object can be used as a collection, and in creating an infinite-level Web page menu (3) using the popup window I introduced the __menucache__ that Eric implemented, which is a mock collection object.

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

var keyword =;
for (Var i=0 i < ary.length; ++i)
{
if (ary[i] = = keyword)
{
}
}

And we retrieve an entry for the specified key in object, which is only required to use:

var key = ';
var value = Obj[key];


This feature of object can be used to efficiently retrieve a unique set of strings, and the time complexity of traversing an array is O (n), while the time complexity of traversing the object is O (1). Although for the 10,000 collection for retrieval cost is also dozens of MS, but if it is 1000*1000 or more, the advantage of using the object is reflected. Before that, I made a mapping of 100 unique characters mapping to 1000 string arrays, which took a long time 25-30s! later changed the for traversal to a member reference of the set of object simulation, the same amount of data mapping, Time Consuming only 1.7-2S!!!

  

For the traversal efficiency of the set (from high to low): var value = Obj[key]; > for (;;) > for (in). The least efficient is for (in), and if the collection is too large, try not to use for (in) traversal.

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.