0

I played around with the Object.assign function and found out that i can create an array object fusion kinda?

the code looks like this:

var list = [1, 2, 3]
Object.assign(list, {property: true})

the list appears in brackets when i log it and i can still access the 1 with list[0], BUT I can also access the true by logging list.property and when i log typeof list i get and Object.

I'm really confused rn, can someone explain to me what list is and why this happens? Thank you :)

Atilla
  • 31
  • 3
  • 1
    In JavaScript, arrays **are** objects. Think about the `.length` property – Phil Apr 07 '20 at 08:37
  • 1
    arrays are [*exotic objects*](https://www.ecma-international.org/ecma-262/10.0/index.html#exotic-object) ... with pineapple ... ;-) – Nina Scholz Apr 07 '20 at 08:38

1 Answers1

1

list is an array, which is an object. Standard arrays in JavaScript are objects, not the contiguous blocks of memory divided into fixed-size elements that they are in most programming languages. They have their own literal form, they inherit from Array.prototype, and they have a length property that adjusts itself if you increase their size (and that can remove entries if you assign to it), but other than that they're just objects. You can add non-entry properties to them, as you've discovered, because they're just objects.

Here's a simpler example:

const a = [];
a.example = "hi there";
console.log(a.example); // "hi there"

In fact, what you think of as array indexes are actually property names, and they're strings. Example:

const a = ["zero"];
for (const index in a) {
    console.log(index + " (" + typeof index + ")");
}

A property name is considered an array index if it meets certain criteria:

An integer index is a String-valued property key that is a canonical numeric String (see 7.1.21) and whose numeric value is either +0 or a positive integer ≤ 253 - 1. An array index is an integer index whose numeric value i is in the range +0 ≤ i < 232 - 1.

We typically write them as numbers, and JavaScript engines optimize, but in specification terms they're strings. :-)

the list appears in brackets when i log it

Typically, when you log something with a console, the console looks at it to see what it is and then bases its output on that. With most consoles, when you log an array, they just log the array entries without showing you the other properties. (That's also what you get when you use JSON.stringify, since JSON arrays can't have non-entry properties.) But the property is there, as you saw. You can also see it in for-in loops, since for-in loops through the properties of the object, not the entries of the array:

const list = [1, 2, 3];
Object.assign(list, {property: true});
for (const key in list) {
    console.log(`${key} = ${list[key]}`);
}
T.J. Crowder
  • 1,031,962
  • 187
  • 1,923
  • 1,875
  • but i can't seem to add the property: true to the array if i define it normally – Atilla Apr 07 '20 at 08:43
  • @AtillaCesur - What is your code for doing that? – T.J. Crowder Apr 07 '20 at 08:46
  • like i would define an object (or array) typically so: `var list = [1, 2, 3, property: true]` – Atilla Apr 07 '20 at 13:40
  • @AtillaCesur - Array literal syntax only lets you create array entries, not other kinds of properties. You can only add other kinds of properties to arrays after creating them. (It used to be similar for object literals, there were some things you could only do after-the-fact, but recent versions of JavaScript have added syntax for them. I doubt we'll get syntax for properties in array literals, but personally I like the idea.) – T.J. Crowder Apr 07 '20 at 13:49
  • thanks, I understand now :) – Atilla Apr 08 '20 at 08:13