Javascript: Arrays
7st April 2021
If you are coming from another language, arrays are linear allocations
of memory which are quite fast, Javascript arrays are not like this.
Instead Javascript provides an object which is array-like. It is
slower than "real" arrays but it can be more convenient to use.
Creating arrays
Array literals are the easiest way to create an array. A literal is a pair of square brackets surrounding zero or more values separated by commas.
//Aray literal
var empty = []
var carBrands = ["Ferrari", "Volvo", "Ford"]
//Object literal
var carBrands_object = {'0': 'Ferrari', '1': 'Volvo', '2': 'Ford'}
The array and object literal produce very similar results. Both are
objects containing 3 values and those properties have the same names
and values. There is significant difference however as 'carBrands' inherits
from Array.prototype
while 'carBrands_object' inherits
from Object.prototype
, so 'numbers' inherits some
useful methods along with the length property.
Length property
Unlike other languages, you don't need to know the size of your array when you are defining it. The length property however is not defined by the amount of items in your array, it is the largest integer property name plus one.
var sillyArray = []
sillyArray.length //0
sillyArray[999] = true
sillyArray.length //1000
The [ ] postfix subscript converts the expression to a string which is used as
the property name. If that string looks like a positive integer which is greater
than or equal to the array's current length then the length of the array is set
to the new value plus one.
The length can be set explicitly. Making the length larger does not allocate more
memory making it smaller will cause all properties with a key greater than the new
value will be deleted
carBrands.length = 2
//['Ferrari', 'Volvo']
Knowing you have an array
Arrays in JS are objects which are array-like, as such, the typeof
method on an array returns 'object'. The core language does not have a good means of
distinguishing between arrays and objects so you need to write your own method to work it out.
var is_array = function(value) {
return Object.prototype.toString.apply(value) === '[object Array]'
}
Useful methods
array.concat(item...)
Creates a new array with the items appended to it individually.
var a = ['Ferrari', 'Volvo']
var b = ['Skoda', 'Seat']
var c = a.concat(b)
//c is ['Ferrari', 'Volvo', 'Skoda', 'Seat']
array.join(separator)
Turns each item in the array to a string and joins them together with the separator. If no separator is supplied then ',' is used.
var a = ['Its', 'just', 'like', 'a', 'stringbuilder']
var c = a.join(' ')
//Its just like a stringbuilder
array.splice(start, length, item...)
This is most commonly used to remove elements from an array. If there are additional items these will be inserted
var a = ['Its', 'just', 'like', 'a', 'stringbuilder']
var c = a.splice(1, 1, 'not')
//Its not like a stringbuilder
pop() and push(item...)
Turn your arrays into stacks! pop()
removes and returns
the last element in the array.
push(item...)
will add items to the end of your array. Unlike concat(item...)
it will add arrays into the array rather than its individual objects.
var a = ['Ferrari', 'Volvo', 'Mercedes']
var b = a.pop()
//a is ['Ferrari', 'Volvo']
//b is 'Mercedes'
var c = a.push('BMW')
//a is ['Ferrari', 'Volvo', 'BMW']
//c is the length of the new array - 3