3 things you don't know about JavaScript arrays _javascript tips

Source: Internet
Author: User
Tags javascript array

In programming languages, arrays (array) is a very common function; it is a special variable that can be used to store multiple values at the same time. In terms of JavaScript, however, there are many other areas of the array that are worth exploring.

In this article, we will discuss three less common features of a JavaScript array.

1. Add custom attributes to the array

When searching the web for a definition of a JavaScript array, you'll find that almost everyone has the same definition of an array: an object.

In fact, everything we handle with JavaScript can be considered an object. There are two types of data in JavaScript, the base type Number object types, but basic types are basically included in the object type.

arrays, functions, and date are predefined objects in JavaScript, all of which contain methods, attributes, and their own standardized syntax.

The JavaScript array has the following three different properties:

1 The index of the array is also its property

2) Built-in properties

3 You can add your own custom attributes

The first two properties are well known and you may use them every day, but I'd like to say a few more words here and then talk about adding custom attributes to the array.

To use an index as a property

JavaScript arrays can use the square brackets syntax, such as var ary = ["Orange", "Apple", "lychee"];.

The index of an array element is basically a property, and the name of its property is always a non-negative integer.

An indexed element of an array pairs a key value pair that resembles an object. An index is a unique feature of an array object that, unlike other built-in properties, can be configured separately through square brackets, such as ary[3] = "peach";.

Built-in properties

Arrays have built-in properties, such as Array.Length. This length property contains an integer value that represents the length of the array.

In general, built-in properties can often be found in predefined JavaScript objects such as arrays. Built-in properties are combined with built-in methods to customize common objects so that objects meet different requirements.

When accessing the built-in properties, you can use two types of syntax: Object.key or object["key". In other words, you can write ary["Length" when you get the length of an array.

Create a custom attribute for an array object

Now let's talk about how to add a custom attribute to an array. An array is a predefined object that stores different kinds of values in different indexes.

In general, we don't need to add custom attributes to arrays, and for that reason, when we just learned JavaScript, no one told us that we could add attributes to the array. In fact, if you want to add a key value pair to an array in the same way as a normal object, you can also use a generic object to achieve the goal. However, this is not to say that there is absolutely no special case, in some cases you can take advantage of the fact that an array is also an object and add one or more custom attributes to it.

For example, you can add a custom attribute to an array that recognizes the element "type (kind)" or "class". See below for specific examples:

var ary = ["Orange", "Apple", "lychee"];
Ary.itemclass = "fruits";
Console.log (ary + "are" + ary.itemclass);

Note that the custom attributes that you add to the array are counted, that is, it can be chosen by loops such as for......in.

2. Looping through array elements

You might say, "I already know that." "Yes, you already know how to index an array of elements." But "looping in array elements" might seem a bit abstract, because what we really loop is the index of the array.

Because array indexes are all made up of nonnegative integers, we usually start with 0, until the full length of the array, to iterate over the integer value, and then use that iteration value to get the array element based on the specific index.

However, since the advent of ECMAScript6, we can no longer manage the index, loop directly through the array values, and this operation can be done using the For......of loop.

In an array, the For......of loop can loop through the sequence of the indexes, in other words, it can take over the iteration of the index, and get an existing array value based on the given index. If you just want to loop through all of the array elements and use them, this loop is very useful.

var ary = ["Orange", "Apple", "lychee"];
For (let item of ary) {
 console.log (item);
}
For comparison, and the regular for loop, we get the indices instead of the values as output.
 

var ary = ["Orange", "Apple", "lychee"];
for (var item = 0; item < ary.length; item++) {
 console.log (item);

} 


3. The number of elements is not equal to its length

In general, when we talk about the length of an array, we think its length is either the number of array values or the length of the array we manually set. But in fact, the length of the array depends on the largest existing index within it.

Length is a very flexible property. Whether you've adjusted the length of the array or not, as long as you constantly add new values to the array, its length will grow as well.

var ary = [];
Ary.length = 3;
Console.log (ary.length);
ARY[5] = "ABCD";
Console.log (ary.length);

In the example above, you can see that I only specified a value for index 5 of the array, and then the length changed to 6. Now, if you feel that adding a value to index 5, the array will automatically create an index of 0-4, then you have a false guess. There is no index 0-4 in the array that should be present. You can use in operator to view.

var ary = [];
Ary.length = 3;
Console.log (ary.length);
ARY[5] = "ABCD";
Console.log (ary.length);
Console.log (0 in ary); 

The ARY array above is a sparse array (sparse array) where the index of the array is not persisted and there is air between the indexes. The opposite of the sparse array is a dense array (dense array). The index of a dense array is created continuously, with the number of elements equal to its length.

The length property of an array can also be used to shorten the number, ensuring that the maximum number of indexes in the array is always less than the array itself, because by default, the length value is always greater than the maximum number of indexes.

In the following example, as you can see, I used the method of reducing the length of the ARY array to community the elements in index 5.

var ary = [];
Ary.length = 3;
Console.log (ary.length);
ARY[5] = "ABCD";
Console.log (ary.length);
Ary.length = 2;
Console.log (ary.length);
Console.log (Ary[5]);

The above is the entire content of this article, I hope to help you learn, but also hope that we support the cloud habitat community.

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.