자바스크립트 함수

표현식 vs 선언식

const add = function(a, b) { return a + b; }; //표현
function add(a, b) { return a + b; } //선언

console.log(add(2, 3));  // 5

함수 표현식 vs 함수 선언문

함수는 표현과 선언 2가지 방식으로 정의할 수 있다.

두 방식의 차이는 호이스팅 여부이다.

 

 

 

화살표 함수

function add(a, b) { return a + b; }

const add = (a, b) => { a + b; };

또한 이를 간략화 한 화살표 함수가 존재한다.

함수명이 없으며 내용이 한줄 표현식이면 return도 생략 가능하다.

 

 

this와 화살표 함수

화살표 함수는 this나 argument에 대해 자체 바인딩이 없어

객체의 methods로 사용해선 안된다.

 

하지만 자체 scope가 없어 무조건 this가 전역 객체를 가리키는 일반 함수와 달리

자신을 호출한 객체로부터 this를 상속받기 때문에 메서드 내부 함수는 되려 화살표 함수를 쓰는게 좋다.

자세한건 해당 글 참조

 

 

Arguments

function copyArguments() {
  const argsArray = [...arguments];
  return argsArray;
}

const copiedArgs = copyArguments(1, 'hello', true);
console.log(copiedArgs);  // [1, 'hello', true]

js 함수는 매개 변수와 인자 개수가 달라도 오류가 발생하지 않는다.

함수가 받은 매개 변수는 arguments에 저장되며 

arguments는 arguments[1]로 접근하거나 length를 사용하는 등 배열처럼 사용 가능하지만

배열은 아니기에 indexOf 등을 사용하면 오류가 발생한다.

그렇기에 산개 연산자 등으로 배열로 복사해줘야한다.

 

function copyArguments(...args) {
  return args
}

그냥 매개변수에서 args로 정의하는게 편하다.

 

function copyArgs(a,b, ...others) {
  return [a+b, ...others]
}

console.log(copyArgs(1,2,3,4)); //[3,3,4]

매개 변수에서 나머지 인자를 others 배열로 관리도 가능하다

 

 

 

디폴트 매개변수

function greet(name = 'Guest', message = 'Hello') {
  console.log(`${message}, ${name}!`);
}

greet();                    // "Hello, Guest!"
greet('Alice');             // "Hello, Alice!"
greet('Bob', 'Hi there');   // "Hi there, Bob!"

매개변수에 인자가 할당되지 않을때 디폴트로 들어갈 값을 지정할 수 있다.