Add a property to a JavaScript array

Question

Arrays have a "length" property by default.

Can I add custom properties to them?

Without having to make them objects.

Answer 1

var arr = [1,2,3,4,5];
arr.prop = 'value';

Arrays are already objects in JavaScript -- they just have some extra features and special literal syntax.

Answer 2

As other answers state, it's perfectly possible, because arrays in JavaScript are just objects. However, there is still the a question of whether it's a good idea or not.

That's a "coding style" question, so it's hard to say objectively, but Douglas Crockford doesn't have a problem with it (at least in some cases). In JavaScript: The Good Parts, he actually uses the example of adding a "total" method to an array.

Because an array is really an object, we can add methods directly to an individual array:

// Give the data array a total function

data.total = function () {
    return this.reduce(add, 0);
};

total = data.total();    // total is 108

Since the string 'total' is not an integer, adding a total property to an array does not change its length.

(p62, Crockford's "JavaScript The Good Parts", found on Google Books)

However, it is worth mentioning that these extra properties are not included in JSON serialisation, and would be thrown away if you do anything like arr = arr.slice(1);.

Answer 3

If you meant to hide it in an Array, etc. (at least that's what I was looking for):

Object.defineProperty( targ, "myVal", { enumerable: false, writable: true } );

Then the array doesn't add it to length, so it's a property, not a value I guess you could say.

Then if you want to see the keys in an object for instance, Object.keys won't see it, but Reflect.ownKeys() will.

The Reflect version of defineProperty will return success or fail, while Object's returns the object passed.

Remember Reflect.preventExtensions() will (like it says) stop you or others from extending them.

Answer 4

Arrays are objects and therefore you can add your own properties to them:

var arr = [1, 2, 3];
arr.foo = 'bar';

Extending from other answers, here are the following ways of iterating over the array, excluding custom properties.

1. Using a standard for loop

   for (let i = 0; i < arr_length; i++)
       console.log(arr[i]);
   

   or if not using ES6:

   for (var i = 0; i < arr.length; i++)
       console.log(arr[i]);
   

2. Using the for ... of loop (ES6+)

   for (let el of arr)
       console.log(el)
   

3. Using Array.prototype.forEach (ES6+)

   arr.forEach(el => console.log(el));
   

   or

   arr.forEach(function(el) {
       console.log(el);
   });
   

Iterating over the array, including all properties (e.g., custom properties, length):

for (let prop in arr)
    console.log(prop);

Or if not using ES6:

for (var prop in arr)
    console.log(prop);

Answer 5

Yes. You can add them to the object by just declaring them and you can also extend Array using Array.prototype

var j = new Array();
j.yourprop = "foo";