JavaScript Objects

• A javascript object is an entity having a state and behavior (properties and method). For example: car, pen, bike, chair, glass, keyword, monitor etc.

• Javascript is an object-based language. Everything is an object in javascript.

• Javascript is template-based not class-based. Here, we don't create class to get the object. But, direct create objects.

1. Javascript object by object literal

• The syntax of creating an object using literal is given below:

 object={property1:value1,
 property2:value2.....propertyN:valueN
}

• As you can see, property and value is separated by : (colon).

• Let's see the simple example of creating an object in javascript.

 <script>  
  emp={id:104, name:"syed riza", salary:40000}  
  document.write(emp.id+" "+emp.name+" "+emp.salary);  
</script>

The output of the above example:-

104 Syed riza 80000

2. By creating instance of obejct

• The syntax of creating object directly is given below:

• Let's see the example of creating object directly.

var objectname=new Object();

• Here, a new keyword is used to create an object.

• Let's see the example of creating an object directly.

<script>  
var emp=new Object();  
emp.id=105;  
emp.name="syed riza";  
emp.salary=60000;  
document.write(emp.id+" "+emp.name+" "+emp.salary);  
</script>

The output of the above example:-

105 Syed riza 60000

3. By using an object constructor

• Here, you need to create a function with arguments. Each argument value can be assigned in the current object by using this keyword.

• The this keyword refers to the current object.

• The example of creating an object by constructor is given below

<script>  
function emp(id,name,salary){  
this.id=id;  
this.name=name;  
this.salary=salary;  
}  
e=new emp(102,"md naqi",20000);  

document.write(e.id+" "+e.name+" "+e.salary);  
</script>

The output of the above example:-

102 md naqi 20000

Defining method in javascript object

• We can define a method in a javascript object. But before defining the method, we need to add a property in the function with the same name as a method.

• An example of defining a method in the object is given below.

<script>  
function emp(id,name,salary){  
this.id=id;  
this.name=name;  
this.salary=salary;  

this.changeSalary=changeSalary;  
function changeSalary(otherSalary){  
this.salary=otherSalary;  
}  
}  
e=new emp(104,"riza askari",40000);  
document.write(e.id+" "+e.name+" "+e.salary);  
e.changeSalary(55000);  
document.write("<br>"+e.id+" "+e.name+" "+e.salary);  
</script>

The output of the above example:-

104 riza askari 40000
104 riza askri 55000

JavaScript Object methods

1. Object.assign()

2. Object.create()

3. Object.defineProperty()

4. Object.defineproperties()

5. Object.entries()

6. Object.freeze()

7. Object.getOwnPropertyDescriptor()

8. Object.getOwnPropertyNames()

9. Object.getOwnPropertySymbols()

10. Object.is()

1. Javascript Object.assign() Method

• The Object.assign() method is used to copy the values of all enumerable own properties from one or more source objects to the target object. Objects are assigned and copied by reference. It will return the target object.

Syntax:-

Object.assign(target, sources)

Parameter:-

Target:- The target object.

Sources:- The source objects.

Return value:-

This method returns the target object.

Example:-

const object1 = {  
  a: 1,  
  b: 2,  
  c: 3  
};  
const object3= {  
  g: 1,  
  h: 2,  
  i: 3  
};    

const object2 = Object.assign({c: 4, d: 5}, object1);  
const object4 = Object.assign({g: 34, h: 25}, object3);  
console.log(object2.c, object2.d);  
console.log(object4.g, object4.h);

output:-

3
2
4
1
5

2. Javascript Object.create() Method

• The object.create() method is used to create a new object with the specified prototype object and properties. we can create an object without a prototype by Object.creates(null).

Syntax:-

Object.create(prototype[, propertiesObject])

Parameter:-

• prototype: It is the prototype object from which a new object has to be created.

• propertiesObject: It is an optional parameter. It specifies the enumerable properties to be added to the newly created object.

Return value:-

Object.create() returns a new object with the specified prototype object and properties.

Example:-

const people = {  
  printIntroduction: function ()  
   {  
    console.log(`My name is ${this.name}. Am I human? ${this.isHuman}`);  
  }  
};  
const me = Object.create(people);  
me.name = "syed"; // "name" is a property set on "me", but not on "person"  
me.isHuman = true; // inherited properties can be overwritten  
me.printIntroduction();

output:-

"My name syed. Am I human? true"

3. JavaScript Object.defineProperty() Method

• The Object.defineProperty() method defines a new property directly on an object and returns the object. To change the flags, we can use Object.defineProperty(). We cannot change it back, because define property doesn't work on non-configurable properties.

Syntax:-

Object.defineProperty(obj, prop, descriptor)

Parameter:-

Object: The Object on which to define the property.

