Table of Contents
Objects in javascript | How to create objects in javascript
So, Don’t worry Learners we are the Codewithrandom team are here to help you. Today we are going to have new learning that will make your Christmas eve enjoyable and memorable ๐๐.
Prerequisite – You should have basic knowledge of Javascript and Data type in javascript. If you want to quick recap of these topics then please go through it. Data Type Javascript.
OBJECTS
Object Properties Methods
- bike.name- Steelgrip bike.start()
- bike.model-2020 bike.flash()
- bike.weight- 950kg bike.stop()
- bike.color-blacksketch bike.break()
Note –
- All bikes have the same properties, but the property value differs from bike to bike.
- All bikes have the same methods, but the methods are performed at different times.
let bike = {
name:'steelgrip',
model:2020,
//method
startdisplay : function(){
return (`The name of bike is
${bike.name} and model number is ${bike.model}`)
},
//object within object
internal_feature : {
weight:'950kg',
color:'blacksketch'
}
}
console.log(bike.startdisplay());
console.log(bike.internal_feature.weight);
//Output will be
The name of bike is
steelgrip and model number is 2020
950kg
I know you must be thinking what is this weird code all about. So Learner this is our object. An Object can be created with figure brakets{–} with an optional list of properties. A properties is a “key: value” pair, value could be anything as per user wants. And at the same place of key, we can put our method as well which will be our function. So, all these properties you can match up with the above example๐.
So, we have two-three different approaches for creating objects.
Creating Objects
- Using object literals: Object literal syntax uses the {โฆ} notation to initialize an object and its methods/properties directly. Let us look at an example of creating objects using this method.
let bike = {
name:'steelgrip',
model:2020,
//method
startdisplay : function(){
return (`The name of bike is
${bike.name} and model number is ${bike.model}`)
},
//object within object
internal_feature : {
weight:'950kg',
color:'blacksketch'
}
}
console.log(bike.startdisplay());
console.log(bike.internal_feature.weight);
//Output will be
The name of bike is
steelgrip and model number is 2020
950kg
This is the same example as above because we used string literal in this example.
const company = new Object();
company.name = 'steelforth India';
company.location = 'Shrinagar';
company.established = 1951;
company.displayInfo = function(){
console.log(`${company.name} was established
in ${company.established} at ${company.location}`);
}
company.displayInfo();
//Output will be
steelforth India was established
in 1951 at Shrinagar
3. Constructors: Constructors in JavaScript, like in most other OOP languages, provide a template for the creation of objects. In other words, it defines a set of properties and methods that would be common to all objects initialized using the constructor.
Let’s see an example :
function Vehicle(name, maker) {
this.name = name;
this.maker = maker;
}
let car1 = new Vehicle('Fiesta', 'Ford');
let car2 = new Vehicle('Santa Fe', 'Hyundai')
console.log(car1.name); // Output: Fiesta
console.log(car2.name); // Output: Santa Fe
aa
- dot notation : (objectName.member name)
const company = new Object();
company.name = 'steelforth India';
company.location = 'Shrinagar';
company.established = 1951;
company.displayInfo = function(){
console.log(`${company.name} was established
in ${company.established} at ${company.location}`);
}
console.log(company.name); // Output: steelforth India
console.log(company.established); // Output: 1951
2. Bracket Notation : objectName[“memberName”]
const company = new Object();
company.name = 'steelforth India';
company.location = 'Shrinagar';
company.established = 1951;
company.displayInfo = function(){
console.log(`${company.name} was established
in ${company.established} at ${company.location}`);
}
console.log(company.['name']); // Output: steelforth India
console.log(company.['established']); // Output: 1951
Iterating over all keys of an object
let employee = {
gender : "male"
}
var worker1 = Object.create(employee);
worker1.name = "Newton";
worker1.age = 23;
worker1.specialist = "Cricketer";
for (let key in worker1) {
console.log(key);
}
//output
name
age
specialist
gender
Deleting properties
delete
operator. An example of its usage has been listed below:let person1 = {
channelname: "Edux"
}
// Output : Edux
console.log(person1.channelname);
delete person1.channelname
// Output : undefined
console.log(person1.channelname);