Evolution of Making Object in Javascript
Tags: javascript, programming, webdev, tutorial
Published: 2024-02-03 18:23:15



A constructor function can be made with or without `class`. Class was introduced in ES6 to concise the process of making `Object`. There are different ways to create a universal model to create multiple objects. For instance, if you want to create an `Object` in traditional way, you have to make a `function` where you have to make an `object` which will be returned later and for making extra methods or properties you need to push those methods or properties to the `prototype` of that constructor function. Class also does the same thing in a very concise way. In class you do not have to push the methods to the prototype of that constructor function. It can be written in the same class you have. In the following examples i have shown the evolution of making objects.

```javascript
// #1

let person = {};
person.name = "sakib";
person.age = 89;
person.eat = function(){
    console.log(`${person.name} is eating`);        
}
person.sleep = function(){
    console.log(`${person.name} is sleeping`);
    
}
console.log(person.eat());
// It is hard to make everytime to create a new object with the same properties this way.

```
```javascript
// #2

    function Person(name,age){
        let person = {};
        person.name = name;
        person.age = age;
    
        person.eat = function(){
            console.log(`${person.name} is eating`);        
        }
    
        person.sleep = function(){
            console.log(`${person.name} is sleeping`);
            
        }
    
        return person;
    }
    
    let sakib = Person("sakib",89);
    let tamim = Person("tamim",78);
    console.log(sakib.eat());

```
```javascript
// #3

    let personMethods = {
        eat(){
            console.log(`${person.name} is eating`);        
        },
        sleep(){
            console.log(`${person.name} is sleeping`);  
        }
    };
    function Person(name,age){
        let person = {};
        person.name = name;
        person.age = age;
    
        person.eat = personMethods.eat();
        person.sleep = personMethods.sleep();
    
        return person;
    }
    
    let sakib = Person("sakib",89);
    let tamim = Person("tamim",78);
    console.log(sakib.eat());
    

```
```javascript
// #4

    let personMethods = {
        eat(){
            console.log(`${person.name} is eating`);        
        },
        sleep(){
            console.log(`${person.name} is sleeping`);  
        }
    };
    function Person(name,age){
        let person = Object.create(personMethods);
        person.name = name;
        person.age = age;
    
        return person;
    }
    
    let sakib = Person("sakib",89);
    let tamim = Person("tamim",78);
    console.log(sakib.eat());

```
```javascript
// #5

    Person.prototype = {
        eat(){
            console.log(`${person.name} is eating`);        
        },
        sleep(){
            console.log(`${person.name} is sleeping`);  
        }
    };
    function Person(name,age){
        let person = Object.create(Person.prototype);
        person.name = name;
        person.age = age;
    
        return person;
    }
    
    let sakib = Person("sakib",89);
    let tamim = Person("tamim",78);
    console.log(sakib.eat());

```
```javascript
// #6

    function Person(name,age){
        this.name = name;
        this.age = age;
    }
    
    Person.prototype = {
        eat(){
            return `${this.name} is playing`;        
        },
        sleep(){
            return `${this.name} is sleeping`;  
        }
    }; 
    
    const sakib = new Person("sakib", 56);
    const tamim = new Person("tamim", 89);
    console.log(sakib.eat());

```
```javascript
// #7

    class Person {
        constructor(name, age) {
            this.name = name;
            this.age = age;
        }
        eat() {
            return `${this.name} is playing`;
        }
        sleep() {
            return `${this.name} is sleeping`;
        }
    }
    
    
    const sakib = new Person("sakib", 56);
    const tamim = new Person("tamim", 89);
    console.log(sakib.eat());

```