본문 바로가기
Dev/React

[JS] 객체와 클래스

by Ellen571 2024. 7. 5.
반응형

여러 개의 값을 그룹으로 묶어 객체를 생성할 수 있다.

const user = {
	name: "Max",
	age: 34,
	greet() {
        console.log("Hello");
        console.log(this.name);
	}
};

console.log(user);
console.log(user.name);
user.greet();
  • name과 age 프로퍼티에 값을 넣는다.
  • 을 통해 객체의 값에 접근한다.
  • function 키워드 없이 함수를 넣을 수 있다.
  • 객체 내 함수를 메소드라도 부른다.
  • 메소드에 매개변수를 받거나, return으로 반환하거나, console.log를 작성할 수 있다.
  • 메소드는 this 키워드로 객체의 프로퍼티에 접근할 수 있다.

 

class로 실제 객체를 생성 시 사용할 청사진을 만들 수 있다.

class User {
	constructor(name, age) {
		this.name = name;
		this.age = age;
	}
	greet() {
		console.log('Hi');
	}
}

const user1 = new User('Max', 34);
console.log(user1);
user1.greet();
  • 클래스 이름은 대문자로 시작해야 한다.
  • 클래스 안에 메소드를 추가하면 된다.
  • constructor 키워드를 사용해 생성자 함수를 추가할 수 있다.
  • 이 생성자를 사용해 매개변수 입력 값을 받을 수 있다.
  • this 키워드를 사용해 이 클래스를 통해 생성될 객체의 프로퍼티에 값을 저장할 수 있다.
  • 클래스 청사진을 인스턴스화(수행 객체화)하기 위해 new 키워드를 사용한다.
  • new는 새 객체를 생성한다.
  • 을 통해 메소드에 접근할 수 있다.
반응형