Property: The name of a property to be defined or modified.

Descriptor: The descriptor for the property being defined or modified.

Return value:-

This method returns the object that was passed to the function.

Example:-

const object1 = {};  
Object.defineProperty(object1, 'property1', {  
  value: 22, } );  
  object1.property1;  
    // throws an error in strict mode  
console.log(object1.property1);

Output:

22

4. Javascript Object.defineProperties() Method

• The Object.defineProperties() Method defines new or modifies existing properties directly on an object, and returns the object.

Syntax:-

Object.defineProperties(obj, props)

Parameter:-

Object: The object on which to define or modify properties.

Property: An object whose own enumerable properties constitute descriptors for the properties to be defined or modified.

Return value:-

This method reruns an object that was passed to the function.

Example:-

const object1 = {};  
Object.defineProperties(object1, {  
  property1:{  
value: 44, }  
 });  
console.log(object1.property1);

Output:

44

5. Javascript object.entries() Method

• Javascript object.entries() Method is used to return an array of a given object's own enumerable property [kay. value] pairs. The ordering of the properties is the same as that given by lopping over the property values of the object manually.

Syntax:-

Object.entries(obj)

Parameter:-

Object: It is an object whose enumerable property [key, value] pair are to be returned.

Return value:-

This method returns an array of the given object's own enumerable property [key, value] pairs.

Example:-

const obj = { 10: 'arry', 21: 'barry', 23: 'carry' };  
console.log(Object.entries(obj)[2]);

Output:-

["23", "carry"]

6. javascript object.freeze() Method

• The Object.freeze() method freezes an object that prevents new properties from being added to it. This method prevents the modification of existing properties, attributes, and values.

Syntax:-

Object.freeze(obj)

Parameter:-

Object: The object to freeze.

Return value:-

This method returns the object that was passed to the function.

Example:-

  const object1 = {  
  property1: 22  
};  
const object2 = Object.freeze(object1);  
object2.property1 = 33;  
// Throws an error in strict mode  
console.log(object2.property1);

Output:-

22

7. JavaScript Object.getOwnPropertyDescriptor() Method

• The Object.getOwnPropertyDescriptor() Method allows to query the full information about a property and returns a property descriptor for an own property (that is, one directly present on an object and not in the object's prototype chain) of a given object.

Syntax:-

bject.getOwnPropertyDescriptor(obj, prop)

Parameter:-

object: It is the object in which to look for the property.

Property: It is the name of the property whose description is to be retrieved.

Return value:-

It returns a property descriptor of the given property if it exists on the object.

Example:-

  const object1 = {  
  property1: 42  
}  
const object2 = {  
  property2: 34  
}  
const descriptor1 = Object.getOwnPropertyDescriptor(object1, 'property1');  
const descriptor2 = Object.getOwnPropertyDescriptor(object2, 'property2');  
console.log(descriptor1.enumerable);  
console.log(descriptor2.enumerable);  
console.log(descriptor1.value);  
console.log(descriptor2.value);

Output:-

true
true
42
34

8. JavaScript Object.getOwnPropertyNames() Method

• The Object.getOwnPropertyNames() Method returns an array of all properties (except those non-enumerable properties which use Symbol) found directly upon a given object.

Syntax:-

Object.getOwnPropertyNames(obj)

Parameter:-

object: It is the object whose enumerable and non-enumerable own properties are to be returned.

Return value:-

This method returns an array of strings that correspond to the properties found directly upon the object.

Example:-

 const object1 = {  
  a: 0,  
  b: 1,  
  c: 2,  
};  
console.log(Object.getOwnPropertyNames(object1));

Output:-

["a", "b", "c"]

9. JavaScript Object.getOwnPropertySymbols() Method

• The Object.getOwnPropertySymbols() Method returns an array of all symbol properties found directly upon a given object. This method returns an empty array unless you have set symbol properties on your object.

Syntax:-

Object.getOwnPropertySymbols(obj)

Parameter:-

object: It is an object whose symbol properties are to be returned.

Return value :-

This method returns an array of all symbol properties found directly upon the given object.

Example:-

 const object1 = {};  
 a = Symbol('a');  
 b = Symbol.for('b');  
const objectSymbols = Object.getOwnPropertySymbols(object1);  
console.log(objectSymbols.length);

Output:-

0

10. JavaScript Object.is() Method

• The Object.is() method of JavaScript is used to determine whether two values are the same value. There is a special built-in method that compares values.

Syntax:-

Object.is(value1, value2);

Parameter:-

Value 1: The first value to compare.

value 2: The second value to compare.

Return value:-

This method returns a Boolean indicating whether or not the two arguments are the same value

Example:-

const object1 = {};  
console.log(Object.is(object1));

Output:-

false

HAPPY Learning!!!💫