특정 유형의 객체를 생성하기 위한 템플릿입니다.
클래스는 객체를 사용한 프로그래밍을 보다 쉽게 만듭니다. 예를 들어, Frog 클래스는 개구리처럼 행동하는 객체를 생성할 수 있습니다. 클래스를 사용하여 생성된 각 객체를 그 클래스의 인스턴스라고 합니다. 클래스의 모든 인스턴스는 동일한 유형입니다. Frog 클래스의 인스턴스를 생성하는 예는 다음과 같습니다 : let fifi = new Frog(50, 50, 20);
fifi는 Frog 클래스의 인스턴스를 참조합니다. 키워드 new는 new Frog() 문에서 Frog 클래스의 생성자를 호출하는 데 사용됩니다. 전체적으로 새로운 Frog 객체가 생성되어 변수 fifi에 할당되었습니다. 클래스는 템플릿이므로 하나 이상의 인스턴스를 생성하는 데 사용할 수 있습니다:
// First Frog instance. let frog1 = new Frog(25, 50, 10); <p>// Second Frog instance. let frog2 = new Frog(75, 50, 10); </p>간단한 Frog 클래스는 다음과 같이 선언할 수 있습니다:
class Frog { constructor(x, y, size) { // This code runs once when an instance is created. this.x = x; this.y = y; this.size = size; } <p> show() { // This code runs once when myFrog.show() is called. textAlign(CENTER, CENTER); textSize(this.size); text('🐸', this.x, this.y); }</p> <p> hop() { // This code runs once when myFrog.hop() is called. this.x += random(-10, 10); this.y += random(-10, 10); } } </p>클래스 선언은 class 키워드로 시작하며, 그 다음에 Frog 같은 클래스 이름과 중괄호 {}가 따릅니다. 클래스 이름은 PascalCase를 사용해야 하며 이름에 공백이 있으면 안 됩니다. 예를 들어, 클래스 이름을 각 단어 사이에 공백이 있는 Kermit The Frog로 지정하면 SyntaxError가 발생합니다. 중괄호 {} 사이의 코드는 클래스를 정의합니다. 클래스에 속한 함수를 메소드라고 합니다. constructor(),show(), 그리고 hop()는 매개변수를 받을 수 있고 값도 반환할 수 있습니다. 함수와 같지만 function 키워드를 사용하지 않습니다.
constructor()는 클래스의 인스턴스가 생성될 때 한 번 호출되는 특별한 메소드입니다. new Frog() 문은 Frog 클래스의 constructor() 메소드를 호출합니다.
클래스 정의는 인스턴스의 템플릿입니다. 키워드 this는 인스턴스의 데이터와 메소드를 참조합니다. 예를 들어, 각 Frog인스턴스는 this.x와 this.y에 고유한 좌표를 저장합니다. show() 메소드는 그 좌표를 사용하여 개구리를 그립니다. hop() 메소드는 호출될 때 그 좌표를 업데이트합니다. Frog 인스턴스가 생성되면, 점 연산자 .를 사용하여 다음과 같이 데이터와 메소드를 업데이트 할 수 있습니다:
// Draw a lily pad. fill('green'); stroke('green'); circle(fifi.x, fifi.y, 2 * fifi.size); <p>// Show the Frog. fifi.show();</p> <p>// Hop. fifi.hop(); </p>