자료구조

📌 자료구조를 왜 알아야 하는가?

자주 사용하는 배열, 객체 외에 다양한 자료구조가 존재한다.
(ex. 리스트, 스택, 큐, 그래프, 트리)

다루어야 할 데이터가 점점 복잡해질수록 배열과 같은 단순한 자료구조가 아닌 고급 자료구조가 필요해질 수 있다.

📌 절대적으로 좋은 자료구조는 없다.

각각의 자료구조는 각자만의 특화된 재능을 갖고 있다.

예시

지도/위치를 다룰 때 -> 그래프
Nested HTML을 걷어내는 작업을 할 때 -> 트리

Nested : 구조 내부에 또 다른 구조가 포함되는

---

📌 class란 무엇인가?

사전에 정의된 속성 및 메소드들을 이용해 객체(인스턴스)를 생성하기 위한 청사진이다.

📌 class를 왜 알아야 하는가?

자료구조들을 클래스로 구현하기 때문이다.

참고

자바스크립트는 실제로는 클래스들을 지원하지 않는다.
MDN 문서를 보면, ES2015에서 소개되는 자바스크립트 클래스들은 주로 자바스크립트에 이미 존재하는 프로토타입 기반 상속자들을 구문적으로 눈속임한 것이라고 나와있다.

ES2015 class syntax

• 관습적으로 클래스 명칭은 대문자로 시작하도록 한다. (CamelCase를 따름.)
• 클래스를 선언하고, new 키워드를 사용해 해당 클래스의 인스턴스를 생성할 수 있다.
• constructor 내부에서 사용되는 경우, this는 개별 클래스로부터 생성된 객체, 즉 인스턴스를 지칭한다.

예시

class Student {
    constructor(firstName, lastName, year){
        this.firstName = firstName;
        this.lastName = lastName;
        this.grade = year;
    }
}

let firstStudent = new Student("Colt", "Steele",1); // 여기서 this는 "firstStudent" 를 지칭
let secondStudent = new Student("Blue", "Steele",2); // 여기서 this는 "secondStudent" 를 지칭

Instance 메소드 추가하기

메소드 추가하고 사용해보기
(push, shift, reverse, remove 등 자유롭게 인스턴스를 추가할 수 있다!)

class Student {
    constructor(firstName, lastName, year){
        this.firstName = firstName;
        this.lastName = lastName;
        this.grade = year;
        this.tardies = 0;
        this.scores = [];
    }
    // 메소드 추가
    fullName(){
        return `Your full name is ${this.firstName} ${this.lastName}`;
    }
    markLate(){
        this.tardies += 1;
        if(this.tardies >= 3) {
            return "YOU ARE EXPELLED!!!!"
        }
        return `${this.firstName} ${this.lastName} has been late ${this.tardies} times`;
    }
    addScore(score){
        this.scores.push(score);
        return this.scores
    }
    calculateAverage(){
        let sum = this.scores.reduce(function(a,b){return a+b;})
        return sum/this.scores.length;
    }  
}

let firstStudent = new Student("Colt", "Steele",1);
let secondStudent = new Student("Blue", "Steele",2);

firstStudent.fullName() // `Your full name is Colt Steele`
secondStudent.addScore(80) // [80]

Class 메소드 추가하기

메소드 정의 앞부분에 static 키워드 사용.
: 클래스에 종속되는 반면, 클래스의 개별 인스턴스 메소드에는 반드시 종속적일 필요가 없는 메소드 혹은 기능들을 생성하게 해준다. (거의 안 사용한다.)

class Student {
    constructor(firstName, lastName, year){
        this.firstName = firstName;
        this.lastName = lastName;
        this.grade = year;
        this.tardies = 0;
        this.scores = [];
    }
    fullName(){
        return `Your full name is ${this.firstName} ${this.lastName}`;
    }
    markLate(){
        this.tardies += 1;
        if(this.tardies >= 3) {
            return "YOU ARE EXPELLED!!!!"
        }
        return `${this.firstName} ${this.lastName} has been late ${this.tardies} times`;
    }
    addScore(score){
        this.scores.push(score);
        return this.scores
    }
    calculateAverage(){
        let sum = this.scores.reduce(function(a,b){return a+b;})
        return sum/this.scores.length;
    }
   // class 메소드
    static EnrollStudents(){
        return "ENROLLING STUDENTS!"
    }
    
}

let firstStudent = new Student("Colt", "Steele",1);
let secondStudent = new Student("Blue", "Steele",2);

개별 인스턴스에는 사용할 수 없고, 클래스에 사용한다.

firstStudent.EnrollStudents()   (x)
Student.EnrollStudents()        (o)

다른 예시

class Point {
  constructor(x, y) {
    this.x = x;
    this.y = y;
  }

  static distance(a, b) {
    const dx = a.x - b.x;
    const dy = a.y - b.y;

    return Math.hypot(dx, dy);
  }
}

const p1 = new Point(5, 5);
const p2 = new Point(10, 10);

console.log(Point.distance(p1, p2)); // 7.0710678118654755

⭐️ class를 이용해 자료구조를 어떻게 만들것인가?

class DataStucture(){
	constructor(){
      // 초기 속성들의 디폴트 값 정릐
    }
  	someInstanceMethod(){
     // 클래스로 만들어진 객체가 무엇을 할 지 
    }
}