---
# System prepended metadata

title: 강남_R_Day05 리뷰 레포트

---

# 강남_R_Day05 리뷰 레포트

### 참석자

- 김도현, 나영균, 임문수, 한수인

## 1. 코드 동작 이해

- this를 바인딩하는 방식이 여러가지다. 그중 몇가지를 알아보자면
  - callback함수를 arrow function으로 설정해서 다단계방식으로 받아오는 법.
  - 함수 선언식 / 표현식을 사용해서 bind() 메소드를 이용해서 this값을 가져오는 법.
  - 미리 상위 스코프의 변수에 this를 넣어놨다가 사용하는 법
- Promise then 패턴에 대해서 비동기 작업이 정상적으로 작동한 경우 resolve()로 값을 전달하고 비동기 도중 문제가 발생한 경우 reject()로 값을 반환한다. 후속조치를 then()과 catch() 잡는다.
- Generator는 지연평가를 시행하므로 next()를 이용해 평가할 수 있다. yield가 될 경우 데이터와 제어권을 호출자에게 넘기고 호출자는 그 데이터를 처리하여 다시 generator쪽으로 next()를 통하여 넘겨주면 멈춘 시점에서 다시 시행한다.이를 통해서 이터러블을 쉽게 만들 수 있을뿐만 아니라 제어권의 통제를 통해서 비동기적 처리를 관리할 수 있게 된다.
#### 코드작동순서
- b.js에서 a, c, d 모듈 객체를 가져 온 후에  runner()를 실행시킨다.
- runner가 run 제네레이터의 yield가 넘긴 Promise를 iterable 객체에서 next()로 value로 가져와 다시 run으로 넘기기위해 next()에 인자로 넘긴다.
- run 제네레이터의 내부에서는 checker 인스턴스의 프로퍼티와 msg, source, ourStudents인자를 이용해서 Promise객체를 iterable 형태로 만들어 yield로 호출자에게 넘긴다.
- 두번째 next()로 넘어온 Promise객체를 then으로 가져와 데이터를 assert로 처리하고 통과하면 console.log로 출력한다.
- 에러가 발생하면 catch로 잡아 그에 맞는 log를 출력한다.

## 2. 코드 동작 개선
#### 스스로 확인할 사항

- 김도현
    - VScode 디버깅에서 breakingpoint를 통해 프로그램이 어떤식으로 진행되는지 확인함.
    - breakpoint로 각 함수 및 변수가 갖는 값을 확인하며, 디버깅을 진행함.
    - 비동기에 대한 전반적인 지식이 부족해 그 쪽을 집중적으로 공부해야함.
    - 자바스크립트 this에 관해 공부해야함.
- 나영균
    - git의 branch
        - 개발을 하다보면 전체 코드를 독립적으로 바꾸었다가 다시 돌리거나 바뀐 부분만 다시 원본코드에 합치기를 하는 등의 작업을 한다. 이를 쉽게 가능하게 하는 것이 git의 브랜치 이다.
        - 크게 다르다고 손꼽히는 특징은 branching을 사용할때 매우 가볍게 순식간에 만들 수 있고 브랜치를 옮겨다닐 수 있기 때문이다. 그 이유는 실제로 git의 branch는 한 커밋을 가리키는 41바이트의 SHA-1 체크섬 파일에 불과하다.
            - master 브랜치에서 원하는 이름의 branch 명으로 파생한다. `git branch 브랜치명`.
            - 그러면 그 브랜치로 checkout된 상태이며 그 상태로 개발을 하면 그 브랜치의 코드를 바꾸는 것이며 commit을 하면 그 브랜치에 commit을 하는 것이다.
            - 작업이 완료되지 않은 상태에서 다른 브랜치를 가야한다면 `git checkout 브랜치명`으로 다른 브랜치로 이동할 수 있다.
            - 작업이 완료되고 해당 브랜치의 코드를 master로 merge하여 해당 branch의 작업내용을 master로 바꿀 수 있다. `git checkout master -> git merge 브랜치명`
- 임문수
    - breackingpoint를 사용하면서 실행이 해당 부분을 수행하는지 확인하면서 디버깅이 가능하다. 또한 실행하면서 확인하고 싶은 부분만 확인하면서 넘어갈 수 있다.
    - git branch는 독립적인 작업을 하기위한 기능으로 각각의 브랜치는 서로의 영향을 받지 않기때문에 여러작업을 동시에 실행할 수 있다.
- 한수인
  - 디버깅에서 breakpoint를 사용하면 에러가 안나도 내가 원하는 부분에 대해서 조사가 가능하다.
  - git branch를 통해서 버전관리를 한다. branch를 통해서 특정 분기를 만드는 것이다. 이는 어찌보면 commit의 더 큰 단위라고도 생각이 된다. commit은 branch라는 큰 틀안에서 자신의 작업에 관한 개인기록분기를 만드는 것이라 생각한다.
  - Promise에 대해서 공부하자.
