DEV Community

Heru Hartanto
Heru Hartanto

Posted on

2

Understanding classes in javascript

ES6 introduced classes, it's often used by front-end libraries such as react, in simple term classes are special kind of functions.

function Car(type,brand){
    this.type= type;
    this.brand = brand;
}
Car.prototype.getDescription = function(){
    console.log(`This car is ${this.type} from brand ${this.brand}`)
}

let newCar = new Car('Jazz','Honda')
newCar.getDescription()

Enter fullscreen mode Exit fullscreen mode

Before classes introduce in ES6, the best way to create an object template was using functions, but now we can create an object template using classes.

As above example can be rewritten with class in following way

class Car{
    constructor(type,brand){
        this.type= type;
        this.brand = brand;
    }
    getDescription=()=>{
        console.log(`This car is ${this.type} from brand ${this.brand}`)
    }
}
let newCar = new Car('Jazz','Honda')
newCar.getDescription()
Enter fullscreen mode Exit fullscreen mode

Now we have more better approach for creating object template in the form of classes.

The difference between functions and classes in simple are:

  • classes are blueprint for javascript object
  • function are the way to package reusable code

Therefore, when we need to make reusabled block of code that used multiple time, we can package those block inside function, However
when we need to create an object that needs to generated mulitple times then use classes

Image of Datadog

The Future of AI, LLMs, and Observability on Google Cloud

Datadog sat down with Google’s Director of AI to discuss the current and future states of AI, ML, and LLMs on Google Cloud. Discover 7 key insights for technical leaders, covering everything from upskilling teams to observability best practices

Learn More

Top comments (2)

Collapse
 
jonrandy profile image
Jon Randy πŸŽ–οΈ β€’ β€’ Edited

JS doesn't actually have classes. It uses prototypal inheritance. The new Class syntax is just sugar to make it more understandable to people coming from languages that use class based inheritance. Underneath it is just the same old prototype based system

Collapse
 
andrewbaisden profile image
Andrew Baisden β€’

The sweetest of sugars πŸ˜‚

Billboard image

The Next Generation Developer Platform

Coherence is the first Platform-as-a-Service you can control. Unlike "black-box" platforms that are opinionated about the infra you can deploy, Coherence is powered by CNC, the open-source IaC framework, which offers limitless customization.

Learn more

πŸ‘‹ Kindness is contagious

Dive into an ocean of knowledge with this thought-provoking post, revered deeply within the supportive DEV Community. Developers of all levels are welcome to join and enhance our collective intelligence.

Saying a simple "thank you" can brighten someone's day. Share your gratitude in the comments below!

On DEV, sharing ideas eases our path and fortifies our community connections. Found this helpful? Sending a quick thanks to the author can be profoundly valued.

Okay