Loading...

JavaScript Object Methods – Why use them?

JavaScript Object Methods – Why use them?

In this article, we are going to see everything about JavaScript object methods, what are the different JavaScript object methods available in JavaScript, what are the features of JavaScript object methods with examples. So be ready to learn something new from this article.

Introduction

Objects are one of the most important things present in JavaScript, without objects the JavaScript environment is sort of incomplete. As JavaScript is a high-level object-oriented programming language, objects play an essential role in JavaScript.

Definition: JavaScript Object Methods

JavaScript object methods are functions we can call on any object in JavaScript. Every object has these methods which a developer uses daily for creating, adding new elements, checking if elements are present inside the object or not, and so on.

JavaScript objects have different methods we can use to perform various operations to manipulate an existing object or add new properties inside that object. It just makes working easy with any object in JavaScript.

Features of JavaScript Object Methods

JavaScript Object Methods are really useful for copying some values and keys from one of the objects or checking if the object is empty or not. Before these methods, we need to write a long algorithm for checking if the object is open or not, but now we have different ways to find it with the help of object methods. It’s like Object methods make working with objects easy in JavaScript.

Required properties for JavaScript objects methods

In JavaScript, every object has different methods and some of the handy methods are shown below.

Object.create()

The Object.create() creates a new empty object which we can use later and add different keys and values in it. It takes one argument which can be null or an empty JavaScript object. As shown in the example below.

const object = Object.create({}); console.log(object); // {}
Code language: JavaScript (javascript)

As shown in the example, I created an empty object using the Object.create().

Object.keys()

The Object.keys() takes an object as an argument and returns an array containing all the keys from the object which was passed in the Objet.keys(). This method is mostly used for checking if a certain key is present in the object or if the object is empty or not. As shown in the example below.

const user = { name: 'Amol shelke', isLoggedIn: true, } console.log(Object.keys(user)); //output ['name', 'isLoggedIn']
Code language: JavaScript (javascript)

Object.values()

The Object.values(), is similar as Object.keys() the only difference between them is the object.keys() returns an array containing only the keys and on another side the Object.values() returns only the values present in the object. As shown in the example below.

const user = { name: 'Amol shelke', isLoggedIn: true, } console.log(Object.values(user)); //output ['Amol shelke', 'true']
Code language: JavaScript (javascript)

As shown in the example above, the Object.values() returns an array containing only the values.

Object.entries()

The Object.entries() takes an object as an argument and returns an array containing keys and values at the same time, separated by a comma. And if the Object is empty, it will return an empty array as a result of calling the Object.entries() on any object. As shown in the small example below.

const user = { name: 'Amol shelke', isLoggedIn: true, } console.log(Object.entries(user)); //output [['name', 'Amol shelke'], ['isLoggedIn', 'true'] ]
Code language: JavaScript (javascript)

Object.assign()

The Object.assign() copies all the key values from one source object which we passed inside Object.assign() and returned a new object with those keys and values. It takes two arguments, first one to which object we want to assign the values and the second one from which object the keys and values should be taken. A small example is shown below for more about the Object.assign()

const user = { name: 'Amol shelke', isLoggedIn: true, } const newUser = {}; // empty object Object.assign(newUser, user); console.log(newUser); //Output {name: 'Amol shelke', isLoggedIn: true}
Code language: JavaScript (javascript)

In the above example, we are copying the user object keys and values and assigning them to the new User object with the help of Object.assign(). This method is beneficial for copying an object without writing some long algorithm for copying an object.

Object.freeze()

As the name says the Object.freeze() freezes the object on which the method is being called, which means one cannot perform addition or modification of new properties on the existing object, for more details have a look below at the example.

const user = { name: "AMOL", age: 18, }; const freezeObject = Object.freeze(user); freezeObject.name = "amol"; console.log(freezeObject); // the output: {name: 'AMOL', age: 18}
Code language: JavaScript (javascript)

As shown in the example, After calling the Object.freeze() on the user object, the user object is frozen even after trying to change the name property from the user object the result I get is the old user object.

Object.seal()

The Object.seal() is the same as it also does the same as the Object.freeze() do. After applying this method to the existing object, new properties and values cannot be added, but one can change the existing properties of the object.

const user = { name: "AMOL", age: 18, }; const sealObject = Object.seal(user); freezeObject.name = "amol"; console.log(sealObject); // the output: {name: 'amol', age: 18}
Code language: JavaScript (javascript)

As shown in the code example, even after using the object.seal() the object is modified, so you should use Object.freeze() when you want a strictly frozen object.

Object.getProtoTypeOf()

The Object.getProtoTypeOf() returns the prototype of an object. As shown in the example below.

const user = { name: "AMOL", age: 18, }; console.log(Object.getProtoTypeOf(user)); // it will log an big prototype object to the console
Code language: JavaScript (javascript)

like this

Prototype object output
Prototype object output

JavaScript ‘this’ keyword

A simple yet confusing topic in JavaScript, The this keyword is mainly used in objects and methods, most of the time new developer who comes from other languages get confused while working with the this keyword in JavaScript. It’s a whole big topic to start, but I will keep it short and share the reference which you can look at later.

In short, the this keyword refers to the object to which it is being called. If you created an object and inside that object, you called the this keyword it will refer to the object in which it is being called. As shown in the example below.

const user = { name: 'AMOL' hello() { console.log("Hello there", this.name) }, } user.hello();
Code language: JavaScript (javascript)

The result of calling the hello() method on the user object will log a greeting message to the console, and the this keyword will refer to the user object. You can refer to the Namaste JavaScript series for an in-depth understanding of the this keyword.

JavaScript Function V/s JavaScript Method

The JavaScript functions and JavaScript methods are kind of similar to each other, but they are different in some things which we will be discussing here.

In a simple JavaScript function, the this keyword refers to the global window object. On the other hand, the this keyword inside an object method refers to the object in which the this keyword is being called.

Conclusion

That’s it for this article, I hope this article has everything that a JavaScript object method guide should have, and I hope you learned something new from this article. If you found this article helpful, please read some of my articles on codedamn news. And I hope to see you again in another article post.

FAQs

How do you use object methods?

You can object methods in JavaScript with the help of dot notation and the Object constructor, which contains all the methods which are present on a JavaScript object.

How to access an object method from JavaScript? 

JavaScript functions can be used to access object methods. JavaScript stores functions as property values. You can also call the objects without using brackets (). The owner object is referred to as “this” in a method.

How to call an object method, JS?

The call() method is a standard JavaScript method. It can be used to call a method and pass an owner object as an argument (parameter). An object can use a method that belongs to another object by using call().

Is there a way to access an object method from JavaScript?

yes, there is a way to access an Object method from JavaScript and that is to use a dot notation. As shown in the example below.

const user = { name: 'AMOL' hello() { console.log("Hello there", this.name) }, } user.hello();
Code language: JavaScript (javascript)

Sharing is caring

Did you like what Amol Shelke wrote? Thank them for their work by sharing it on social media.

0/10000

No comments so far

Curious about this topic? Continue your journey with these coding courses: