# How to add a property to an object in JavaScript

By Atta Ur Rehman Shah (https://attacomsian.com/about). Published Jul 3, 2020, updated Aug 12, 2022. Topics: JavaScript.
Canonical URL: https://attacomsian.com/blog/javascript-object-add-key

> A short article to learn how to add a new item to an object in JavaScript. 

To add a new property to a JavaScript object:

1. You either use the dot (`.`) notation or the square bracket (`[]`).
2. In dot donation, you use the object name followed by the dot, the name of the new property, an equal sign, and the value for the new property.
3. In square bracket notation, you use the property name as a key in square bracket followed by an equal sign and the value of the new property.

A JavaScript [object](https://attacomsian.com/blog/objects-prototypes-classes-javascript#objects) is a collection of key-value pairs called properties. Unlike [arrays](https://attacomsian.com/blog/javascript-arrays), objects don't provide an index to access the properties. 

You can either use the dot (`.`) notation or the square bracket (`[]`) notation to access property values.

```javascript
const foods = { burger: '?', pizza: '?' };

// Dot Notation
console.log(foods.burger); // ?

// Square Bracket Notation
console.log(foods['pizza']); // ?
```

The simplest and most popular way is to use the dot notation to add a **new key-value pair** to an object:

```javascript
foods.custard = '?';

console.log(foods);
// { burger: '?', pizza: '?', custard: '?' }
```

Alternatively, you could also use the square bracket notation to add a new item:

```javascript
foods['cake'] = '?';

console.log(foods);
// { burger: '?', pizza: '?', cake: '?' }
```

As you can see above, when you add a new item to an object, it usually gets added at the end of the object.

To learn more about JavaScript objects, prototypes, and classes, read [this article](https://attacomsian.com/blog/objects-prototypes-classes-javascript).