[JavaScript] 함수 정의 방법 3가지

Rachaen·2023년 1월 2일
0

함수?

  • 반복될 수 있는 작업을 정의해두는 것
  • input을 받아 output을 반환 return 하는 것
function 함수명 (입력값) {
  // 수행할 일
  return 반환값 // 있을 시
}

함수명(입력값);

1. 함수 선언

  • 호이스팅 됨(호이스팅? 인터프리터가 변수와 함수의 메모리 공간을 선언 전에 미리 할당하는 것)
function add(x, y) {
	return x + y;
}

console.log(add(2, 7));

2. 상수나 변수에 함수 대입

  • 함수는 객체, 객체는 값 => 변수 선언, 재정의 가능
  • 호이스팅 되지 않음
const subt = function (x, y) {
  return x - y;
}

console.log(subt(7, 2));
function add (x, y) {
  return x + y;
}

console.log(add(2, 7));
// 💡 기존의 함수를 재정의하는것도 가능
add = function (x, y) {
  console.log(`${x}${y}를 더합니다.`);
  console.log(`결과는 ${x + y}입니다.`);
  return x + y;
}

console.log(add(2, 7));

3. 화살표 함수

  • 인자를 받고 값을 반환하는 용도로 많이 사용
  • 블록 없는 화살표 함수에는 return문 필요 없음
  • 호이스팅 되지 않음
// 한 줄 안에 값만 반환시
const mult = (x, y) => x * y;
console.log(mult(2, 7));

// 두 줄 이상의 작업이 있을 시 블록으로 감싸주기
const mult = (x, y) => {
  console.log(`${x}${y}를 곱합니다.`);
  console.log(`결과는 ${x * y}입니다.`);
  return x * y;
};
console.log(mult(2, 7));

// 인자가 하나일 때는 괄호 없이 선언 가능
const pow = x => x ** 2;
console.log(pow(3));
  • 화살표 함수는 function 함수와 기능이 완전히 같지는 않음...! (나중에 정리해보자..)

얄코
profile
개발을 잘하자!

0개의 댓글