자료구조 소개

목차

최고의 자료 구조는 무엇일까요?
ES2015 클래스 구문 개요
자료 구조 : 클래스 키워드
자료 구조 : instance 메소드 추가하기
자료 구조 : class 메소드 추가하기

---

최고의 자료 구조는 무엇일까요?

슬라이드 : https://cs.slides.com/colt_steele/es2015-class-syntax

 

ES2015 클래스 구문 개요

MDN Classes : https://developer.mozilla.org/ko/docs/Web/JavaScript/Reference/Classes

 

목표
1. class란?
2. 어떻게 JS가 classes라는 개념을 적용하는가?
3. 추상화(abstraction), 캡슐화(encapsulation), 다형성(polymorphism) 용어 정의
4. 자료구조를 구성하기위해 ES2015 classes 사용

 

class 란?
미리 정의된 속성 및 메서드를 사용하여 개체를 생성하기 위한 청사진이다.

왜 배워야 하나요?
클래스로 자료구조를 클래스로 구현하기 때문이다.

 

자료 구조 : 클래스 키워드

class 구문

• 새 개체를 만드는 메서드는 생성자(constructor)라고 해야 한다.
• class 키워드는 상수(constanst)를 생성하므로, class 키워드를 재정의할 수 없다.
• 클래스로 객체를 만들 때, new 키워드를 사용한다.

this

• 모든 인스턴스 메서드 및 생성자에서, 키워드 'this'는 해당 클래스에서 생성된 개체(인스턴스라고도 함)를 나타낸다.

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

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

 

자료 구조 : instance 메소드 추가하기

인스턴스 메소드 - 특정 인스턴스에 내장된 것이 아니다. 클래스에 적용되는 기능제공한다.

class Student {
    constructor(firstName, lastName, year){
        this.firstName = firstName;
        this.lastName = lastName;
        this.grade = year;
        this.tardies = 0;
        this.scores = [];
    }
    fullName(){			// instance 메소드 1
        return `Your full name is ${this.firstName} ${this.lastName}`;
    }
    markLate(){			// instance 메소드 2
        this.tardies += 1;
        if(this.tardies >= 3) {
            return "YOU ARE EXPELLED!!!!"
        }
        return `${this.firstName} ${this.lastName} has been late ${this.tardies} times`;
    }
    addScore(score){		// instance 메소드 3
        this.scores.push(score);
        return this.scores
    }
    calculateAverage(){		// instance 메소드 4
        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);

 

자료 구조 : class 메소드 추가하기

// student_class.js
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;
    }
    static EnrollStudents(){		//static 메소드
        return "ENROLLING STUDENTS!"
    }
    
}

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

//point_class.js
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

 

회고
1. 클래스는 인스턴스로 알려진 객체를 생성하기 위한 청사진이다.
2. 클래스는 new 키워드로 생성된다.
3. 생성자 함수는 클래스를 인스턴스화할 때 실행되는 특별한 함수다.
  'new'를 통해 'Student'클래스를 인스턴스화 시키게 되면
  'Student'의 생성자 함수가 먼저 동작하게 된다.
4. 인스턴스 메서드는 객체의 메서드와 유사한 클래스에 추가할 수 있다.
5. static 키워드를 사용하여 클래스 메서드를 추가할 수 있다.