개발자 되기(feat.SSAFY)

1. 알게 된 점 대규모 프로젝트에서 의사를 결정하는 과정 ECMAscript의 globalThis의 존재와 상세사항 2. 들어가며 JS 의 전역 This는 런타임에 따라 다른 객체를 가리킨다. Node런타임에서는 this == global이고, 웹 브라우저 환경에서 This === window 를 가리킨다. SPA(Vue 혹은 Node)에서 this 는 현재의 Vue 또는 React 컴포넌트에 자동으로 bind 된다. Framework 를 활용해 개발 하다 보면 이 정도의 지식만으로도 충분했다. 지난 시간 this 와 bind() 함수, Arrow function 에 대해 공부하다 globalThis 라는 스펙의 존재를 알게 되었다. globalThis는 JS의 모든 런타임에서 ‘전역 객체’에 접근할 ..

1. 오늘 배운 점 Switch-Case 문의 Case내부는 별도의 scope를 생성하지 않는다. 따라서 Case문 내부에서 생성된 변수들이 Case문 외부에 영향을 끼칠 수 있다. Case문 내부에서 {}로 블록을 생성해 위의 상황을 막을 수 있다. 2. 문제 상황 Switch - Case문 내부에서 변수를 설정했다. 아래와 같은 에러가 발생했다. ESLint: Unexpected lexical declaration in case block.(no-case-declarations) 3. 기존에 알고있던 내용 Switch - Case문의 사용 지양 ‘클린 코드’ 에 따라 Switch case문을 지양했다. 하나의 함수가 한 가지 이상의 동작을 할 가능성이 매우 높아지기 때문이다. 또한 switch-cas..

나는 FE 개발 입문을 SPA 로 시작했다. 너무나 익숙하게 Arrow function과 this의 스펙을 활용하고 있다. 어느 날 갑자기 ES6 이전에는 비슷한 기능을 어떻게 구현했을지 궁금해졌다. 1. this: 알고있던 내용 호출한 대상을 가리킨다. 기본적으로는 전역 객체(Node 환경의 global, 웹 브라우저의 window) 를 가리킨다. 클래스나 메서드 등에서 호출될 시 ‘호출한’ 객체. this는 함수 호출 시 자동으로 bind됨. (ES6) this의 자동 bind 원하지 않을 시 Arrow function(화살표 함수) 를 사용할 것. 2. this: 궁금했던 내용 Arrow function(화살표 함수) 는 ES6 스펙이다. ES6는 ECMAscrpit 2015년 스펙이다. 2015년..