10 Oct 2022
Technology
2
min read
Codehouse Dev Team
,
Development
An object is a collection of properties. Properties are identified using key values. They’re the same as variables except they’re assigned to an object. Methods are functions assigned to the object.
JavaScript provides a range of built-in methods that can be accessed on the global object constructor. This article examines the following:
Object constructors
Object literals
Accessing object properties
Object methods
this Keyword
Merging objects
Object.assign
Object constructors
Constructor functions are one way of creating objects in JavaScript. Using a constructor for an object creates a ‘blueprint’. This allows for many instances of the same object to be created using a keyword.
Property values are passed to the constructor using arguments.
Object literals
ECMAScript 2015, also known as ES6 provides shorthand for Object Literal notation when assigning variables to an object’s properties.
Accessing object properties
The examples below covers the following:
Dot notation
Bracket notation
Dot notation
Dot notation is used most often, as it’s the easiest to read. The syntax is: objectName.propertyName.
Bracket notation
Bracket notation allows for the use of variables that resolve a string. The syntax for bracket notation is: objectName[`propertyName’].
Object methods
Methods are actions performed on Objects. An Object Method is an object Property that contains a function definition. Below are examples of the following Object Methods:
Object.values()
Object.keys()
Object.freeze()
Object.seal()
Object.values()
Object.values() is a method that returns an array of an object's own property values.
Object.keys()
Object.keys() is a method that returns an array of an object's own property names.
Object.freeze()
The method Object.freeze freezes an object.
A frozen object can’t be changed. It prevents properties from being added and removed. It also prevents the values of properties from being changed - unless it’s an object.
You can check if an object is frozen by using: Object.isFrozen().
Object.seal()
Object.seal is a similar method to Object.freeze(). It prevents you from adding or deleting properties of an object, but you can change the value of an existing property.
Similarly, you can check if an object has been sealed by using Object.isSealed()
this Keyword
By default the ‘this’ keyword in JavaScript references an object executing the current function. It refers to a global object - the window object in the browser.
If the function is a method in an object, it refers to the object.
Merging objects
ES6 introduced the spread operator which allows objects to be easily merged. The Spread Syntax method combines the source objects in one new object.
Object.assign()
The Object.assign method copies the properties of source objects to a target object. This differs slightly from using the spread syntax as it amends an existing object.
The syntax is: Object.assign(target, …sources).
Working with Codehouse
Our talented development team are constantly looking at ways to improve the development process and the user experience. We work on exciting design and build projects often on platforms like Sitecore. Get in touch to find out more