Guide: Things You Probably Missed About JavaScript Arrays
Arrays are widely used feature of programming languages; they are special variables which can be used to store multiple values at the same time. However, when it comes to JavaScript, no matter how easy it is to learn, there is always more to discover. In this post, we’ll take a look at three lesser-known but important ones features of JavaScript arrays you may not have known before.
1. Add custom properties to arrays
If you were to scour the internet for a thorough definition of JavaScript arrays, you will find that almost any source will list the array as it really is without errors, an object In fact, almost everything we deal with will be in JavaScript turn out to be an objectThere are two kinds of data types in JavaScript, primitives and objects, but primitives are always packed up within objects Are matrix, function, date, etc. predefined JavaScript objects that have built-in methods, properties and their own standardized syntax. JavaScript arrays can three different types of properties The first two are more familiar, you can use them every day, but let’s take a quick look at them before looking at how to add your own custom property to an array.
Indices as properties
JavaScript arrays use the square bracket syntax, such as var ary = [“orange”,”apple”,”lychee”] Array element indices are basically properties value property names to be always non-negative integers The index element pair of an array is similar to the key / value pair of an object. Indices are unique feature of the Array object, and unlike the other built-in properties, they can set with only the parentheses syntax, such as ary[3] = “Peach”;.
Built-in features
Arrays also have built-in features, such as array.length. The length property has an integer value that specifies the length of an array In general, built-in properties can often be found in predefined JavaScript objects such as arrays. Together with the built-in methods, they help customize generic objects to suit different needs Built-in properties are accessible with the object.key or object[“key”] syntax. So you can also write ary[“length”] to access the length of an array.
Create custom properties for the array object
Let’s talk about it now adding your own properties to arraysArrays are predefined objects that store different kinds of values on different indices. It is usually not necessary to add custom properties to an array; this is one of the reasons why beginners don’t usually learn this featureIf you want to treat an array like a normal object by adding key-value pairs to it, you can do that just as well use a normal object for your purposeBut this does not mean there are none special cases where you can take advantage of the fact that an array is an object by adding one or more custom properties to it. For example, you can add a custom property to an array containing identifies the “kind” or “class” of its elements, as you can see in the example below. var ary = [“orange”,”apple”,”lychee”]; ary.itemClass = “fruit”; console.log (ary + “are” + ary.itemClass); // “orange, apple, lychee are fruit” Note that the custom property you add to an array is enumerable, which means that it is picked up through loops like the for … in statement.
2. Loop through array elements
You probably say “I already know that,” which is probably true, you already know how to go through array elements. But it is also true that saying “loop through array elements” is a bit abstract since we are actually using the indices of the array Because only array indices are created up from non-negative integers, we repeat an integer that usually starts at zero and ends at the full length of the array, then use that repeated value to access the array element at a given index. However, since ECMAScript6, there is a way around loop through matrix values directly without being bothered by indices, and that can be done by using the for … or loop. In an array, the for… or loop will loop through the array elements in the order of indices, in others words it takes care of repeating the indices and getting one existing array value at a certain index. This loop is ideal if you want to go through and work with all array elements. var ary = [“orange”,”apple”,”lychee”] for (let item of ary) {console.log (item);} // “orange”, “apple”, “lychee” In comparison, with the regular for loop, we get the indices instead of the values as output. var ary = [“orange”,”apple”,”lychee”] for (var item = 0; item
3. The number of elements is not their length
Usually, when we talk about the length of an array, we think it is either the number of values that an array contains or the length that we have manually given the array. In reality, however, the length of an array depends on the largest existing index inside of it. Length is a very flexible houseWhether you have already determined the length of an array or not, if you keep adding values to the array, the length continues to increase accordingly var ary = []; ary.length = 3; console.log (ary.length); // 3 ary[5] = “Abcd”; console.log (ary.length); // 6 In the above example, you can see that I gave the array only one value at index 5, and the length becomes 6. Now, if you think that by adding a value to index 5, the array will automatically change the indices from 0 4 has made, then your assumption is incorrectThere really are no existing indexes from 0 to 4 in that series. You can check this with the in operator. var ary = []; ary.length = 3; console.log (ary.length); // 3 ary[5] = “Abcd”; console.log (ary.length); // 6 console.log (0 in ary); // false The array is what we have a “Sparse” array, an array where the indices are not made continuously, and have gapsThe opposite of a “sparse” array is the “Dense” array where indices exist continuously in the array and the number of elements is the same as the length. The length property is also capable truncate an array, and make sure that the highest index in the array is always less than himself, since length is always numerically greater than the highest index by default. In the example below you can see how we lose the element at index 5 by decreasing the length of the ary array. var ary = []; ary.length = 3; console.log (ary.length); // 3 ary[5] = “Abcd”; console.log (ary.length); // 6 ary.length = 2; console.log (ary.length); // 2 console.log (ary[5]); // not defined
Read further
10 JavaScript Terms You Should Know By Now 4 Not So Common But Useful Javascript Sayings You Should Know Code optimization with JS Hint – a Javascript crushing tool
Things You Probably Missed About JavaScript Arrays: benefits
Faq
Final note
I hope you like the guide Things You Probably Missed About JavaScript Arrays. In case if you have any query regards this article you may ask us. Also, please share your love by sharing this article with your friends. For our visitors: If you have any queries regards the Things You Probably Missed About JavaScript Arrays, then please ask us through the comment section below or directly contact us. Education: This guide or tutorial is just for educational purposes. Misinformation: If you want to correct any misinformation about the guide “Things You Probably Missed About JavaScript Arrays”, then kindly contact us. Want to add an alternate method: If anyone wants to add more methods to the guide Things You Probably Missed About JavaScript Arrays, then kindly contact us. Our Contact: Kindly use our contact page regards any help. You may also use our social and accounts by following us on Whatsapp, Facebook, and Twitter for your questions. We always love to help you. We answer your questions within 24-48 hours (Weekend off). Channel: If you want the latest software updates and discussion about any software in your pocket, then here is our Telegram channel.
