Skip to main content

Object syntax

The Object in JavaScript is one of the most important and widely used data types. An object is a collection of properties, and a property is an association between a key (or name) and a value.

Creating an Object​

There are several ways to create an object in JavaScript:

Object Literal​

let obj = { key: "value", key2: "value2" };

Using new Object()​

let obj = new Object();
obj.key = "value";

Using Object.create()​

let prototype = { key: "value" };
let obj = Object.create(prototype);

Common Methods of Object​

Object.assign()​

This method copies all enumerable own properties from one or more source objects to a target object.

let target = { a: 1 };
let source = { b: 2, c: 3 };
let returnedTarget = Object.assign(target, source);

console.log(target); // { a: 1, b: 2, c: 3 }
console.log(returnedTarget); // { a: 1, b: 2, c: 3 }

Object.create()​

This method creates a new object, using an existing object as the prototype of the newly created object.

let person = {
isHuman: false,
printIntroduction: function () {
console.log(`My name is ${this.name}. Am I human? ${this.isHuman}`);
},
};

let me = Object.create(person);
me.name = "Matthew"; // "name" is a property set on "me", but not on "person"
me.isHuman = true; // inherited properties can be overwritten

me.printIntroduction(); // "My name is Matthew. Am I human? true"

Object.defineProperty()​

This method defines a new property directly on an object, or modifies an existing property on an object, and returns the object.

let obj = {};
Object.defineProperty(obj, "key", {
value: "static",
writable: false,
enumerable: true,
configurable: true,
});

console.log(obj.key); // "static"

Object.defineProperties()​

This method defines new or modifies existing properties directly on an object, returning the object.

let obj = {};
Object.defineProperties(obj, {
property1: {
value: true,
writable: true,
},
property2: {
value: "Hello",
writable: false,
},
});

console.log(obj.property1); // true
console.log(obj.property2); // "Hello"

Object.entries()​

This method returns an array of a given object's own enumerable string-keyed property [key, value] pairs.

let obj = { a: 1, b: 2, c: 3 };
console.log(Object.entries(obj)); // [["a", 1], ["b", 2], ["c", 3]]

Object.freeze()​

This method freezes an object. A frozen object can no longer be changed.

let obj = {
prop: function () {},
foo: "bar",
};

Object.freeze(obj);
obj.foo = "baz"; // Fails silently in non-strict mode
console.log(obj.foo); // "bar"

Object.fromEntries()​

This method transforms a list of key-value pairs into an object.

let entries = [
["foo", "bar"],
["baz", 42],
];
let obj = Object.fromEntries(entries);

console.log(obj); // { foo: "bar", baz: 42 }

Object.getOwnPropertyDescriptor()​

This method returns a property descriptor for a named property on an object.

let obj = { a: 1 };
let descriptor = Object.getOwnPropertyDescriptor(obj, "a");

console.log(descriptor);
// { value: 1, writable: true, enumerable: true, configurable: true }

Object.getOwnPropertyDescriptors()​

This method returns all own property descriptors of a given object.

let obj = { a: 1, b: 2 };
let descriptors = Object.getOwnPropertyDescriptors(obj);

console.log(descriptors);
/*
{
a: { value: 1, writable: true, enumerable: true, configurable: true },
b: { value: 2, writable: true, enumerable: true, configurable: true }
}
*/

Object.getOwnPropertyNames()​

This method returns an array of all properties (including non-enumerable properties except for those which use Symbol) found directly in a given object.

let obj = { a: 1, b: 2, c: 3 };
console.log(Object.getOwnPropertyNames(obj)); // ["a", "b", "c"]

Object.getOwnPropertySymbols()​

This method returns an array of all symbol properties found directly upon a given object.

let obj = {};
let sym = Symbol("foo");
obj[sym] = "bar";

console.log(Object.getOwnPropertySymbols(obj)); // [Symbol(foo)]

Object.getPrototypeOf()​

This method returns the prototype (i.e., the value of the internal [[Prototype]] property) of the specified object.

let proto = {};
let obj = Object.create(proto);

console.log(Object.getPrototypeOf(obj) === proto); // true

Object.is()​

This method determines whether two values are the same value.

console.log(Object.is("foo", "foo")); // true
console.log(Object.is({}, {})); // false

Object.isExtensible()​

This method determines if an object is extensible (i.e., whether new properties can be added to it).

let obj = {};
console.log(Object.isExtensible(obj)); // true

Object.preventExtensions(obj);
console.log(Object.isExtensible(obj)); // false

Object.isFrozen()​

This method determines if an object is frozen.

let obj = Object.freeze({});
console.log(Object.isFrozen(obj)); // true

Object.isSealed()​

This method determines if an object is sealed.

let obj = Object.seal({});
console.log(Object.isSealed(obj)); // true

Object.keys()​

This method returns an array of a given object's own enumerable property names, iterated in the same order that a normal loop would.

let obj = { a: 1, b: 2, c: 3 };
console.log(Object.keys(obj)); // ["a", "b", "c"]

Object.preventExtensions()​

This method prevents new properties from ever being added to an object (i.e., prevents future extensions to the object).

let obj = {};
Object.preventExtensions(obj);

obj.newProp = "new value"; // Fails silently in non-strict mode
console.log(obj.newProp); // undefined

Object.seal()​

This method seals an object, preventing new properties from being added to it and marking all existing properties as non-configurable. Values of present properties can still be changed as long as they are writable.

let obj = { prop: "value" };
Object.seal(obj);

obj.newProp = "new value"; // Fails silently in non-strict mode
console.log(obj.newProp); // undefined

obj.prop = "new value"; // Works because the property is still writable
console.log(obj.prop); // "new value"

Object.setPrototypeOf()​

This method sets the prototype (i.e., the internal [[Prototype]] property) of a specified object to another object or null.

let proto = {};
let obj = {};
Object.setPrototypeOf(obj, proto);

console.log(Object.getPrototypeOf(obj) === proto); // true

Object.values()​

This method returns an array of a given object's own enumerable property values, in the same order as that provided by a for...in loop.

let obj = { a: 1, b: 2, c: 3 };
console.log(Object.values(obj)); // [1, 2, 3]

Conclusion​

The Object in JavaScript provides a plethora of methods to interact with objects, modify them, and retrieve information. Understanding these methods is crucial for effectively working with objects in JavaScript.