Change the way you create an Object - Javascript Weekly

In this article, we will see different ways to create an object in javascript. Change the way you create an Object - Javascript Weekly

Promise inside a loop - javascript weekly

Prototypal Inheritance - Javascript weekly

Understanding Closures in Javascript

Currying in Javascript

Object plays an important role in javascript ecosystem. we as a javascript developers creates a lots of objects while writing code. we will see some different way to do that

Object as literal

this is a default way to create an object. creating an object with curly braces is the popular way in Object Creation

1const User = {
2 name: "John",
3 age: 25,
4}

object as literal allows to add the property to an object dynamically. For Example, if you want add a property to User object, you can do it like

1User.address = "Country"

In addition to that, you can also have a nested property inside the object literal

1const Company = {
2 name: "Test",
3 tax: {
4 id: "12345",
5 },
6}

"new" Operator

you can also create an object with key word new.

1function Document(name, category) {
2 this.name = name
3 this.category = category
4}
5
6let salarydocument = new Document("salary", "SALARY")
7
8let insurance = new Document("insurance", "INSURANCE")

main advantage of using new operator is, you can use prototype to chain methods. Prototype Chain is an important concept in using new keyword

1function Language(name, shortform) {
2 this.name = name
3 this.shortform = shortform
4}
5
6Language.prototype.getShortForm = function() {
7 return this.shortform
8}
9
10let english = new Language("english", "en")

Object.create() method

Object create method allows you to create an object from an existing one.

For Example, Let's say that you have an object Message, to create an Object with the same property as Message. you can do something like

1let Message = {
2 title: "Hola!",
3 body: "Welcome",
4}
5
6let greeting = Object.create(Message)
7
8console.log(greeting.title)

you can also add property to greeting object

1let Message = {
2 title: "Hola!",
3 body: "Welcome",
4}
5
6let greeting = Object.create(Message, {
7 type: {
8 writable: true,
9 enumerable: true,
10 configurable: false,
11 value: "Data",
12 },
13})
14
15console.log(greeting.type)

Using ES6 Class

ES6 class is an another way to create objects in javascript

1class User {
2 constructor(name, age) {
3 this.name = name
4 this.age = age
5 }
6
7 getInfo() {
8 console.log(`Hey ${this.name} Age : ${this.age}`)
9 }
10}
11
12let admin = new User("admin", 40)
13
14admin.getInfo()

these are all the different ways to create an Object in javascript.

Change the way you create an Object - Javascript Weekly

we will see more aboout Javascript in upcoming articles. I am a big fan of Eric Elliot's work on Javascript Stuffs. checkout his latest article.

Do React Hooks Replace Higher Order Components (HOCs)?

Until then Happy Coding :-)

Author

Hey, I’m Ganesh, Full stack engineer.I love to write technical content and help developers like me to grow in the industry. please consider supporting me.

To Read More

Building a Production-grade Nodejs,...

This article is the first part of building a production grade nodejs,graphql and...

Modern React Redux Tutorials with R...

This tutorial explain how you can build an application using modern react redux ...

Building a Piano with React Hooks

In this article, we will see how to build a piano with react hooks. Building a P...

TypeScript Basics - The Definitive ...

In this article, we will learn some basics of typescript which helps you to deve...

Here's why podman is more secured t...

In this article we will see about podman and why it is more secured way to run c...

Building a Production - Ready Node....

In this article, we will see how to build a Nodejs, TypeScript Application and d...

Nginx for Front-end Developers

This article is to explain Nginx for Front-end Developers in a much simpler way....

What is gRPC ? How to implement gRP...

Everyone talks about gRPC. Have you ever wonder how it works or how to implement...