JavaScript Data structures: Objects

Back to the weresquirrel. A set of daily log entries can be represented as an array. But the entries do not consist of just a number or a string—each entry needs to store a list of activities and a Boolean value that indicates whether Jacques turned into a squirrel or not. Ideally, we would like to group these together into a single value and then put those grouped values into an array of log entries.

Values of the type object are arbitrary collections of properties. One way to create an object is by using braces as an expression.

let dayl = {

squirrel: false,

events: [“work”, “touched tree”, “pizza”, “running”]



// → false


// → undefined day1.wolf = false;


// → false

Inside the braces, there is a list of properties separated by commas. Each property has a name followed by a colon and a value. When an object is writ­ten over multiple lines, indenting it like in the example helps with readabil­ity. Properties whose names aren’t valid binding names or valid numbers have to be quoted.

let descriptions = {

work: “Went to work”,

“touched tree”: “Touched a tree”


This means that braces have two meanings in JavaScript. At the start of a statement, they start a block of statements. In any other position, they describe an object. Fortunately, it is rarely useful to start a statement with an object in braces, so the ambiguity between these two is not much of a problem.

Reading a property that doesn’t exist will give you the value undefined.

It is possible to assign a value to a property expression with the = opera­tor. This will replace the property’s value if it already existed or create a new property on the object if it didn’t.

To briefly return to our tentacle model of bindings—property bindings are similar. They grasp values, but other bindings and properties might be holding onto those same values. You may think of objects as octopuses with any number of tentacles, each of which has a name tattooed on it.

The delete operator cuts off a tentacle from such an octopus. It is a unary operator that, when applied to an object property, will remove the named property from the object. This is not a common thing to do, but it is possible.

let anObject = {left: 1, right: 2};


// → 1

delete anObject.left; console.log(anObject.left);

// → undefined

console.log(“left” in anObject);

// → false

console.log(“right” in anObject);

// → true

The binary in operator, when applied to a string and an object, tells you whether that object has a property with that name. The difference between setting a property to undefined and actually deleting it is that, in the first case, the object still has the property (itjust doesn’t have a very interesting value), whereas in the second case the property is no longer present and in will return false.

To find out what properties an object has, you can use the Object.keys function. You give it an object, and it returns an array of strings—the object’s property names.

console.log(Object.keys({x: 0, y: 0, z: 2}));

// → [“x”, “y”, “z”]

There’s an Object.assign function that copies all properties from one object into another.

let objectA = {a: 1, b: 2};

Object.assign(objectA, {b: 3, c: 4});


// → {a: 1, b: 3, c: 4}

Arrays, then, are just a kind of object specialized for storing sequences of things. If you evaluate typeof [], it produces “object”. You can see them as long, flat octopuses with all their tentacles in a neat row, labeled with numbers.

We will represent thejournal that Jacques keeps as an array of objects.

let journal = [

{events: [“work”, “touched tree”, “pizza”,

“running”, “television”], squirrel: false},

{events: [“work”, “ice cream”, “cauliflower”,

“lasagna”, “touched tree”, “brushed teeth”], squirrel: false},

{events: [“weekend”, “cycling”, “break”, “peanuts”,

“beer”], squirrel: true},

/* and so on… */


Source: Haverbeke Marijn (2018), Eloquent JavaScript: A Modern Introduction to Programming,

No Starch Press; 3rd edition.

Leave a Reply

Your email address will not be published. Required fields are marked *