## 3. Consideration
#### 다같이 확인할 사항
- 각자 어떤 디버깅 방법을 사용해보았는가? 이 부분을 모두 이야기하고 적어보자.
    - 디버깅 모드를 사용해 console을 빠르게 확인함.
    - breakingpoint를 사용해, 변수 및 함수 내의 값을 확인하고 Step over / Step into/ Step out를 이용해 원하는 곳을 디버깅함.
    - call stack을 확인하여 프로그램 진행을 확인하며 디버깅함.
    - watch에 원하는 값을 넣어 디버깅함.
    - **breakpoints**: debugging시 자세히 Call Stack, 지역변수, 전역변수, 클로저변수, watch 등을 자세히 들여다 보고 싶은 지점을 의미한다.
    - **watch**: 코드를 계속해서 돌면서 유심히 따로 지켜보고싶은 것들을 지정하여 놓으면 watch에서쉽게 볼 수 있다.
    - **call stack**: JS에서 처음 실행된 함수에서 다른 함수를 호출 하고 또 그 함수에서 다른 함수를 호출하고 하며 처음 호출된 함수부터 나중에 호출된 함수부터 쌓이게 된다. 이를 stack으로 불리우는 이유는 나중에 호출된 함수가 처리되면서 쌓였던 stack도 처리되며 JavaScript가 실행되기 때문이다.
    - **Step over**: Step over는 코드 라인을 한 스탭을 진행하는데 현재 실행 라인에 함수 실행 코드가 있다면 함수를 실행하는데 함수 안으로 진입하지는 않습니다. 
    - **Step into**: Step into는 Step over와 다르게 현재 실행 라인의 코드에 함수가 있다면 함수 안의 첫 번째 코드로 진입해 들어가 다시 하나씩 라인별로 코드를 실행할 수 있습니다.
    - **Step out**: Step into로 들어온 함수를 끝까지 실행하고 밖으로 빠져나와 해당 함수를 실행한 함수로 돌아갑니다.
- 프로젝트에서 npm 명령어를 활용해 추가로 외부 모듈을 설치했을때 package.json에 어떤 변화가 생기는지 설명하자.
    - 프로젝트 폴더 안에는 node_modules폴더가 생성되고 그 안에는 외부모듈이 설치된 것을 확인할 수 있다. 그리고 다시 package.json을 열어보면 devDependencies에 외부모듈이 추가된다.
- node_modules 디렉토리는 어떤 역할을 하는 디렉토리 인가 설명해보자.
    - npm 에는 지역과 전역이라는 두가지 설치모드가 존재한다. 지역 설치는 해당 폴더에 node_modules 라는 폴더가 생기며 이곳에 외부 모듈이 설치 되며 시스템 전체에 영향을 주지 않고, 해당 프로젝트에서 필요로 하는 특정 모듈만을 받아서 사용할 수 있다. 전역설치에서도 node_modules 디렉토리가 생기지만 지정된 전역 폴더 안에 설치가 된다.
- exports, require 동작방식
    - module.exports VS exports
        - exports는 단순히 module.exports를 참조하며 두 방법 모두 마지막에 module.exports를 리턴하는 것임
        - exports는 moduel.exports라는 객체를 참조하고 있는 것이므로 만약 exports에 새로운 키를 추가하고 값을 넣는 방법이 아닌 할당을 해버린다면 exports는 더이상 module.exports를 바라보지 않기 때문에 제대로 작동하지 않음
    - Node.js는 모듈 시스템의 사실상 표준인 CommonJS를 채택하였고 현재는 독자적으로 CommonJS와 완전히 동일하지는 않지만 대부분 같은 방식을 사용하고 있다. 
    - Node.js는 module 단위로 각 기능을 분할할 수 있다. module은 파일과 1대1의 대응 관계를 가지며 하나의 모듈은 자신만의 독립적인 실행 영역(Scope)를 가지게 되어 클라이언트 사이드 JS와는 다르게 전역변수의 중복 문제가 발생하지 않는다. 
    - 모듈은 module.exports 객체 혹은 그 객체를 바라보는 exports를 통해 정의하고 외부로 공개한다. 
    - 공개된 모듈은 require 함수를 사용하여 임포트한다.
    - 사용방법
        ```js
        /*
        * func.js
        * module.exports에는 하나의 값만 할당 할 수 있으므로 여러개를 export할때 객쳏 형태로 export하면 유용하다.
        * */
        const myfunc  = () => {.....}
        const myfunc2 = () => {.....}
        module.exports.myfunc = myfunc
        moduel.exports.myfunc2 = myfunc
        
        /*
        * main.js
        *
        * */
        const funcs = require("./func.js");
        const myfunc = funcs.myfunc;
        const myfunc2 = funcs.myfunc2;
        
        myfunc();
        myfunc2();
        
        /*
        * 혹은 funcs.myfunc() funcs.myfunc2()로 사용할 수 있다.
        * */
        ```