day + 18
오늘은 정말... 부족한 부분에서 깨달음을 얻었다..!
자바스크립트 객체까지 공부하며 긴가민가 했던 문법들에 대해 알 수 있었다
프론트엔드 문외한인 나는
앞, 뒤 맥락을 모르니 지금껏 2% 부족한 채로 이해했다면
오늘은 잃어버린 2%를 찾아주는 시간이었다
이게 그래서 그렇구나~ 할 수 있어서 배움이 증폭되는 시간이었다
1. 오늘 공부한 것
✅ 원시 자료형과 참조 자료형
원시 자료형
: 하나의 데이터를 담고 있으며, 변수에 할당될 때 데이터 값(value) 자체를 담는다.
고정된 저장공간(stack)을 차지한다
문자열, 숫자, boolean , null, undefined 등
참조 자료형
: 여러 데이터를 담고 있으며, 변수에 할당될 때 데이터가 담긴 보관함의 주소(reference)를 담는다.
동적으로 변하는 저장공간(heap)을 사용한다
배열, 객체, 함수 등
➡️ heap은 runtime에서 결정된다
reference data가 얼마나 많은 데이터를 가지고 있는지가 프로그램의 실행 중 수시로 변경될 수 있기 때문이다
값 자체가 아닌 값의 주소를 복사하는 것은 대량의 자료를 효율적으로 저장하고 관리할 수 있는 방식이다 ❗️
✅ Scope
: 변수의 유효 범위
안쪽 스코프의 변수는 바깥쪽 스코프에서 유효하지 않는다
✔️ 전역 스코프와 지역 스코프
전역 스코프(Global Scope) : '가장 바깥쪽 스코프'
지역 스코프(Local Scope) : '가장 바깥쪽 스코프'를 제외한 모든 '안쪽 스코프'
✔️ 지역 변수는 전역 변수보다 더 높은 우선순위를 가진다❗️
같은 이름을 가진 변수는 안쪽 스코프의 변수가 더 높은 우선순위를 가진다
쉐도잉(variable shadowing) : 동일한 이름의 변수로 인해 바깥쪽 변수가 안쪽 변수에 가려지는 현상
✔️ 블록 스코프와 함수 스코프
블록 스코프(block scope)
: {중괄호} 블록을 기준으로 범위가 구분된다
function 키워드를 사용하지 않는 '화살표 함수' 또한 블록 스코프에 포함된다
블록 스코프 안에서 선언된 변수는 해당 블록 안에서만 접근이 가능하다
➡️ 블록 범위를 벗어나면 접근 불가능. ReferenceError
함수 스코프(function scope)
: 함수의 시작부터 종료까지를 범위로 한다
function 키워드를 사용하는 함수 선언식 및 함수 표현식을 기준으로 한다
화살표 함수 제외!
✔️ var / let / const
세 가지 키워드를 혼용해서 쓰는 것을 보고 각각의 역할에 대해 찾아본 적이 있는데
이번 chapter에 등장해서 제대로 알고 간다!
var
: for문이 만들어 낸 블록 스코프를 무시하고 함수 스코프만 따른다. 단, 화살표 함수는 따른다❗️
변수의 재선언, 재할당 모두 가능
➡️ 혼동을 피하기 위해 var는 사용 자제해야지
let
: 블록 스코프와 함수 스코프 모두 따름
변수의 재선언 불가능, 재할당 가능
➡️ 블록 단위로 스코프를 구분할 때 let을 사용하자❗️
const
: 블록 스코프와 함수 스코프 모두 따름
변수의 재선언 불가능, 재할당 불가능
➡️ 상수(constant)를 정의할 때 const를 사용하자❗️
값의 변경을 최소화 하여 안전한 프로그램을 만들 수 있다
✔️ window 객체 (브라우저 only)
브라우저 창을 대표하는 객체이자 전역 항목을 담고 있는 객체
var로 선언된 전역변수 및 전역 함수는 window 객체에 속한다
➡️ var console = [] 과 같이 window 내장 기능을 덮어씌울 수도 있으니 주의할 것
2. 💡아하 그렇구나!
-
이번 chapter를 통해 변수 선언할 때
keyword를 반드시 작성해야 하는 이유를 알게 되었다.
선언 keyword를 작성하지 않아도 에러 없이 출력이 되길래 keyword 작성은 옵션인가보다 했는데,
keyword 없이 변수를 정의하면var로 선언한전역 변수로 취급되어서 의도하지 않은 부수효과(side effect)가 발생할 수도 있다. -
객체를 공부하면서 궁금해졌던
엄격 모드,비엄격 모드에 대해서도 알게 되었다!
엄격 모드(strict mode)란 브라우저가 보다 엄격하게(!) 작동하도록 만들어 주는 mode라고 한다.
예를 들어 선언 없이 변수를 할당하는 경우에비엄격 모드는 원하는 대로 출력이 되었다면,엄격 모드는 그것을 error 취급한다.
'use strict'; //자바스크립트 파일 상단에 작성하여 실행3. 더 공부하자
- 배열, 객체 예제 풀기
- 블록스코프/ 함수스코프 많이 만들어보고 스코프 헷갈리지 않기
4. 기억하자
함수 스코프 안에서 선언 키워드 없이 변수를 정의하면, 함수 스코프를 나와서 실행하기 전까지 '선언되지 않은 것'으로 취급한다❗️
for문에서 특히 선언 keyword 빼먹지 말고 작성하자
전역 변수로 너무 많은 변수를 할당하지 말 것!
편리한 대신 어떠한 로직에 의해 side effect가 발생할 수도 있다
운동 다녀와서 마저 공부해야지
