클래스와 인스턴스

클래스

개념

• 객체를 만들어 내기 위한 설계도 혹은 틀
• 연관되어 있는 변수와 메서드의 집합

특징

• 보통 필드(field), 생성자(Constructor), 메소드(Method)로 구성된다.

  필드: 객체의 데이터가 저장되는 곳
  생성자: 객체가 실제로 생성될 때 초기화 역할을 담당한다.
  메소드: 객체의 동작에 해당하는 실행 블록이다.

객체

개념

• 클래스에 선언된 모양 그대로 생성된 실체
• 물리적으로 존재하거나 추상적으로 생각할 수 있는 것 중에서 자신의 속성을 가지고 있고 다른 것과 식별 가능한 것을 말한다.

특징

• 클래스의 인스턴스라고도 불린다
• 객체는 모든 인스턴스를 대표하는 포괄적인 의미를 갖는다

인스턴스

개념

• 설계도를 바탕으로 소프트웨어 세계에 구현된 구체적인 실체
• 클래스가 붕어빵 틀이라면 그 틀을 통해 생성된 객체(붕어빵) 하나하나를 해당 클래스의 인스턴스라고 부른다.

특징

• 생성된 인스턴스들은 각자 고유의 특성을 가지고 독립적으로 존재한다.
• oop의 관점에서 객체가 메모리에 할당되어 실제 사용될 때 '인스턴스'라고 부른다.

클래스, 객체, 인스턴스의 차이

클래스 vs 객체

• 클래스는 설계도, 객체는 설계도로 구현한 모든 대상을 의미한다.

객체 vs 인스턴스

• 클래스의 타입으로 선언되었을 때 객체라고 부르고, 그 객체가 메모리에 할당되어 실제 사용될 때 인스턴스라고 부른다.
• 객체는 실체, 인스턴스는 관계에 초점을 둔다.

new키워드

개념

• new 키워드는 객체를 생성하는 방법 중, 생성자 함수(Constructor)를 사용하여 객체를 만들 때 함께 쓰는 키워드이다.

생성자 함수

개념

• JavaScript에서 객체를 생성하기 위해 사용되는 특수한 함수이다.

생성자 함수 만들기

// 생성자 함수
function UserInfo(){
	this.name="Kim";
    this.age="22";
    this.address="seoul";
}
// 객체 생성
let userInfo = UserInfo();

console.log(userInfo);

new연산자와 생성자 함수를 사용하면 유사한 객체 여러 개를 쉽게 만들 수 있다.

ES5 클래서 작성 문법

정의

function Car(brand, name, color){
	// 인스턴스가 만들어질 때 실행되는 코드
}

속성의 정의

function Car(brand, name, color){
	this.brand=brand;
    this.name=name;
    this.color=color;
}

메소드의 정의

function Car(brand, name, color){
Car.prototype.refuel=function(){
	//연료 공급을 구현하는 코드
}
Car.prototype.drive=function(){
	//운전을 구현하는 코드
}
}

ES6 클래스 작성 문법

정의

class Car{
	constructor(brand, name, color){
    	// 인스턴스가 만들어질 때 실행되는 코드
    }
}

속성의 정의

class Car{
	constructor(brand, name, color){
    	this.brand=brand;
    	this.name=name;
    	this.color=color;
    }
}

메소드의 정의

class Car{
	constructor(brand, name, color){
    }
    refuel(){
    }
    drive(){
    }
}

참고 사이트
https://gmlwjd9405.github.io/2018/09/17/class-object-instance.html
https://codybuilder.com/17
https://colinch4.github.io/2021-01-14/new/