[ Do it! HTML + CSS 웹 표준의 정석 스터디!] 17 함수와 이벤트(1)

DAY 24

🔖 오늘 읽은 범위 :

☃️2/5(목) 진도표 알림
❄️공부 내용: 17 함수와 이벤트(1)
❄️ 쪽수: 556~569쪽

---

😃 **기억하고 싶은 내용 (복붙해도 상관없어!)**

함수

• alert() 함수 ⇒ 내장 함수 : 자바스크립트에서 미리 만들어 놓은 함수.

• 필요한 명령들의 묶음.

• 함수 선언 또는 함수 정의.

    function addNumber(a, b) {
        let sum = a + b;
        alert(sum);
    }

• 함수 이름을 사용하는 것 ⇒ 함수를 호출한다 / 함수를 실행한다

💡함수 선언과 실행 순서

• 웹 브라우저에서 자바스크립트 코드 가운데 함수 선언 부분을 가장 먼저 해석함.
• 어느 곳에 함수를 선언해 놓아도 위치에 상관없이 함수를 실행할 수 있음.
• 선언 위치는 영향을 주지 않음.
• 보통 앞이나 뒷부분에 함수 선언 부분을 모아 놓고 필요할 때마다 호출해서 사용함.

변수 스코프

• var 예약어를 사용한 변수
  • 되도록이면 사용하지 말 것.
  • 지역 변수와 전역 변수 선언
    • var 변수는 함수 레벨 변수. 함수 스코프를 가진다.
    • var 를 제거하고 선언하면 ⇒ 전역 변수가 됨. ⇒ 예상치 못한 결과 발생.
  • 대규모 프로젝트에서 매우 위험한 부분임.
• var 변수 호이스팅
  • 웹 브라우저 자바스크립트 인터프리터는 코드 전체를 훑어 봄.
  • 코드를 훑어보면서 변수를 따로 기억해둠.
  • 따라서 변수 선언 및 할당 위치가 늦어져도 실제 코드에 대한 해석을 할 때 변수를 상단에 선언한 것 처럼 됨.
  • 호이스팅이 되면 엉뚱한 결과값이 나올 수 있어서 문제가 생길 여지가 큼.
• var 변수 재선언
  • var 변수는 재선언이 가능함.
  • 프로젝트 내에서 협업하여 코딩할 때 이러한 특징은 큰 문제가 됨.
• let 과 const 를 사용한 변수의 특징
  • ES6 에서 추가 된 예약어.
  • let 예약어 사용을 권장함.
  • 블록 영역의 스코프를 가진다.
    • 블록을 벗어나서 사용할 수 없다.
  • 재선언할 수 없는 let 변수
  • 재선언, 재할당도 할 수 없는 const 변수.
    • 상수 변수
• 호이스팅이 없는 변수
  • let 이나 const 변수는 선언 하기 전에 사용하면 오류가 발생함.

자바스크립트 변수 사용 가이드

• 전역 변수는 최소한으로 사용한다.
• 변수를 선언할 때는 var 보다 let, const 를 사용한다.
• for 문에서 카운터 변수를 사용할 때는 let 예약어를 사용한다.

🤔 **오늘의 파트에 대한 소감 (매우 주관적주의)**

• 함수 형태는 기억하자.
• 변수에서 let, const 변수 사용을 기억 할 것.
• var 변수 사용 금지.
• 호이스팅 특성을 이해 할 것. 레거시 코드 분석하고 리팩토링 할 때 도움이 될 부분임.

🔎 **추가로 알게 된 것 (책 내용 +알파로 궁금한 것, 이해가 가지 않는 것 등)**

• 타입스크립트의 출현 배경이 이거였나보다.

---

🤟소감 3줄 요약

• 춥다..
• 언어는 다들 비슷하구나.
• 타입스크립트를 공부해야 하겠네.