JavaScript - Function (함수)

함수는 특정한 작업을 수행하도록 하는 구문들을 모아놓은 재사용가능한 그룹들이다.
함수는 object이기 때문에 변수에 넣을 수도 parameter로 전달할 수 있고 함수를 리턴할 수 있다.
하나의 함수는 한가지의 일만 할 수 있도록 세분화하여 설정한다.

매개변수(parameter)는 함수를 선언할 때 사용되는 변수로 함수가 불릴 때는 그 자리에 인자(argument)가 들어온다.
parameter는 구멍, argument는 구멍에 넣은 값!
parameter는 premitive paremeter, object parameter 둘 다 들어올 수 있다.

Default parameteras : 값이 없거나 undefined가 전달될 경우 이름붙은 매개변수를 기본값으로 초기화할 수 있다.

<script>
function multiply(a, b =1) {
	return a * b;
}
console.log(multiply(5, 2)); // 10
console.log(multiply(5)); // 5
</script>

*Rest parameters : 배열의 형태로 값을 전달

<script>
function printAll(...args) {
	for (let i = 0; i < args.length; i++) {
    	console.log(args[i]);
    }
   =for (const arg of args) {
 		console.log(arg);  
    }
   =args.forEach((arg) => console.log(arg));
}
printAll('amaizing', 'mia', 'seo'); // amaizing / mia / seo
</script>

함수를 부르고 싶을 때

return은 함수 실행을 종료, 주어진 값을 함수 호출 지점으로 반환한다.

• early return, early exit : 조건이 맞지 않을 때 빨리 리턴하고 필요한 로직은 뒤에 작성하는 것이 훨씬 효율적이다.
  

local scope : 블록{} 안에 선언된 변수를 말한다. 지역 스코프는 크게 함수 스코프(function scope)와 블록 스코프(block scope)로 나뉜다.

• 안에서는 밖이 보이지만 밖에서는 안이 보이지 않는다!! >> 자식은 부모 안에 있는 메세지를 볼 수 있고 부모는 자식 함수에 선언된 변수를 볼 수 없다.

function expression

<script>
const print = function () { //함수의 이름이 없는 것 : anonymous function
	console.log('print');
};
print(); // print

const printAgain = print;
printAgain(); // print

fuction sum(a, b) {
	console.log(a + b);
};
const sumAgain = sum;
console.log(sumAgain(1,3)); // 4
</script>

• function expression은 값에 할당된 이후부터 호출을 할 수 있지만 funtion declaration은 함수가 선언되기 전에 호출할 수 있다.(hoisted)

callback

<script>
function randomQuiz(answer, printYes, printNo) {
	if (answer === 'love you') {
    	printYes();
    } else {
    	printNo();
    }
}
const printYes = function () {
	console.log('yes!');
};

const printNo = fuction () {
	console.log('no!')
};

randomQuiz('wrong', printYes, printNo); // no!
randomQuiz('love you', printYes, printNo); // yes!
</script>

arrow function
화살표 함수에는 anonymous function으로 작성한다.
인자가 하나일 때는 소괄호를 생략할 수 있지만 인자가 없거나 두 개 이상일 때는 생략이 불가능하다.
also a function body composed of a single-line block does not need curly braces.
Without the curly braces, whatever that line evaluates will be autonatically returned.

<script>
const simplePrint = () => console.log('simplePrint!');
const add = (a, b) => a + b;
const add = (a, b) => {
	return a + b;
};
<!--single-line block-->
const sumNumbers = (num1, num2) => num1 + num2;
</script>

IIFE (Immediately Invoked Fuction Expression) : 선언함과 동시에 바로 호출

<script>
(function hello() {
	console.log('IIFE');
})(); // IIFE
</script>