JS: Classes and Instances in simple term

Minwoo Gwak·2023년 3월 15일
0
post-thumbnail

Warning: this is a personal blog to organize the concept in Javascript. But the concept below could describe a concept in a wrong way.( might be edited later for correction)

Object-oriented programming (OOP) is an important concept to understand for better coding, not only in JavaScript but also in other programming languages. OOP is a programming paradigm that uses objects to design applications. It creates a base model and creates objects based on the base model. We call the base model a class, and the created objects based on the class are called instances.

In JavaScript, the term "class" did not exist until ECMAScript 6 (ES6) was released. However, we could still use the class concept by using functions. Classes are almost always necessary when we do object-oriented programming in JavaScript.

We use the "new" keyword to create instances. An instance is a copy of a class that contains all the properties and methods defined in the class. In JavaScript, there are two ways to create classes since the new way of creating classes was introduced after ES6.

Creating Classes in JavaScript

Creating a Class with ES5

ES5 is the fifth version of ECMAScript, the standard for JavaScript. The following code is an example of how to create a class in ES5:

function Person(name, age, height, weight) {
	this.name = name;
    this.age = age;
    this.height = height;
    this.weight = weight;
}

Person.prototype.getAge = function() {
	return this.age;
}

In the above example, we created a constructor function called Person that takes four parameters: name, age, height, and weight. We then added properties to the Person object using this, which refers to the object being created. Finally, we added a method to the Person object using the prototype keyword.

Creating a Class with ES6

ES6, also known as ECMAScript 2015, introduced a new syntax for creating classes in JavaScript. The following code is an example of how to create a class in ES6:

class Person {
	constructor(name, age, height, weight) {
    	this.name = name;
    	this.age = age;
    	this.height = height;
    	this.weight = weight;
    }
    
   	getAge() {
   		return this.age;
   	}
}

In the above example, we created a class called Person using the class keyword. We then created a constructor function using the constructor keyword that takes four parameters: name, age, height, and weight. We then added properties to the Person object using this, which refers to the object being created. Finally, we added a method to the Person object using the new syntax for creating methods in classes.

Creating Instances of a Class

After we create the classes, we can finally use the new keyword to create instances of the class. An instance is a copy of a class that contains all the properties and methods defined in the class.

let jacob = new Person('Jacob', 25, 182, 74);
let micheal = new Person('Micheal', 30, 175, 66);

In the above example, we created two instances of the Person class using the new keyword. We passed in the four parameters for each instance, and the instances were created with all the properties and methods defined in the Person class.

jacob.name       // 'Jacob'
jacob.getAge()   // returns 25

The above example shows how to access the properties and methods of an instance. We used dot notation to access the name property of the `

profile
CS and Math student at the University of Illinois with a passion for web development and aspiring to become a frontend developer.

0개의 댓글