js개념 복습
this
this는 함수 내부에서 자신의 호출 주체를 참조하기 위해 쓰인다.
각 함수의 호출 주체
일반 함수 - 전역 객체 참조
메소드 - 함수 이름 앞에 명시된 객체 참조
생성자 함수 - 반환한 인스턴스 객체 참조
화살표 함수 - 상위 컨텍스트의 this(호출 추체)참조
내부 함수 - 전역 객체 참조
콜백 함수 - 기본적으로 전역 객체, 제어권을 가진 함수에 따라 달라짐
this를 명시적으로 바인딩한다는 것은 해당 함수를 누가 실행하게 할건지 고의적으로 지정하는 것.
메소드는 자신이 속한 객체 외부에서 사용할 때에는 속한 객체의 이름을 붙여 사용해야하고, 내부에서는 this를 명시해서 사용해야한다.
콜백 함수
제어권을 다른 함수에 넘김. 제어권을 가진 함수는 필요에 따라 적절한 시점에 실행시킴 -> 콜백함수는 실행 순서를 보장한다.
콜백함수로 어떤 객체의 메서드로 전달하더라도 함수로서 호출된다.
이를 해결할 방법은 전통적인 방법으로 외부 함수로 감싸서 외부 함수의 내부 변수로 현재의 this를 저장하고 그것을 클로저로 사용했다.
이후에 좀 더 간편한 방법들이 나왔다.
명시적으로 this바인딩을 해주거나 화살표 함수로 감싸서 넘긴다.
비동기
코드가 순서대로 실행되는 것이 아닌 별도 서버 요청, 보류, 대기와 관련있는 것이 비동기 코드이다.
콜백함수는 실행순서가 보장되기 때문에 비동기 로직 실행 완료 후의 후처리를 하거나, 연속적인 비동기 로직을 실행시키는데 이용할 수 있다.
하지만 콜백함수 내부에서 다음 비동기 로직을 작성해야하기 때문에 연속되는 비동기 로직이 많아질수록 깊어지고, 가독성이 좋지 않은 콜백지옥이 된다.
해결 방법 -> promise / async await
Promise
비동기 로직 실행
프로미스 생성자를 호출하는데 인자로 excutor콜백함수를 넣는다.
이 함수 안에 비동기 로직을 적고, 성공 시 resolve(결과 값), 실패 시 reject(에러 객체)를 호출한다.
반환 값은 panding상태의 결과 값이 undfind인 프로미스 객체이다.
비동기 실행 완료 후 성공이나 실패에 따라 상태와 결과 값이 바뀐다.
비동기 로직 실행 후 후처리
프로미스 인스턴스에 있는 then, catch, finally메소드를 사용해 후 처리 로직을 등록한다. 미리 등록해놓으면 프로미스 인스턴스의 상태가 바뀜과 동시에 결과 값을 전달해 로직을 실행시킨다.
후 처리는 연속으로 실행할 수 있다. then, catch, finally의 반환 값이 promise이기 떄문. 기존의 비동기 로직을 가지고 연속적인 후처리를 하고 싶다면 그냥 값만 반환, 새로운 비동기 로직을 실행하고 싶다면 새롭게 프로미스 인스턴스를 생성해 반환시킨다.
