TIL - 6주차

TIL 40일차

자료구조 구현과 상속,

Today’s Key 🔑

페어프로그래밍으로 연결리스트와 해시테이블을 구현했다. (페어님의 실력이 정말 상상이상으로 높다.)
객체지향 프로그래밍의 상속 개념에 대해서 공부했다. (super는 super다.)
자료구조에 대한 스프린트가 너무 머리를 아프게 해서 중간중간 다른 영역도 들춰봤다.

배열의 find 메소드

배열의 함수형 메소드 중 하나
배열에서 원하는 조건에 해당하는 요소를 순회하며 찾고, 값이 찾아지면 순회 종료. 해당하는 요소를 뱉고 메소드를 종료시킨다.
메소드 내부의 함수는 true, false 두 불린의 형태로 리턴해주면 된다. 아래의 코드를 확인해보자.

const arr = [1, 2, 3, 4, 5];

const ouput = arr.find((el) => {
  if (el === 3) return true;
  else false;
});

output; // -> 3

prototype을 사용한 Pseudoclassical 한 방식으로 상속 연결해주기

조건

Humans 객체는 부모 객체이고, 이름 속성이 있다. 자식들은 해당 속성을 받아야 한다.
Humans 객체는 sleep()이라는 메소드가 있고, 자식들은 해당 메소드를 반드시 가져야 한다.
Student 객체는 Humans의 자식 객체이고, Humans가 가지는 속성, 메소드를 가져야 한다.
Student 객체는 Humans와는 다르게 study() 메소드를 단독으로 가져야 한다.

// Humans 생성
const Humans = function (name) {
  this.name = name;
};

Humans.prototype.sleep = function () {
  console.log("zzz");
};

// 상속받는 Student 객체 생성
const Student = function (name) {
  Humans.apply(this, name);
  this.age = 25;
};

부모 객체인 Humans처럼 name 속성을 가지기 위해서 .call(this) .apply(this) 형태로 this를 묶어준다. 만약에 constructor에 아무런 인자가 없다면 인자는 생략 가능하다. 자식 객체만 가지는 특정 요소도 추가해줄 수 있다.

// Object.create() 함수를 사용하여 부모의 prototype을 복제한다.
Student.prototype = Object.create(Humans.prototype);

// Student가 생성하는 인스턴스의 constructor를 Student로 정의해준다.
Student.prototype.constructor = Student;

// 자식만 단독으로 가지는 메소드도 구성할 수 있다.
Student.prototype.learn = function () {};

ES6의 class, extends, super 키워드로 상속 이해하기

// 부모 클래스인 Humans
class Humans {
  constructor(name) {
    this.name = name;
  }
  sleep() {}
}

extends 키워드로 상속 조건을 만들어줄 수 있다. call 또는 apply로 부모의 요소를 묶어주는 것 대신, super 키워드를 사용하면 된다.

class Student extends Human {

	constructor(name) {
		super(name);
    this.age = 25;
	} // 부모요소와 constructor로 받는 부분이 동일하면 생략 가능하다.

	sleep() {
		super.sleep ~ // 찾아보기
	}
	learn() {}
}