[jsp]함수

1기본적인 함수 만드는 법 = 함수 선언(Function Declaration)

2함수가 아닌 다른 코드블록에서 함수 선언시 전역적으로 호출 가능
함수 선언은 변수의 var 키워드처럼 함수 스코프를 가진다.
3함수 선언보다 함수를 먼저 호출해도 문제 없이 나온다.

function 함수이름(파라미터) {
	동작
    return 리턴값
}

함수 만드는 법2

함수 선언을 값처럼 변수에 할당 = 함수 표현식(Function Expression) -> 함수표현을 값처럼 사용(핵심)

const printCodeit = function() {
	console.log('Codeit');
};

printCodeit();

장점: 변수의 스코프를 활용 할 수 있다. var, const, let 할당된 변수에 따라 다르다.
3변수의 특성상 선언 이전에 함수 접근 불가

const myBtn = document.querySelector('#myBtn');

myBtn.addEventListener('click', function () {
  console.log('button is clicked!');
});

Named Function Expression (기명 함수 표현식)

함수 표현식으로 함수를 만들 때는 선언하는 함수에 이름을 붙여줄 수도 있는데요.
이름이 있는 함수 표현식, 즉 기명 함수 표현식이라고 부릅니다.
함수 표현식으로 함수가 할당된 변수에는 자동으로 name이라는 프로퍼티를 가지게 되는데요.

const sayHi = function () {
  console.log('Hi');
};

console.log(sayHi.name); // sayHi

const sayHi = function printHiInConsole() {
  console.log('Hi');
};

console.log(sayHi.name); // printHiInConsole

함수 표현식을 작성할 때, 함수에 이름을 지정할 수 있다는 점과 특히 이렇게 함수 내에서 함수를 가리켜야 할 때는 꼭 함수 이름을 작성해주는 것이 안전

let countdown = function printCountdown(n) {
  console.log(n);
  if (n === 0) {
    console.log('End!');
  } else {
    printCountdown(n - 1);
  }
};

let myFunction = countdown;

countdown = null;

myFunction(5); // 정상적으로 동작

즉시 실행 함수

(function () {
  console.log('Hi!');
})();

함수선언 부분을 소괄호로 감싼 다음에 바로 뒤에 함수를 실행하는 소괄호를 한 번 더 붙여주는 방식인데요.
이렇게 하면 함수가 선언된 순간 바로 실행이 되는 겁니다.

이렇게 함수 선언과 동시에 즉시 실행되는 함수를 가리켜 즉시 실행 함수 (표현)이라고 부르는데요.
영어로는 Immediately Invoked Function Expression, 줄여서 IIFE라고 부릅니다
주의) 즉시 실행 함수는 함수에 이름을 지어주더라도 외부에서 재사용할 수 없다는 겁니다.

즉시 실행 함수의 활용

즉시 실행 함수는 말 그대로 선언과 동시에 실행이 이뤄지기 때문에 일반적으로 프로그램 초기화 기능에 많이 활용됩니다.

(function init() {
  // 프로그램이 실행 될 때 기본적으로 동작할 코드들..
})();

혹은 재사용이 필요 없는, 일회성 동작을 구성할 때 활용하기도 하는데요.

const firstName = 'Young';
const lastName = 'Kang';

const greetingMessage = (function () {
  const fullName = `${firstName} ${lastName} `;

  return `Hi! My name is ${fullName}`;
})();

함수의 리턴값을 바로 변수에 할당하고 싶을 때 활용
즉시 실행 함수에서 사용하는 변수들은 함수 내에서만 유효하기 때문에 이런 점을 활용하면, 일시적으로 사용할 변수의 이름들을 조금 자유롭게 작성할 수도 있다는 점