Codementor Events

JavaScript Objects

Published Jan 26, 2020

Objects in JavaScript can be defined as an unordered list of primitive data types or sometimes referenced data types in form of key(name)-value pairs. Each item present in the list called property.

If you compared with real life example, an object is a standalone entity, which has properties and type. For example, compare it with a house. A house is an object that has properties and it consists of material like woods, concrete, wires etc. The same way, JavaScript objects can have properties, which define their characteristics.

JavaScript has a number of predefined objects. We can also create our own objects using:

Object Initializers
Constructor Function
Object.create Method

Object Initializers

Object initializers is sometimes referred as creating objects with literal notation.
Syntax:

ler obj = {
  prop: "val",
    num: 4
}

Here obj is the name of the object and each property is an identifier and each value is an expression whose value is assigned to the identifier. An identifier can be a name, a number or a string literal.

Constructor Function

A constructor is a function used for initializing new objects and use the new keyword to call the constructor

-- Define the object type by writing a constructor function. There is a strong convention, with good reason, to use a capital initial letter.
-- Create an instance of the object with new keyword

Syntax:

function Car(make, model, year) {
  this.make = make;
  this.model = model;
  this.year = year;
}
// Now we can create an object called mycar as follows:
var mycar = new Car('Eagle', 'Talon TSi', 1993);

Object.create method

Objects can also be created using the Object.create() method. This method can be very useful, because it allows you to choose the prototype object for the object you want to create, without having to define a constructor function.

// Animal properties and method encapsulation
var Animal = {
  type: 'Invertebrates', // Default value of properties
  displayType: function() {  // Method which will display type of Animal
    console.log(this.type);
  }
};

// Create new animal type called animal1 
var animal1 = Object.create(Animal);
animal1.displayType(); // Output:Invertebrates

// Create new animal type called Fishes
var fish = Object.create(Animal);
fish.type = 'Fishes';
fish.displayType(); // Output:Fishes

Deleting properties
You can remove a non-inherited property by using the delete operator. The following code shows how to remove a property

// Creates a new object, myobj, with two properties, a and b.
var myobj = new Object;
myobj.a = 5;
myobj.b = 12;

// Removes the a property, leaving myobj with only the b property.
delete myobj.a;
console.log ('a' in myobj); // output: "false"

You can also use delete to delete a global variable if the var keyword was not used to declare the variable:

g = 17;
delete g;

Comparing objects
In JavaScript, objects are a reference type. Two distinct objects are never equal, even if they have the same properties. Only comparing the same object reference with itself yields true.

// Two variables, two distinct objects with the same properties
var fruit = {name: 'apple'};
var fruitbear = {name: 'apple'};

fruit == fruitbear; // return false
fruit === fruitbear; // return false
// Two variables, a single object
var fruit = {name: 'apple'};
var fruitbear = fruit;  // Assign fruit object reference to fruitbear

// Here fruit and fruitbear are pointing to same object
fruit == fruitbear; // return true
fruit === fruitbear; // return true

fruit.name = 'grape';
console.log(fruitbear); // output: { name: "grape" }, instead of { name: "apple" }

Source: mozilla

Discover and read more posts from Saurabh Yadav
get started
post commentsBe the first to share your opinion
tyger
3 years ago
Show more replies