[인프런 워밍업 스터디 클럽 2기 FE] 1주차 발자국

자바스크립트는 처음이지만... 이번 주 동안 배웠던 내용들을 가볍게 정리했다

var, let, const

• var : 중복 선언, 재할당 가능

• let : 중복 선언 불가, 재할당 가능

• const : 중복 선언과 재할당 둘 다 불가함 (재할당이 필요없다면 const를 사용하자

   

  ---

Window 객체

• 브라우저에 의해 자동으로 생성(브라우저의 창을 나타냄) <- 브라우저의 객체

  • 브라우저 창에 대한 정보 찾기, 제어 가능

  • var로 변수, 함수를 선언시 window 객체의 프로퍼티가 됨

     

  ---

DOM

• HTML 문서를 프로그래밍적으로 조작할 수 있는 객체 기반 구조

• 각 HTML 요소는 트리 구조로 이루어진 노드로 표현

• Document 객체와 메서드를 이용해서 웹페이지의 상태와 모든 HTML 태그에 접근 가능

   

  ---

  Event

• 버튼을 클릭했을때 액션이 일어나게 하려면 -> EventListener

  • 이벤트 리스너를 호출하기 위해서는 이벤트 리스너를 객체나 요소에 등록해야함

• 이벤트 종류

  • UI, 키보드, 마우스, 포커스, 폼 등

• 이벤트 버블링 : 이벤트가 발생했을시 이벤트가 상위 요소 핸들러에 전달 됨

• 이벤트 캡처링 : 버블링과 반대로 상단 요소에서 아래로 이벤트가 내려옴

• 이벤트 딜리게이션 : 하위 요소의 이벤트를 상위 요소에 위임

Closure

• 함수가 정의된 환경을 기억하고, 그 환경에 접근할 수 있는 함수(함수가 실행된 이후에도 외부 함수의 변수를 기억하는 기능), 데이터 은닉, 상태 유지 등에 사용

순수 함수

• 동일한 입력값에 대해 항상 동일한 결과를 반환하고, 외부 상태에 의존하지 않으며, 부작용이 없는 함수

IFEE

• 정의와 동시에 사용되는 함수, 변수를 전역으로 선언하는 것을 피하기 위해서 사용됨 (내부 안으로도 다른 변수들이 접근하는 것을 막을 수도 있음)

비동기

• JS는 싱글 스레드 언어이지만 비동기 작업이 가능

  • Callback: 작업이 완료되면 호출할 함수 전달

  • Promise: 비동기 작업의 성공 또는 실패를 나타내는 객체

  • async/await: Promise를 처리하기 위한 더 간단한 문법

  ---

  ES6

  • ES(JS의 표준 사양을 정의하는 스크립트 언어. JS는 ES 표준을 구현한 언어)

  • ES6는 ES의 6번째 버전이며 2015년에 발표(가장 중요한 버전)

  ---

  미션 1

• https://github.com/Sungw0o/JS-React/tree/main/frontend/mission/chap1

   

   

  미션 2

• https://github.com/Sungw0o/JS-React/tree/main/frontend/mission/chap2

   

미션 3

• https://github.com/Sungw0o/JS-React/tree/main/frontend/mission/chap3

   

   

회고

• JS는 아예 진짜 처음이라 배우는데 너무 익숙하지 않아 고생했다

• 다음주에 JS 강의 1회독을 빨리 마무리하고 이해가 되지 않았던 부분부터 차근차근 복습해야겠다