[JS]함수 다루기

31. 함수 선언

function 함수이름(파라미터) {
  동작;
  return 0;
}


2. 함수 표현식
함수 선언을 '값'처럼 사용
ex)
const myFunction = function () {

}

콜백함수 또한 함수표현식이라고 할 수 있다.


3. 함수 선언과 함수 표현식의 차이

함수 선언은 호이스팅에 의해서 함수 선언 전에 함수를 사용해도 함수의 동작을 한다.
함수표현식은 변수에 대입했을 때, 변수는 호이스팅 되지만 함수부분은 호이스팅 되지 않는다.
함수 선언은 변수의 var 키워드처럼 함수 스코프를 가진다. >> 함수에서 선언된 함수를 제외하고는 전역적으로 사용가능하다.


4. 즉시 실행 함수
(function () {
  동작
})();
함수부분을 소괄호로 감싼 다음에 바로 뒤에 함수를 실행하는 소괄호를 한 번 더 붙여주는 방식
선언과 동시에 실행이 된다.

즉시 실행 함수(표현)이라고 부른다.
영어로는 Immediately Invoked Function Expression, 줄여서 IIFE

즉시실행함수는 이름을 지어줘도 외부에서 재사용할 수 없다.
재귀 구조를 만들 때는 이름을 사용하기도 한다.


5. 즉시 실행 함수의 활용
1.프로그램 초기화 기능에 많이 활용된다
2. 재사용이 없는, 일회성 동작을 구성할 때 활용
3. 일시적으로 사용할 변수


6. 콜백 함수
다른 함수의 인자에 전달되는 함수

이벤트 핸들러에서 인수도 사용되는 함수도 콜백함수이다.

7. 고차 함수
다른 함수의 리턴값이 될수도있다.
함수를 리턴하는 함수를 고차 함수라고 부른다.

고차함수()();  >>> 고차함수의 리턴값의 함수를 바로 호출해서 사용할 수 도있다.


8. 함수의 매개변수의 기본값이 있을 때, 인수로 undefined를 사용해서 기본값을 출력하게 할 수 있다.
ex)
function test(parameter = 10, parameter2 = 20;){
  console.log(parameter, parmeter2);
}

test(); >> 매개변수 2개에 전부 인수 값을 전달하지 않았다. 결국 undefined를 전달한 것과 같다.
결과 : 10 20

test(undefined, 30); >> parameter에는 undefined, parameter2에는 30값을 전달했다. 명시적으로 parameter에게 undefined값을 줘 기본값을 출력하게 하였다.
결과 : 10 30

별로 권장되지 않는 방법이다.


9. Arguments
아규먼트 객체
Arguments 유사배열이 생성된다.
실제 설정한 파라미터와 상관없이 사용할 수 있다.


10. Rest Parameter
function test(...args){
}
rest parameter 배열이기 때문에 배열 메소드도 사용할 수 있다.
*일반 파라미터와 같이 사용할 때는 항상 마지막에 사용해야한다.


11. Arrow Function
ES2015에 등장한 '이름이 없는 익명함수'
함수표현식(변수, 콜백함수 등)에 사용한다.
() => {}
상황에 따라서는 더 짧게 쓸 수 있다.

  1. 파라미터가 하나일 경우 파라미터의 소괄호를 생략할수 있다.
parameter => {}   // 스타일리스트에 따라서 소괄호를 생략하지 않는 것이 가독성이 좋다는 의견도 있음

  2. 내부 동작 부분이 리턴문 한 줄이라면, 중괄호와 리턴을 둘 다 생략할 수 있다.
parameter => parameter * 2;
* return {객체} 일 경우! return 과 중괄호를 생략해버리면 객체의 중괄호를 함수 중괄호로 인식한다.
* 이와 같은 경우 () => ({name: '홍길동'}); 처럼 소괄호를 씌어준다.

*화살표 함수에는 arguments 객체가 없다!
*화살표 함수에서 this는 일반 함수의 this처럼 작동하지 않고 선언되기 직전의 유효한 this값과 똑같은 값을 가지고 
*그렇기 때문에 객체에 메소드를 만들때는 일반함수가 권장된다.


12. this
함수 내부에서 주로 사용된다.
객체의 메소드를 만들 때 중요한 역할

this란 ???  Object를 참조하는 keyword이다.
https://wormwlrm.github.io/2019/03/04/You-should-know-JavaScript-this.html.html
참고하기