개발자 되기(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..

1. 찾아보게 된 이유 구현할 내용: 특정 객체에 mouse hover시 Bootstrap tooltip을 표시하는 기능 구현한 내용: 아래의 코드와 같이 구현. 버그: 클릭한 이후에도 tooltip 이 사라지지 않음. 2. 해결 tooltip의 옵션에 ‘hover’ 추가. 3. 배웠던 내용 의사 클래스들의 구체적인 사양 focus: 특정 html 요소가 focus 됨. 보통 요소가 클릭 or 탭 되었을 때. active: 특정 html 요소가 활성화 됨. 보통 사용자가 요소를 클릭한 이후 - 클릭 버튼 떼기 전까지. 4. 레퍼런스 의사 클래스: https://developer.mozilla.org/ko/docs/Web/CSS/Pseudo-classes :focus : https://developer.m..