객체지향 프로그램의 기본
- 연관되어 있는 변수, 메소드끼리 객체로 묶어준다.
- 그리고 이 객체들은 '독립성'을 갖게 되며, 부품처럼 사용이 가능해진다.
-> 객체지향을 통해 도달하고 싶은 목표 " 좋은 부품의 로직을 만드는 것 "
생성자와 new
-> 객체를 만드는 가장 보편적인 방법 (2014년 강의. 지금 '일부러' 예전거를 공부하고 있다.)
var person = {} // Object를 나타냄
person.name = 'park';
person.introduce = function(){
return 'My name is ' + this.name;
}
console.log(person.introduce());
object는 데이터를 담을 수 있는 비어있는 상자라고 생각해도 좋다.
객체에 데이터를 담을 수 있는 방법은,
변수.프로퍼티 = 내용
변수.메소드 = 함수
여기서 this는 함수가 속해있는 객체를 가리킴.
✅ 이 방식의 문제점 -> 객체 정의 (var person = {}) 객체 내용들이 너무 떨어져 있다는 점.
-> 객체 정의하는 곳 사이에, 프로퍼티와 메소드를 직접 정의해주자.
2번째 그림도 옳지 않음.
수정해줘야 함.
뭘 수정해줘야 할까?
-> 객체 안에 내용들을 넣어주서는 응집성을 높여주었다.
✅ 만약 kim 객체를 하나 더 만들어준다고 했을 때, 이름은 그렇다 치더라도 함수 내용이 완전히 '중복'이 됨
-> 코드 가독성 떨어지고, 코드가 길어지고, 유지 보수가 힘들어짐 ...
-> 중복 제거를 해주자.
js 별명 = 함수형 언어. (js에서 함수가 차지하는 위상을 알 수 있음)
-> js를 이해하는 근본은 '함수' (함수를 잘해야 객체도 잘한다.)
- 객체를 만드는 역할을 하는 '함수'
- js에서 함수는 재사용 가능한 로직 묶음이 아니라, 객체를 만드는 창조자라고 할 수 있음
그런데
new를 붙이게 되면 결과가 달라진다.
앞에 new 가 붙어있는 함수는 -> 그냥 함수라고 부르지 않고, '생성자'라고 부른다.
뭐를 생성한다? 객체를 생성한다. 즉, '객체의 생성자'
Peson()은 new로 인해서 비어있는 객체를 만들고 반환하기 때문에, 변수 p에는 그 비어있는 객체가 담기게 된 것.
이건 마치, 이렇게 직접 리터럴로 객체를 만든 것과도 같다.
var p = {}
//
[자바]
- 클래스 내에 생성자가 존재
- 생성자 호출을 통해서 클래스의 객체를 만들어냄
[자바스크립트]
- 함수가 어디에도 속해있지 않음
-> 그리고 그냥 함수 앞에 new를 붙이면 객체를 만들어냄.
이건 최신 문법 업데이트 필요
function Person(){} // 함수 하나 호출
var p = new Person(); // new 생성자 통해 객체 만듦, var p = {} 와 동일
p.name = 'park';
p.intoduce = function(){
return 'My name is ' + this.name;
}
console.log(p.intoduce());
만약 kim 객체를 하나 더 만들어준다고 했을 때, 이름은 그렇다 치더라도 함수 내용이 완전히 '중복'이 된다라는 문제 때문에 지금 생성자를 배우는건데 이렇게 하면 문제가 똑같음. p1, 'kim'만 달라질 뿐 함수 중복이 그대로 똑같이 일어남. 개선된 점이 없음.
1. 생성자 함수 Person을 정의
2. this.name = 'egoing'이 됨.
즉, 이 객체의 name 프로퍼티 값이 이렇게 되는 것
3. 객체에 메소드도 담아주고
4. 이 과정이 다 끝난 후에 p1이라는 변수에 저장
객체가 생성자를 통해 만들어질 때마다, this.introduce가 만들어지기에 단 한 번만 정의해도 되게 됨 (즉, 중복이 사라짐!)
-> 생성자가 하는 일은 바로 '초기화'
객체에 대한 초기화를 함
- new 생성자를 통해 만들어지는 '빈 객체'가 어떤 프로퍼티와 어떤 메소드를 가져야 하는지를 이렇게 생성자 함수 안에 적으며 그 객체가 가지고 있는 정보, 할 수 있는 일들을 셋팅해주는 것 = 초기화
출처 : https://youtu.be/qnOX3M7VpQ8
jwt (0) | 2022.01.27 |
---|---|
node - middleware) express-validator (0) | 2022.01.26 |
ESLlint (1) | 2022.01.24 |
도커 실행 (0) | 2022.01.18 |
API Gateway (feat. MSA) (0) | 2022.01.13 |