# Object -

# Object -

Defining Object, Accessing properties, inherit object, attributes on properties, this keyword etc are captured in this article

Definition -

Object represents a JavaScript's data types. It is used to store various keyed collections and more complex entities.

Objects can be created using the Object() constructor or the object initializer / literal syntax. Objects can also be initialized using new Object() or Object.create().

Nearly all objects in JavaScript are instances of Object.

Syntax -

<var_type> <object_name> = {
    <properties_and_methods_here>
}

We can store any type of data on object.

There are three ways to access Object properties need to know -

There are different methods for defining object -

Methods for creating object

Object defined by curly bracket "{ }", and everything under curly bracket "{ }" are properties or methods.

Part - 1

Normal method for defining object is here-

// Creating/Defining Object
const obj1 = {
    name : "Vikas Raj",
    age : 25,
    study : {
        college : "Delhi University"
    }
}
// Accessing Properties
console.log(obj1.name);
console.log(obj1['name']);

Output -

Setting New values -

const obj1 = {
    name : "Vikas Raj",
    age : 25,
    study : {
        college : "Delhi University"
    }
}
// Set new property
obj1.name = "Vijay Vargi";
obj1['name'] = "Vijay Vargi";
// Showing values
console.log(obj1.name);
// Showing object
console.log(obj1);

Output -

Part - 2

There are many methods for defining object, second one is here, which is via - "new Object()" method.

//Defining object
const obj2 = new Object();

// Creating properties
obj2.country = "India";
obj2.language = ["Hindi", "English"];
// Showing object
console.log(obj2);

Output -

Part - 3

Inherit Properties of object -

// Object created
const powers = {
    fly: true,
    value: Math.random() * 100
}
//Showing upper object
console.log(powers);

// Creating inheritate object -- Object.create()-- method
const obj3 = Object.create(powers)

// Showing inheritate object
console.log(obj3);
console.log(obj3.value);
console.log(Object.getPrototypeOf(obj3));

getPrototypeOf() is a method for getting properties of object.

If we create object with inheritance then prperties of parent object comes under prototype of inheritate object, so we need to access properties through getPrototypeOf() method

Output -

Part - 4

We have another method for defining property -

We use defineProperty() mehod for defining, It is more powerful we can give extra security to properties by using attributes.

Syntax - Object.defineProperty(object_name, property_name, descriptor)

Object Atributes -

writable: true/false;

enumerable: true/false;

configurable: true/false;

Here we can enumarable:true/false attribute on property, default is false means property is not enumerable or accessible, if we set it true then property is enumerable.

We can give direct value: "" by defineProperty() or we can use get() method .

Note - remember that we cant use both value:"" and get() method at same time, it gives error.

  • Showing first method - value="" with both enumerable: true/fals
// Object Defining
const obj4 = Object.create({})

// Property giving -- enumerable:false--
Object.defineProperty(obj4, 'newValue', {
    value: 37,
    // default -- enumerable: false
})
console.log(obj4);
console.log(obj4.book);
console.log(Object.getPrototypeOf(obj4));
// Looping
for(k in obj4){
    console.log("value is: ", obj4[k]);
}

Output - enumerable: false;

const obj4 = Object.create({})

Object.defineProperty(obj4, 'newValue', {
    value: 37,
    default -- enumerable: true
})
console.log(obj4);
console.log(obj4.book);
console.log(Object.getPrototypeOf(obj4));
// Looping
for(k in obj4){
    console.log("value is: ", obj4[k]);
}

Output - enumerable: true;

  • Showing second method - get() with both enumerable: true/false
// Object Defining
const obj4 = Object.create({})

// Property giving
Object.defineProperty(obj4, 'newValue2', {
    get: () => 700,
    //default - enumerable: false
})

console.log(obj4);
console.log(obj4.newValue2);
console.log(Object.getPrototypeOf(obj4));
// Looping
for(k in obj4){
    console.log("value is: ", obj4[k]);
}

Output - get() - enumerable: false;

const obj4 = Object.create({})

Object.defineProperty(obj4, 'newValue2', {
    get: () => 700,
    enumerable: true
})
console.log(obj4);
console.log(obj4.newValue2);
console.log(Object.getPrototypeOf(obj4));

for(k in obj4){
    console.log("value is: ", obj4[k]);
}

Output - get() - enumerable: true;

Part - 5

Most common thing in javascript is using this keyword, this means it refer to its current parent or calling object or current scope or function, it behave different according to calling function or

const test = {
    myName: "Aj",
    val1: 0,
    func1: function() {
        // Accessing 
        this.val1 += 50,
        console.log(this.val1);
        return this;
    },
};

console.log(test.func1());

Output -

If we try chaining a function on func1() like this -

console.log(test.func1().func1().func1());

Remember that this is not refer current object when we make function to arrow function, it refers to globle object in this example below -

const test = {
    myName: "Aj",
    val1: 0,
    func1: () => {
        // this.val1 += 50,
        console.log(this.val1);
        return this;
    },
};

console.log(test.func1());

Output -

We can see here that val1 is undefined and return this also return { } (empty object), when we run it on browser than it gives globle object instead of empty object

this keyword vary much more according to strict mode also, I prefer MDN for more to know about this keyword .

Thankyou for reading

This are all the things I learn in object, if any suggestion you have, you can give me.