Overview
Javascript is a language which is designed with an object based paradigm. Objects are normally considered to be non-primitive values. Non-primitive values are those values which are passed by reference.
Objects like in any other programming language are collection of properties where properties are defined by a name followed by a value. This data-type is often used to define something which has many properties associated with it. Properties in Objects are variables which will have corresponding value stored in it.
Objects can be very easily related to real-life objects, for example car. A car is an object which has various properties like colour, type, brand, mileage etc associated with it. Similarly Javascript Objects contains properties which defines their characteristics.
Creating Object
In Javascript, there are many ways by which we can create an Object. We will be looking into these in-depth down the line.
1. Object Initialiser
The most common way of creating an object is by using object initialiser. Object initialiser is nothing but a comma-delimited list of zero or more pairs of property names and associated values, enclosed in curly braces {}
In the above example, blog is the name of the object, type, name and language are the properties and Technical, Javascript and English are the values associated with the properties respectively. Objects created using object initialisers are always instances of Object.
2. Constructor Function
This is a method where we define the type of the object using a constructor function and create an instance of Object using the new keyword.
The constructor function defines the type of the Object by providing name, properties and a method for the type.
In this example myBlog is an object which is of the type Blog where Technical, Javascript and English would be the values of the properties type, name and language respectively. If you notice in the constructor function, we have used the this keyword. Here, this is mainly used to assign the values to the properties based on the values passed to the function.
3. Object.create() method
This is a method which helps to create a new object using existing object as the prototype of the newly created object. Prototype is nothing but a mechanism by which Javascript Object inherits features from one another.
Property Access
As mentioned above, properties in an Object can be considered as variables which stores values within it. Property names can be any valid Javascript String or anything that can be converted to valid string including the empty string.
Properties can be accessed either using dot or bracket notation. dot notations are usually used to access object properties or create properties provided the properties adhere to Javascript identifier rules.
In the above example, blog.type would be valid way of defining a property in blog object as the property name type is adhering to Javascript identifier rules and can also be converted to a valid Javascript String using the toString() method. If you look at the next line blog.1, this will throw an error as it does not adhere to the Javascript identifier rules.
How do we fix the above example ?
In these cases we can make use of bracket notations where we can create/access properties which are not adhering to identifier rules or are not strings. So the final code will look as below
bracket notations are generally used when we want dynamic properties or in case where we need to access/create properties which are numbers, names stored in variables etc.
In one of the above sections we mentioned that Objects values are passed by reference. What does this actually mean ?
In the above example we have a function changeValue whose purpose is to change the property first to true and oldObject is our default object that we created which has a property first containing a value false.
On calling the function changeValue by passing our oldObject to the function, Javascript will point the newObject variable to already existing property first: false. On executing newObject.first = true, will change the property first where in oldObject.first and newObject.first will show true as both are pointing to the same property.
Summary
- What are Javascript Objects
- How to create Javascript Objects
- How to access Object Properties
- What is pass-by-reference
Thank you
Hope you enjoyed this short read on Javascript Objects. We will be discussing more on this topic in Part 2. Let me know your thoughts in the comments section below. If you understood and enjoyed reading, please do show your love and share this to your fellow beings who could make maximum use of this. Always feel free to connect with me via twitter, linkedIn or email. Happy to help in all ways possible 😊
Until we meet again, The Mallu Dev signing off 👋 Cheers 🥂