본문 바로가기
📍 Front-End/🜸 TypeScript

[타입스크립트/TypeScript] 타입스크립트의 OOP (객체지향 프로그래밍)

by 예리Yelee 2021. 7. 15.
반응형

📍 객체지향이란?

객체(Object)는 변수와 메서드를 그룹핑한 것이다.

객제지향 프로그래밍 서로 관련 있는 데이터와 함수를 객체로 정의해서 서로 상호작용할 수 있도록 프로그래밍하는 것이다.
절자치향 프로그래밍의 경우 데이터를 받아오고 처리하는 방법으로 프로그래밍되었다면
객제지향의 경우 프로그램을 '객체' 단위로 나누어 정의하고 각 객체들 간의 상호작용을 통해 프로그래밍을 해나간다. 
레고 부품(=객체)을 조립하여 레고 완성품(=프로그램)을 만드는 것이라 생각하면 되겠다!

 

👍🏻  객체 지향의 장점

객체지향 프로그래밍은 코드 재사용을 통해 생산성을 높이고, 유지보수에 용이하다는 장점이 있다.

레고로 예를 들자면 똑같은 바퀴가 4개인 자동차를 만든다고 가정할 때,
차 본체에 맞는 타이어 하나를 고르면 나머지 3개는 앞서 고른 타이어 하나와 똑같은 타이어로 골라 조립하면 된다
(재사용과는 약간 다른 예인 것 같지만.. 대충 생산성을 높일 수 있다는 뜻 🤓)

또, 완성된 자동차에서 라이트 부분이 고장 나는 경우 그 부분만 다시 교체하면 된다.(=유지보수에 용이)
이 부분은 객체지향의 요소를 살펴보면서 좀 더 이해를 해보자.

 

👎🏻  객체 지향의 단점

객체지향 프로그래밍의 단점은 개발자 입장에서 코딩의 난이도가 상승하고 -> 개발 속도가 느려진다는 단점이 있다.
객체지향 프로그래밍을 하기 위해선 높은 이해도가 필요하고 설계 단계에서부터 시간이 많이 소요되기 때문이다.
그리고 실행 속도 또한 느리다고 하는데, 이 부분에 대해선 서치가 필요.. 

 


💡 타입스크립트로 알아보는 OOP(객체지향 프로그래밍)의 요소

캡슐화

서로 연관된 데이터와 함수를 캡슐화 즉, 하나의 객체로 묶어 두는 것을 뜻한다.
예를 들어 사람이라는 객체가 있으면 이 객체는 이름, 나이라는 데이터를 가질 수 있고 먹다, 일하다는 함수를 가질 수 있다.

{
    class Person{
        name: string;
        age:  number;

        constructor(name:string, age: number){
            this.name = name;
            this.age = age;
        }

        eat(): string{
            return `이름은 ${this.name}. 나이는 ${this.age}. 지금 밥을 먹고있다`
        }
        
        work(): string{
            return `이름은 ${this.name}. 나이는 ${this.age}. 지금 일을 하고있다`
        }
    }

    const person = new Person('yelee', 20);

    console.log(person); // Person { name: 'yelee', age: 20 }
}

 

추상화

접근제어자를 통해 외부에서 객체 내부의 특정 기능을 보이지 않게 함으로써, 외부에서 보이는 인터페이스를 통해 내부 기능을 전부 이해하지 못해도 사용할 수 있다
예를들어 사람이라는 객체 안에 이름, 나이 데이터가 있고 먹다, 일하다, 말하다 함수가 있지만 내부적으로 먹다와 일하다 함수가 어떻게 구현되어있는지 몰라도 말하다 함수 호출 시 먹다와 일하다 함수를 사용할 수 있다

{

    interface PersonImpl{
        speak():string;
    }

    class Person implements PersonImpl{
        private name: string;
        private age:  number;

        constructor(name:string, age: number){
            this.name = name;
            this.age = age;
        }

        private eat(): string{
            return `이름은 ${this.name}. 나이는 ${this.age}. 지금 밥을 먹고있다`
        }
        
        private work(): string{
            return `이름은 ${this.name}. 나이는 ${this.age}. 지금 일을 하고있다`
        }

        speak(): string{
            this.eat();
            this.work();
            return `${this.name} says 안녕!`
        };
    }

    const person = new Person('yelee', 20);
    console.log(person.speak());
}

 

상속

기존에 생성된 사람이라는 객체를 상속받아 사람 2, 사람3, 사람4 ...라는 객체를 새롭게 생성할 수 있다. 
이 사람이라는 객체를 상속받은 사람2, 사람3 .. 객체는 상속받은 객체(부모 객체)의 함수를 그대로 사용할 수 있다

{

    interface PersonImpl{
        speak():string;
    }

    class Person implements PersonImpl{
        private name: string;
        private age:  number;

        constructor(name:string, age: number){
            this.name = name;
            this.age = age;
        }

        private eat(): string{
            return `이름은 ${this.name}. 나이는 ${this.age}. 지금 밥을 먹고있다`
        }
        
        private work(): string{
            return `이름은 ${this.name}. 나이는 ${this.age}. 지금 일을 하고있다`
        }

        speak(): string{
            this.eat();
            this.work();
            return `${this.name} says 안녕!`
        };
    }

    class Person2 extends Person{

    }

    const person = new Person('yelee', 20);
    console.log(person.speak()); // yelee says 안녕!

    const person2 = new Person2('seoyoon', 100);
    console.log(person2.speak()); // seoyoon says 안녕!
}

 

다형성

다형성은 사람이라는 객체를 이용해 아이, 학생 객체로 새롭게 생성할 수 있는 성질을 뜻한다.

{

    interface PersonImpl{
        speak():string;
    }

    class Person implements PersonImpl{
        private name: string;
        private age:  number;

        constructor(name:string, age: number){
            this.name = name;
            this.age = age;
        }

        private eat(): string{
            return `이름은 ${this.name}. 나이는 ${this.age}. 지금 밥을 먹고있다`
        }
        
        private work(): string{
            return `이름은 ${this.name}. 나이는 ${this.age}. 지금 일을 하고있다`
        }

        speak(): string{
            this.eat();
            this.work();
            return `${this.name} says 안녕!`
        };
    }

    class Child extends Person{
        speak(): string{
            console.log(super.speak());
            return '어린이입니다';
        }

    }

    class Student extends Person{
        speak(): string{
            console.log(super.speak());
            return '학생입니다';
        }
    }

    const child = new Child('aaa', 5);
    const student = new Student('bbb', 28);

    console.log(child.speak());
    console.log(student.speak());
}

 

 

 

반응형

댓글