[개념] 클래스와 객체, 메소드, 객체 리터럴

객체(object)

// 노트북1을 것을 표현하기 위한 데이터들
// 변수명을 명시적으로 하는 것 이외에는 이 데이터들의 관계를 표현해줄 수 있는 방법이 없음
const notebook1Name = 'Macbook'
const notebook1Price = 2000000
const notebook1Company = 'Apple'

// 이름, 가격, 제조사와 같은 정보를 다 담을 수 있는 좀 더 큰 범위의 데이터 타입이 있으면 좋지 않을까?

클래스

객체를 나타내는대는 클래스를 활용한다.

class Notebook {
// class키워드와 클래스명
// 클래스명도 변수명처럼 알아보기 쉬운 이름을 사용한다.
	constructor(name, price, company) {
    // constructor=생성자
    // 중괄호안에 생성자들이 들어간다. 함수와 비슷
    // 객체가 생성될때 호출되는 함수
		this.name = name
		this.price = price
		this.company = company
        // this와 속성(property)
        // this는 클래스를 사용해 만들어질 객체 자기 자신
	}
}

객체 만들기

const 변수명 = new 클래스명(생성자에서 정의한 매개변수들...)

const notebook1 = new Notebook('MacBook', 2000000, 'Apple')

 

method(메소드)

// 클래스 선언
class Product {
	constructor(name, price) {
		this.name = name
		this.price = price
	}

// 메소드 생성
	printInfo() {
		console.log(`상품명: ${this.name}, 가격: ${this.price}원`)
	}
}

// 객체 생성 및 메소드 호출
const notebook = new Product('Apple Macbook', 2000000)
notebook.printInfo() // 상품명: Apple Macbook, 가격: 2000000원

 

객체 리터럴(object literal)

객체 리터럴을 활용하여 클래스와 같은 템플릿없이 빠르게 객체 생성 가능

const 변수명 = {
속성명: 데이터,
메소드명: function () { 메소드 호출시 실행할 코드들 }
}

const computer = {
	name: 'Apple Macbook',
	price: 20000,
	printInfo: function () {
		console.log(`상품명: ${this.name}, 가격: ${this.price}원`)
	}
}

computer.printInfo()

굳이 클래스를 정의해서 만드는이유는?

>> 재사용성