カテゴリ
3705 ワード
basic
// 객체를 손쉽게 만들수 있는 템플릿
// 1. 생성자 함수 (오래된 고전적인 방법)
// 2. 클래스 ✨
// 클래스 class
class Fruit {
// 생성자: new 키워드로 객체를 생성할때 호출되는 함수
constructor(name, emoji) {
this.name = name;
this.emoji = emoji;
}
display = () => {
console.log(`${this.name}: ${this.emoji}`);
};
}
// apple은 Fruit 클래스의 인스턴스이다.
const apple = new Fruit('apple', '🍎');
// orange은 Fruit 클래스의 인스턴스이다.
const orange = new Fruit('orange', '🍊');
console.log(apple);
console.log(orange);
console.log(apple.name);
console.log(apple.emoji);
apple.display();
// obj는 객체이고, 그 어떤 클래스의 인스턴스도 아니다.
const obj = { name: 'ellie' };
static코드를 입력하세요// static 정적 프로퍼티, 메서드
class Fruit {
static MAX_FRUITS = 4;
// 생성자: new 키워드로 객체를 생성할때 호출되는 함수
constructor(name, emoji) {
this.name = name;
this.emoji = emoji;
}
// 클래스 레벨의 메서드
static makeRandomFruit() {
// 클래스 레벨의 메서드에서는 this를 참조할 수 없음
return new Fruit('banana', '🍌');
}
// 인스턴스 레벨의 메서드
display = () => {
console.log(`${this.name}: ${this.emoji}`);
};
}
const banana = Fruit.makeRandomFruit();
console.log(banana);
console.log(Fruit.MAX_FRUITS);
// apple은 Fruit 클래스의 인스턴스이다.
const apple = new Fruit('apple', '🍎');
// orange은 Fruit 클래스의 인스턴스이다.
const orange = new Fruit('orange', '🍊');
console.log(apple);
console.log(orange);
console.log(apple.name);
console.log(apple.emoji);
apple.display();
Math.pow();
Number.isFinite(1);
field// 접근제어자 - 캡슐화
// private(#), public(기본), protected
class Fruit {
#name;
#emoji;
#type = '과일';
constructor(name, emoji) {
this.#name = name;
this.#emoji = emoji;
}
#display = () => {
console.log(`${this.#name}: ${this.#emoji}`);
};
}
const apple = new Fruit('apple', '🍎');
//apple.#name = '오렌지'; // #field는 외부에서 접근이 불가능함
console.log(apple);
getter코드를 // 접근자 프로퍼티 (Accessor Property)
class Student {
constructor(firstName, lastName) {
this.firstName = firstName;
this.lastName = lastName;
}
get fullName() {
return `${this.lastName} ${this.firstName}`;
}
set fullName(value) {
console.log('set', value);
}
}
const student = new Student('수지', '김');
student.firstName = '안나';
console.log(student.firstName);
console.log(student.fullName);
student.fullName = '김철수';
extends// class Tiger {
// constructor(color) {
// this.color = color;
// }
// eat() {
// console.log('먹자!');
// }
// sleep() {
// console.log('잔다');
// }
// }
// class Dog {
// constructor(color) {
// this.color = color;
// }
// eat() {
// console.log('먹자!');
// }
// sleep() {
// console.log('잔다');
// }
// play() {
// console.log('놀자아~!');
// }
// }
class Animal {
constructor(color) {
this.color = color;
}
eat() {
console.log('먹자!');
}
sleep() {
console.log('잔다');
}
}
class Tiger extends Animal {}
const tiger = new Tiger('노랑이');
console.log(tiger);
tiger.sleep();
tiger.eat();
class Dog extends Animal {
constructor(color, ownerName) {
super(color);
this.ownerName = ownerName;
}
play() {
console.log('놀자아~!');
}
// 오버라이딩 overriding
eat() {
super.eat();
console.log('강아지가 먹는다!');
}
}
const dog = new Dog('빨강이', '엘리');
console.log(dog);
dog.sleep();
dog.eat();
dog.play();
Reference
この問題について(カテゴリ), 我々は、より多くの情報をここで見つけました https://velog.io/@whdghks/클래스テキストは自由に共有またはコピーできます。ただし、このドキュメントのURLは参考URLとして残しておいてください。
Collection and Share based on the CC Protocol