Notes

The myriad ways of creating objects in JavaScript

Edit on GitHub


JavaScript
2 minutes

Everything is an Object (or a primitive). JavaScript has more than one way of creating objects. (Other languages like Java can only create objects via Classes..)

  • new Object() <- this one isn’t used much in favor of object literals
  • Object literals {}
  • Constructor functions
  • Object.create()
  • Classes

Accessing object properties also has two different ways. The dot notation and the bracket notation. Dot notation works everywhere, except when the property/method name has spaces in it, or starts with a number. Basically, bracket notation let’s you access property names that are illegal in JS. For example, you can not have variable names that start with a number. You can not have variable names with spaces and so on. If for some reason you do end up with keys like these in your object, you can access them with bracket notation because bracket notation takes a string. A string could have anything inside it, say 8998sda or date of birth or !@Q@$!@#$..

1const person = {}
2
3person.name = 'Aamnah' // Dot syntax
4person['date of birth'] = '16 November' // Bracket syntax

Objects literals

{} is what you call an object literal, it’s just a pair of empty pair of curly brackets. That’s how simple a basic object is. Everything inside becomes it’s properties and methods.

1const objLiteral = {
2  balance: 600,
3}

Constructor functions

1function FunctionObject() {
2  // notice the uppercase, PascalCase function name
3  this.balance = 700
4}
5
6const functionObj = new FunctionObject() // notice the use of `new`

Object.create()

1const objCreate = Object.create(objLiteral)