๐ฆ_21.12.01(1) TIL
21๋ 12์ 01(1)์ผ
๐ Javascript
๐ ์ฐ์ต๋ฌธ์ ํ๊ธฐ
๐ ๋ฐฐ์ด(array)
- ์์๊ฐ ์๋ ์๋ฃ๋ฅผ ์ ์ฅํ๊ณ ๊ด๋ฆฌํ๋ ์ฉ๋์ ์ต์ ํ๋ ์๋ฃ๊ตฌ์กฐ
- 0๊ฐ ์ด์์ ๊ฐ์ ์ผํ๋ก ๊ตฌ๋ถ, ๋๊ดํธ๋ก ๋ฌถ๋๋ค.
- ์ฒซ ๋ฒ์งธ ์ธ๋ฑ์ค๋ '0'๋ถํฐ ์์
- ์กด์ฌํ์ง ์์ ์์์ ์ ๊ทผ ์
undefined
๋ฐํ
// ๋ฐฐ์ด ๋ง๋ค๊ธฐ
let fruits = ["apple", "banana", "pear"];
console.log(fruits.length); // ๋ฐฐ์ด์ ๊ธธ์ด 3
๐ ํจ์(function)
- ํจ์ : ์
๋ ฅ, ์ถ๋ ฅ, ๊ธฐ๋ฅ์ ํ๋๋ก ๋ฌถ์ด ์ฌ์ฌ์ฉํ ์ ์๋๋ก ๋ง๋๋ ๊ฒ
=> ์ด๋ค ์์ ์ ์ํํ๊ธฐ ์ํด ํ์ํ ๋ฌธ(statement)๋ค์ ์งํฉ์ ์ ์ํ ์ฝ๋ ๋ธ๋ก - ํจ์๋ ์ด๋ฆ๊ณผ ๋งค๊ฐ๋ณ์๋ฅผ ๊ฐ์ง
- ํ์ํ ๋์ ํธ์ถํ์ฌ ์ฝ๋ ๋ธ๋ก์ ๋ด๊ธด ๋ฌธ๋ค์ ์ผ๊ด์ ์ผ๋ก ์คํ ๊ฐ๋ฅ
// ํจ์ ์ ์ - ํจ์ ์ ์ธ๋ฌธ
function square(number) {
return number * number;
}
// ํจ์ ํธ์ถ
square(2); // 4
square(4); // 16 ์ฌ๋ฌ๋ฒ ํธ์ถ ๊ฐ๋ฅ
- ํจ์์ ํน์ฑ์ ์ฝ๋์ ์ฌ์ฌ์ฉ์ ์ธก๋ฉด์์ ๋งค์ฐ ์ ์ฉ
=> ์ผ๋ฐ์ ๊ธฐ๋ฅ ์ด์ธ์ ๊ฐ์ฒด ์์ฑ, ๊ฐ์ฒด์ ํ์ ์ ์(๋ฉ์๋), ์ ๋ณด ์๋, ํด๋ก์ , ๋ชจ๋ํ ๋ฑ์ ๊ธฐ๋ฅ ์ํ ๊ฐ๋ฅ
ํจ์ ์ ์
- ํจ์ ์ ์ธ๋ฌธ(Function declaration)
- ํจ์๋ช
: ํจ์ ์ ์ธ๋ฌธ์ ํจ์๋ช
์ ์๋ตํ ์ ์๋ค.
=> ํจ์๋ช ์ ํจ์ ๋ชธ์ฒด์์ ์์ ์ ์ฌ๊ท์ ํธ์ถํ๊ฑฐ๋ ์๋ฐ์คํฌ๋ฆฝํธ ๋๋ฒ๊ฑฐ๊ฐ ํด๋น ํจ์๋ฃฐ ๊ตฌ๋ถํ ์ ์๋ ์๋ณ์ - ๋งค๊ฐ๋ณ์ ๋ชฉ๋ก : 0๊ฐ ์ด์์ ๋ชฉ๋ก์ผ๋ก ๊ดํธ
()
๋ก ๊ฐ์ธ๊ณ ์ฝค๋ง,
๋ก ๋ถ๋ฆฌ - ํจ์ ๋ชธ์ฒด : ํจ์๊ฐ ํธ์ถ๋์์ ๋ ์คํ๋๋ ๋ฌธ๋ค์ ์งํฉ. ์ค๊ดํธ
{}
๋ก ๋ฌธ๋ค์ ๊ฐ์ธ๊ณreturn
๋ฌธ์ผ๋ก ๊ฒฐ๊ณผ๊ฐ(= ๋ฐํ๊ฐ, return value)์ ๋ฐํ
- ํจ์๋ช
: ํจ์ ์ ์ธ๋ฌธ์ ํจ์๋ช
์ ์๋ตํ ์ ์๋ค.
// ํจ์ ์ ์ธ๋ฌธ
function ํจ์๋ช
(๋งค๊ฐ๋ณ์) {
ํจ์ ๋ชธ์ฒด
return ๋ฐํ๊ฐ;
}
- ํจ์ ํํ์(Function expression) : ํจ์ ๋ฆฌํฐ๋ด ๋ฐฉ์์ผ๋ก ํจ์๋ฅผ ์ ์ํ๊ณ (์ด ํจ์๋ฅผ) ๋ณ์์ ํ ๋นํ ์ ์๋๋ฐ ์ด๋ฌํ ๋ฐฉ์์ ํจ์ ํํ์์ด๋ผ๊ณ ํ๋ค.
- ํจ์๋ช
์๋ต ๊ฐ๋ฅ
=> ์ต๋ช ํจ์(anonymous function)
=> ํจ์ ํํ์์์๋ ํจ์๋ช ์ ์๋ตํ๋ ๊ฒ์ด ์ผ๋ฐ์
- ํจ์๋ช
์๋ต ๊ฐ๋ฅ
// ์ต๋ช
ํจ์ ํํ์(anonymous function expression)
var ๋ณ์๋ช
1 = function (๋งค๊ฐ๋ณ์) {
ํจ์ ๋ชธ์ฒด
return ๋ฐํ๊ฐ;
}
console.log(๋ณ์๋ช
1(์ธ์)); // ๋ฐํ๊ฐ
// ๊ธฐ๋ช
ํจ์ ํํ์(named function expression)
var ๋ณ์๋ช
2 = function ๊ธฐ๋ช
ํจ์๋ช
(๋งค๊ฐ๋ณ์) {
ํจ์ ๋ชธ์ฒด
return ๋ฐํ๊ฐ;
}
console.log(๊ธฐ๋ช
ํจ์๋ช
(์ธ์)); // ReferenceError: ๊ธฐ๋ช
ํจ์๋ช
is not defined
console.log(๋ณ์๋ช
2(์ธ์)); // ๋ฐํ๊ฐ
// ํจ์ ํธ์ถ์ ํจ์๋ช
์ด ์๋๋ผ ํจ์๋ฅผ ๊ฐ๋ฆฌํค๋ ๋ณ์๋ช
์ ์ฌ์ฉํด์ผํ๋ค.
๐ ํจ์ ํธ์ด์คํ (Function Hoisting)
ํจ์ ์ ์ ๋ฐฉ์์ ๋ฐ๋ผ ๋์ ๋ฐฉ์์ ์ฝ๊ฐ์ ์ฐจ์ด๊ฐ ์๋ค.
// ํจ์ ์ ์ธ๋ฌธ์ผ๋ก ํจ์๊ฐ ์ ์๋๊ธฐ ์ด์ ์ ํจ์ ํธ์ถ ๊ฐ๋ฅ
// ํจ์ ์ ์ธ์ ์์น์ ์๊ณผ๋์ด ์ฝ๋ ๋ด ์ด๋๋ ์ง ํธ์ถ์ด ๊ฐ๋ฅ
// ํจ์ ํธ์ด์คํ
var ๋ณ์๋ช
= ํจ์๋ช
(์ธ์); // ๋ฐํ๊ฐ
// ํจ์ ์ ์ธ๋ฌธ
function ํจ์๋ช
(๋งค๊ฐ๋ณ์) {
ํจ์ ๋ชธ์ฒด
return ๋ฐํ๊ฐ;
}
์๋ฐ์คํฌ๋ฆฝํธ๋ ES6์ let, const๋ฅผ ํฌํจํ์ฌ ๋ชจ๋ ์ ์ธ(var, let, const, function, function*, class)์ ํธ์ด์คํ ํ๋ค.
ํธ์ด์คํ
- ๋ชจ๋ ์ ์ธ๋ฌธ์ด ํด๋น ์ค์ฝํ(scope)์ ์ ๋(์ต์๋จ)๋ก ์ฎ๊ฒจ์ง ๊ฒ์ฒ๋ผ ๋์ํ๋ ํน์ฑ
=> ๋ฐ๋ผ์, ์๋ฐ์คํฌ๋ฆฝํธ๋ ๋ชจ๋ ์ ์ธ๋ฌธ์ด ์ ์ธ๋๊ธฐ ์ด์ ์ ์ฐธ์กฐ ๊ฐ๋ฅ - ํจ์ ์ ์ธ๋ฌธ์ผ๋ก ์ ์๋ ํจ์๋ ์๋ฐ์คํฌ๋ฆฝํธ ์์ง์ด ์คํฌ๋ฆฝํธ๊ฐ ๋ก๋ฉ๋๋ ์์ ์ ํจ์ ์ ์ธ, ์ด๊ธฐํ, ํ ๋น์ด ํ ๋ฒ์ ์ด๋ฃจ์ด์ง๋ค.
=> ํจ์ ์ ์ธ์ ์์น์ ์๊ด์์ด ์์ค ๋ด ์ด๋ ๊ณณ์์๋์ง ํธ์ถ ๊ฐ๋ฅ - ํจ์ ํํ์์ ๊ฒฝ์ฐ ํจ์ ํธ์ด์คํ
์ด ์๋๋ผ ๋ณ์ ํธ์ด์คํ
์ด ๋ฐ์
=> ํจ์ ํํ์์ผ๋ก ์ ์๋ ํจ์๋ ํจ์๊ฐ ํ ๋น๋๊ธฐ ์ ๊น์ง ํจ์๋ฅผ ํธ์ถํ ์ ์๋ค.
๋ณ์ ํธ์ด์คํ
: ๋ณ์ ์์ฑ ๋ฐ ์ด๊ธฐํ์ ํ ๋น์ด ๋ถ๋ฆฌ๋์ด ์ง์. ํธ์ด์คํ
๋ ๋ณ์๋ undefined
๋ก ์ด๊ธฐํ ๋๊ณ ์ค์ ๊ฐ์ ํ ๋น์ ํ ๋น๋ฌธ์์ ์ด๋ฃจ์ด์ง
๐ ๋งค๊ฐ๋ณ์(Parameter, ์ธ์) vs ์ธ์(argument)
๋งค๊ฐ๋ณ์
- ํจ์์ ์ ์ ๋ถ๋ถ์ ๋์ด๋์ด ์๋ ๋ณ์
- ํจ์ ๋ด์์ ๋ณ์์ ๋์ผํ๊ฒ ๋ฉ๋ชจ๋ฆฌ ๊ณต๊ฐ์ ํ๋ณด
์ธ์
- ํจ์๋ฅผ ํธ์ถํ ๋ ์ ๋ฌ๋๋ ์ค์ ๊ฐ
- ํจ์์ ์ ๋ฌํ ์ธ์๋ ๋งค๊ฐ๋ณ์์ ํ ๋น๋จ
- ์ธ์๋ฅผ ์ ๋ฌํ์ง ์์ผ๋ฉด ๋งค๊ฐ๋ณ์๋
undefined
๋ก ์ด๊ธฐํ
// ํจ์ ์ ์ธ๋ฌธ
function ํจ์๋ช
(๋งค๊ฐ๋ณ์1, ๋งค๊ฐ๋ณ์2) {
console.log(๋งค๊ฐ๋ณ์1, ๋งค๊ฐ๋ณ์2);
}
ํจ์๋ช
(์ธ์a, ์ธ์b);
// ์ธ์a๋ ๋งค๊ฐ๋ณ์1์ ์ ๋ฌ
// ์ธ์b๋ ๋งค๊ฐ๋ณ์2์ ์ ๋ฌ
// (์ธ์a, ์ธ์b)์ด ๋ฐํ๋์ด ์ถ๋ ฅ๋จ
// ์ถ๋ ฅ ๊ฒฐ๊ณผ : ์ธ์a ์ธ์b
ํจ์๋ช
(์ธ์c);
// ๋ ๋ฒ์งธ ์ธ์๊ฐ ์ ๋ฌ๋์ง ์์ ๊ฒฝ์ฐ,
// ์ถ๋ ฅ ๊ฒฐ๊ณผ : ์ธ์c undefined
๐ ๋ฐํ๊ฐ
ํจ์๋ ์์ ์ ํธ์ถํ ์ฝ๋์๊ฒ ์ํํ ๊ฒฐ๊ณผ๋ฅผ ๋ฐํ(return)ํ ์ ์๋ค.
return
ํค์๋๋ ํจ์๋ฅผ ํธ์ถํ ์ฝ๋์๊ฒ ๊ฐ์ ๋ฐํํ ๋ ์ฌ์ฉ- ํจ์๋ ๋ฐฐ์ด ๋ฑ์ ์ด์ฉํ์ฌ ํ ๋ฒ์ ์ฌ๋ฌ ๊ฐ์ ๊ฐ์ ๋ฆฌํดํ ์ ์๋ค.
- ํจ์๋ ๋ฐํ์ ์๋ตํ ์ ์๋ค
=> ์ด๋ ํจ์๋ ์๋ฌต์ ์ผ๋กundefined
๋ฅผ ๋ฐํ - ์๋ฐ์คํฌ๋ฆฝํธ ํด์๊ธฐ๋
return
ํค์๋๋ฅผ ๋ง๋๋ฉด ํจ์์ ์คํ์ ์ค๋จ
=> ํจ์๋ฅผ ํธ์ถํ ์ฝ๋๋ก ๋๋์๊ฐ๋ค.
๋ง์ผreturn
ํค์๋ ์ดํ์ ๋ค๋ฅธ ๊ตฌ๋ฌธ์ด ์กด์ฌํ๋ค๋ฉด ๊ทธ ๊ตฌ๋ฌธ์ ์คํ๋์ง ์๋๋ค.
์ฐธ๊ณ ๋งํฌ
Author And Source
์ด ๋ฌธ์ ์ ๊ดํ์ฌ(๐ฆ_21.12.01(1) TIL), ์ฐ๋ฆฌ๋ ์ด๊ณณ์์ ๋ ๋ง์ ์๋ฃ๋ฅผ ๋ฐ๊ฒฌํ๊ณ ๋งํฌ๋ฅผ ํด๋ฆญํ์ฌ ๋ณด์๋ค https://velog.io/@qhflrnfl4324/21.12.01-TIL์ ์ ๊ท์: ์์์ ์ ๋ณด๊ฐ ์์์ URL์ ํฌํจ๋์ด ์์ผ๋ฉฐ ์ ์๊ถ์ ์์์ ์์ ์ ๋๋ค.
์ฐ์ํ ๊ฐ๋ฐ์ ์ฝํ ์ธ ๋ฐ๊ฒฌ์ ์ ๋ (Collection and Share based on the CC Protocol.)
์ข์ ์นํ์ด์ง ์ฆ๊ฒจ์ฐพ๊ธฐ
๊ฐ๋ฐ์ ์ฐ์ ์ฌ์ดํธ ์์ง
๊ฐ๋ฐ์๊ฐ ์์์ผ ํ ํ์ ์ฌ์ดํธ 100์ ์ถ์ฒ ์ฐ๋ฆฌ๋ ๋น์ ์ ์ํด 100๊ฐ์ ์์ฃผ ์ฌ์ฉํ๋ ๊ฐ๋ฐ์ ํ์ต ์ฌ์ดํธ๋ฅผ ์ ๋ฆฌํ์ต๋๋ค