๐ก ๋ณ์์ ์์ฑ ๋จ๊ณ
1. ์ ์ธ๋จ๊ณ(Declaration phase)
๋ณ์ ๊ฐ์ฒด์ ๋ณ์๋ฅผ ๋ฑ๋กํ๋ค. ์ด ๋ณ์ ๊ฐ์ฒด๋ ์ค์ฝํ๊ฐ ์ฐธ์กฐํ๋ ๋์์ด ๋๋ค.
2. ์ด๊ธฐํ ๋จ๊ณ (Initialization phase)
๋ณ์ ๊ฐ์ฒด์ ๋ฑ๋ก๋ ๋ณ์๋ฅผ ๋ฉ๋ชจ๋ฆฌ์ ํ ๋นํ๋ค. ์ด ๋จ๊ณ์์ ๋ณ์๋ undefined๋ก ์ด๊ธฐํ ๋๋ค.
3. ํ ๋น ๋จ๊ณ( Assignment phase)
undefined๋ก ์ด๊ธฐํ๋ ๋ณ์์ ์ค์ ๊ฐ์ ํ ๋นํ๋ค.
๐ก var์ ๋ฌธ์ ์
1. ํจ์ ๋ ๋ฒจ ์ค์ฝํ(Function-level scope)
- ์ ์ญ ๋ณ์ ๋จ๋ฐ
- for๋ฌธ ์ด๊ธฐํ์์์ ์ฌ์ฉํ ๋ณ์๋ฅผ ์ธ๋ถ์์ ์ฐธ์กฐํ ์ ์๋ค.
2. var ํค์๋ ์๋ต ํ์ฉ
- ์๋ํ์ง ์์ ๋ณ์์ ์ ์ญํ
3. ์ค๋ณต ์ ์ธ ํ์ฉ
- ์๋ํ์ง ์์ ๋ณ์๊ฐ ๋ณ๊ฒฝ
4. ๋ณ์ ํธ์ด์คํ
- ๋ณ์๋ฅผ ์ ์ธํ๊ธฐ ์ ์ ์ฐธ์กฐ๊ฐ ๊ฐ๋ฅํ๋ค
๐ก ํธ์ด์คํ (Hoisting)์ด๋?
- ํธ์ด์คํ ์ var , let , const, function ๋ฑ ๋ชจ๋ ์ ์ธ์ ์ ํจ๋ฒ์(scope)์ ๋ฐ๋ผ ๊ฐ์ฅ ์๋ก ๋์ด์ฌ๋ฆฌ๋ ๊ฒ์ด๋ค.
- ํธ์ด์คํ ์ผ๋ก ์ด๊ธฐํ ๋ ๊ฐ์ ์ ์ธํ๊ณ ์ ์ธ๋ง ๋์ด ์ฌ๋ฆฐ๋ค.
- ์ ์ธ๊ณผ ํ ๋น์ ๋ถ๋ฆฌ๋ผ๊ณ ์๊ฐํ๋ฉด ์ฝ๋ค.
- ์ ํจ๋ฒ์์๋ 'ํจ์๋ ๋ฒจ ์ค์ฝํ'์ '๋ธ๋ญ๋ ๋ฒจ ์ค์ฝํ'๋ก ๊ตฌ์ฑ๋์ด ์๋ค.
- var๋ ํจ์๋ ๋ฒจ ์ค์ฝํ์ด๊ณ let,const๋ ๋ธ๋ญ ๋ ๋ฒจ ์ค์ฝํ์ด๋ค.
- var๋ ์ด๊ธฐ ๊ฐ์ด ์๋ค๋ฉด ์ ์ธ์ ๋์์ undefined๋ก ์ด๊ธฐํ ๋๊ธฐ ๋๋ฌธ์ ์ ์ธ ์ ์๋ ์ฌ์ฉ์ด ๊ฐ๋ฅํ๋ค.
๐ก var , let , const ๋น๊ต
var | let | const | |
์ฌ์ ์ธ๊ฐ๋ฅ์ฌ๋ถ | ๊ฐ๋ฅ | ๋ถ๊ฐ๋ฅ | ๋ถ๊ฐ๋ฅ |
์ค์ฝํ | ํจ์๋ ๋ฒจ | ๋ธ๋ญ๋ ๋ฒจ | ๋ธ๋ญ๋ ๋ฒจ |
์ด๊ธฐ๊ฐ | ์ ํ | ์ ํ | ํ์ |
๊ฐ ์ฌํ ๋น ์ฌ๋ถ | ๊ฐ๋ฅ | ๊ฐ๋ฅ | ๋ถ๊ฐ๋ฅ |
์ ์ธ ์ ์ฌ์ฉ | ๊ฐ๋ฅ | ๋ถ๊ฐ๋ฅ | ๋ถ๊ฐ๋ฅ |
๐ const ์ let ๊ฐ ๋ณ๊ฒฝ ์ฌ๋ถ์์ ํท๊ฐ๋ฆด์ ์๋ ๋ถ๋ถ์ด ์์ด์ ์ฒจ์ธํด๋ณด์๋ฉด (๋๋ ํท๊ฐ๋ ธ๋ค.)
์ฌ๊ธฐ์ ๋ณ๊ฒฝ์ ๊ฐ์ ๋ณ๊ฒฝ์ด ์๋๋ผ '๋ฉ๋ชจ๋ฆฌ ์ฃผ์'์ ๋ณ๊ฒฝ์ด๋ค.
let ์ ๋ฉ๋ชจ๋ฆฌ ์ฃผ์ ๋ณ๊ฒฝ์ด ๊ฐ๋ฅ ํ๊ณ const ๋ ๋ฉ๋ชจ๋ฆฌ ์ฃผ์ ๋ณ๊ฒฝ์ด ๋ถ๊ฐ๋ฅํ๋ค.
let Arr = [];
Arr.push(1);
Arr.push(2);
Arr.push(3);
// Arr ๋ฐฐ์ด์์์ ๊ฐ์ด ์ถ๊ฐ๋์ง๋ง ๋ฉ๋ชจ๋ฆฌ ์ฃผ์๋ ๋ฐ๋์ง ์๋๋ค.
// ๊ทธ๋์ const๋ฅผ ์ฌ์ฉํด๋ ๋๋ค.
const Arr = [];
Arr.push(1);
Arr.push(2);
Arr.push(3);
๐ก ์์
console.log(num); // undefined
var num;
์ฐธ๊ณ
'JavaScript > ๊ฐ๋ ' ์นดํ ๊ณ ๋ฆฌ์ ๋ค๋ฅธ ๊ธ
[Javascript] ๋ฐ์ดํฐ ํ์ ๊ณผ ๋ณ์ (0) | 2021.01.12 |
---|---|
[ES6] Destructuring Assignment / ๊ตฌ์กฐ ๋ถํด ํ ๋น (0) | 2021.01.11 |
[ES6] Object ๊ฐ์ฒด (0) | 2021.01.11 |