Working with JavaScript Objects
JavaScript objects are versatile structures for storing and managing data in key-value pairs, enabling the organization of complex data sets. They support various data types as values, including arrays and other objects, and offer functionality through methods. Objects in JavaScript are essential for representing real-world data and facilitating object-oriented programming techniques.
In this article, we will talk more about JavaScript objects, their significance, how to create objects in JavaScript, and defining JavaScript object methods.
Read out: JavaScript Classes
Table of Contents
- JavaScript Objects
- JavaScript Objects Inherited Properties
- Creating JavaScript Objects
- JavaScript Object Methods
- More about JavaScript Objects
JavaScript Objects
A JavaScript object is a stateful entity with behavior (properties and method). JavaScript is template-based rather than class-based. We don’t create a class to get the object here. However, we direct the creation of objects. Objects represent a very important data type in JavaScript and serve as the foundation for modern JavaScript. These objects differ from JavaScript’s primitive data types such as String, Number, Boolean, undefined, null, and symbol. In this, they tend to store a single value, whereas the primitive data types store multiple values and it depends on their types.
Let us see the syntax for an object in JavaScript:
let obj_name = { key_name : value, ….. }
Check out: Free JavaScript Courses Online
Best-suited JavaScript courses for you
Learn JavaScript with these high-rated online courses
JavaScript Objects Inherited Properties
An object’s inherited properties are those that were inherited from the object’s prototype rather than being classified for the object on its own, which is recognized as the object’s Own property. The function hasOwnProperty() { [native code] } method can be used to determine whether a property is an object’s Own property. Property Attributes In JavaScript, data properties have four attributes.
- Value: The worth of the property.
- Writable: When it is true, the value of the property can be changed.
- Enumerable: When true, the property can be iterated over using “for-in”. If this is not the case, the property is said to be non-enumerable.
- Configurable: If this is false, attempt to delete the property, convert it to an access-or property, or change its attributes.
Also read: Java vs JavaScript: Difference between Java and JavaScript.
Creating JavaScript Objects
1. Creating Object using Object Literal In JavaScript
Let us see a simple JavaScript code to create a object using Object Literal:
<script> let School = { name: 'DAV School', location : 'Himachal', established : '1950', displayInfo : function(){ console.log(`${School.name} was founded in ${School.established} at ${School.location}`); } } School.displayInfo();</script>https://www.shiksha.com/online-courses/what-is-javascript-st619-tg305#description
Output:
DAV School was founded in 1950 at Himachal
Read More: Introduction to JavaScript Data Types With Examples
2. Creating Object using Object Literal In JavaScript (with new keyword)
Let us see a simple JavaScript code to create an object using the ‘new’ keyword:
<html><body><script> var employee=new Object(); employee.id=100; employee.name="Megha"; employee.salary=70000; [removed](employee.id+" "+employee.name+" "+employee.salary); </script> </body></html>
Output:
100 Megha 70000
Explore more: JavaScript Functions
3. Creating Object using Object Constructor in JavaScript
Let us see a simple JavaScript code to create an object using the ‘this’ constructor:
<html><body><script> function employee(ID,name,salary){ this.ID=ID; this.name=name; this.salary=salary; } x=new employee(100,"Megha",70000); [removed](x.ID+" "+x.name+" "+x.salary); </script> </body></html>
Output:
100 Megha 70000
JavaScript Object Methods
SNo. | Method | Description |
1 | Object.assign() | Copies the values and properties from the source object to a target object |
2 | Object.create() | Used to creates new object with the specified properties. |
3 | Object.defineProperty() | Used to define the behavioral attributes/ properties of the object. |
4 | Object.enteries() | Returns an array with key-value pairs of the object. |
5 | Object.freeze() | Prevents existing properties from being removed. |
6 | Object.is() | Compares if two objects have are the same value |
7 | Object.getPrototypeOf() | Returns the prototype of the specified object. |
8 | Object.seal() | Prevents the addition of any new properties and marks all existing properties as non-configurable. |
9 | Object.preventExtensions() | Prevents addition of any new property to an object. |
10 | Object.values() | This method returns an array of values |
More about JavaScript Objects
- Objects are more complex, with any mixture of the primitive data types and reference data types possible.
- An object is a type of reference data. Variables that have a reference value assigned to them are provided a reference or even a pointer to that value. This reference or pointer points toward the memory location where the object is stored. The variables do not store the value.
- Objects in JavaScript have loosely defined like an unsorted collection of related data in the form of “key: value” pairs of primitive types. In the context of an object, these keys could be variables or functions, which are referred to as properties and methods, respectively.
Check out: Top 85+ JavaScript Interview Questions and Answers for 2022
Conclusion
In this article, we have talked about JavaScript Objects in detail. A JavaScript object is a stateful entity with behavior (properties and method). JavaScript is template-based rather than class-based. We don’t create a class to get the object here. We have also discussed 3 main types for creating a JavaScript object along with the methods of JavaScript Objects.
Author: Megha Garg
Top FAQs on Working with JavaScript Objects
What is a JavaScript object?
A JavaScript object is a collection of key-value pairs, where keys (or properties) can be strings or symbols, and values can be any data type, including functions or other objects.
How do you create an object in JavaScript?
You can create an object using curly braces {}, with an optional list of properties. For example: let person = { name: "Alice", age: 25 };.
How do you access and modify properties in an object?
Access properties using dot notation (
object.property
object["property"]
object.property = newValue
How do you add new properties to an object?
Add new properties by simply assigning a value to a new key, such as
object.newProperty = value
This is a collection of insightful articles from domain experts in the fields of Cloud Computing, DevOps, AWS, Data Science, Machine Learning, AI, and Natural Language Processing. The range of topics caters to upski... Read Full Bio