[TIL] JS: 드림코딩 강의노트 03

Class (ES6)

관련있는 변수나 함수를 묶어 놓은 것.

• constructor
  Object를 만들 때 필요한 데이터를 전달한다.

class Person {
  constructor(name, age){
    // this = {};
    this.name = name;
    this.age = age;
    // return this;
  }
}
speak(){
  console.log(`${this.name}: hello!`};
              }
}

const naeun = new Person('naeun', 20);
console.log(naeun.name); // naeun
console.log(naeun.age); // 20
naeun.speak(); // naeun: hello!

Getter / Setter

사람의 나이가 -1로 나오는 등의 오류를 방지하기 위해 사용한다.

get age() {
  return this._age;
}

set age() {
  this._age = value < 0 ? 0 : value;

상속 & 다양성

• extends 키워드를 사용하여 클래스를 확장할 수 있다.
• overriding 클래스 확장 후 개별적으로 반환값을 지정할 수 있다.

class Shape{
  constructor(width, height, color){
    this.width = width;
    this.height = height;
    this.color = color;
  }
  
  draw(){
    console.log(`drawing ${this.color} color !`);
  }
  
  getArea(){
    return width * this.height;
  }
  
class Rectangle extends Shape {}
// Overiding
class Triangle extends Shape {
	getArea(){
      return (this.width = this.height) / 2;
    }
}

const rectangle = new Rectangle(20, 20, 'blue');
rectangle.draw(); // drawing blue color !
console.log(rectangle.getArea()); // 400

const Triangle = new Triangle(20, 20, 'red');
Triangle.draw(); // drawing blue color !
console.log(Triangle.getArea()); // 200

Object

Object = { key : value }

• 괄호 이용하기 Object literal const obj1 = {}
• class 이용하기. Object constructor const obj2 = new Object()

.value vs ['value']

• 코딩할 때, key 값을 알고 있을 때 .value
• Runtime에 의해 결정될 때, 실시간으로 원하는 key를 받아올 때['value']

for..in vs for..of

• for (key in obj) 가지고 있는 key들이 지역함수로 할당된다.

for (key in naeun) {
  console.log(key);
}

• for (value of iterable) array에 순차적으로 담긴 value가 출력된다.

for (value of array){
  console.log(value);
}

Object.assign

object를 clon하는 방법