10분 TIL, 주가 지날 때마다 1분씩 늘리기
오늘의 목표는 남은 강의를 모두 듣는 것이었다. 목표달성엔 성공했으나 과정이 썩 만족스럽진 않았다. 강의 내용이 완벽히 이해되지 않았기 때문이다. 그래도 이 부분은 시작 전부터 어느 정도 예상했기 때문에 다시 보수하면 된다. 크게 걱정하지 말자.
처음부터 모든 걸 기억하고 이해하려는 것은 클루지다. 조바심을 느끼고 완벽함을 추구하려는 것은 본능적인 행위이기 때문이다. 선사시대에 새로운 정보를 빨리, 많이 가질 수록 생존에 유리했다. 많은 정보를 수집하려는 것은 본능이다. 마치 눈앞에 있는 음식들을 모두 먹어버리는 것처럼 말이다. 하지만 내가 수집하는 정보는 끝없이 복습이 가능하다. 사라지지도 않는다. 그러니 이런 클루지를 이겨내고 사이클을 돌리고 코딩 시스템에 익숙해지는 것에 집중하자.
우선 기억에 남는 것을 차근 차근 떠올려서 간략하게 정리하자.
-
Dom
Dom이란 Document object modeling을 말한다. html 파일을 자바스크립트가 이해할 수 있는 object 형식으로 modeling 한다고해서 dom이라고 부른다. -
api란
api란 다른 시스템에서 제공하는 기능을 사용할 수 있도록 도와주는 중개자다.
api는 기능을 제공하는 시스템의 메뉴판을 들고 있다. 우리는 api에게 가서 메뉴판을 받고 원하는 기능을 달라고 요청하면 된다. 만약 영화 데이터를 제공해주는 시스템에 접근했다고 가정해보자. 그렇다면 그 시스템이 가지고 있는 영화 목록이 있을 것이다. 그 영화 목록을 바탕으로 api가 만들어지고 우리는 그 api를 통해서 영화 데이터를 요청하면 된다. api를 이용해 "해리포터 영화를 브라우저에 띄워주세요"라고 시스템에 요청을 할 수 있다.
- 클래스와 인스턴스
클래스란 무언가를 대량생산하기 위해 만들어 놓은 설계도를 말한다. 인스턴스는 그 설계도를 보고 만들어진 무언가를 말한다. 예를 들어, 클래스로 책상을 만들 수 있는 설계도를 작성한다. 그리고 그 설계도를 바탕으로 인스턴스를 만든다.
클래스에는 설계도로 만들 객체의 필수 요소가 들어가야 한다. 만약 클래스로 의자를 설계한다면 사용할 재료, 높이 등을 넣어줘야 한다는 말이다. 그렇게 만들어진 설계도에 따라 인스턴스를 만든다.
4.클로저
클로저는 완벽히 이해하진 못했다. 그래도 최대한 이해한 갈 비팅으로 정리해보자. 클로저는 정의부터 어렵다. 시니어들도 정의 부분만 보고 완벽히 이해하기는 쉽지 않다고 하니 좌절하지말자.
클로저란, 함수와 그 함수가 선언된 렉시컬 환경과의 조합을 말한다. 벌써 무슨 소린지 모르겠다.
내가 배운 강의 내용에 따라 정리해보자.
중첩함수가 외부함수보다 오래 지속될 때, '이미 종료된' 외부 함수의 환경 정보를 끌어다 사용할 수 있다. 원래는 외부 함수가 종료되면 함수내의 환경 정보도 같이 사라져야 한다. 하지만 중첩 함수가 그 정보를 참조해야 하는 경우 종료됐을지라도 사라지지 않고 끌어다 쓸 수 있다고 한다. 이것이 클루저의 개념이다.
코드로 이해해보자.
function outerfunc() {
const x = 10; //지역스코프
function innerfunc () {
console.log(x);
}
innerfunc ();}
outerfunc();
우선 외부 함수 outer가 선언된다. 그리고 밑으로 내려가 외부 함수가 실행되고 변수 10이 설정된다. 또 외부 함수 내에 있는 중첩함수인 inner 함수가 선언되고 외부함수는 끝난다. 이제 다시 중첩함수가 실행되고 로그가 찍힌다. 이때 찍힌 로그의 x는 뭘까?
10이다. 콜스택에 근거하면 외부 함수의 변수인 x는 사라져야 한다. 하지만 클로저 개념에 의해 외부 함수의 환경 정보인 변수 x는 사라지지 않고 중첩 함수에 참조된다.
글로 정리하니 깔끔하게 정리되는 것 같다. 역시 글쓰기는 사기다. 10분만 정리하려고 했으나 글쓰기가 재밌다.
