자바스크립트 함수

자바스크립트는 신기하게도 “함수”를 선언하는 방법이 여러가지가 있습니다. 그리고 함수 선언 방법에 따라 독특한 특징도 있습니다.

처음에는 함수 선언 방법과 특징들을 모두 하나의 포스트에 정리하려고 했지만, 함수 선언 방식에 따른 함수들의 특징들이 생각보다 많고 독특한 게 많네요…

함수 선언 방식에 따른 특징들은 다음 포스트에서 정리하고 이번에는 자바스크립트 함수 선언 방법과 몇 가지 주요한 특징들만 간략하게 정리해보았습니다.

자바스크립트 함수 선언 방법

함수 선언문 (Function Declaration)

가장 일반적인 방식입니다.

함수 이름과 매개변수를 명시하고 중괄호 {} 내에 함수의 동작을 정의합니다.

다른 언어의 함수 선언 방법과 유사합니다.

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

함수 표현식 (Function Expression)

함수를 변수에 할당하여 사용하는 방법입니다

익명 함수(이름 없는 함수)를 변수에 할당할 수 있습니다.

var multiply = function(x, y) {
  return x * y;
};

화살표 함수 (Arrow Function)

ES6부터 도입된 새로운 함수 표현 방식입니다.

화살표 함수의도적인 사용 제한이 있는 함수 표현식의 대안입니다.

화살표 함수는 다양한 형태로 선언될 수 있습니다. 그 중 하나는 아래와 같습니다.

화살표의 함수의 다른 형태는 밑의 화살표 함수 특징에 정리하였습니다

const square = (num) => {
  return num * num;
};

화살표 함수의 경우, 단일 표현식인 경우 중괄호와 return 키워드를 생략할 수 있습니다.

const square = (num) => num * num;

생성자 함수

객체를 생성하기 위해 사용되는 함수로, new 키워드와 함께 호출됩니다.

function Person(name, age) {
  this.name = name;
  this.age = age;
}

var person1 = new Person('John', 30);

자바스크립트 함수 특징

arguments 객체

자바스크립트에서 함수는 arguments 객체를 사용하여 호출된 인자에 접근할 수 있습니다.

이 객체는 함수 내에서 언제든지 사용할 수 있으며, 함수에 전달된 모든 인자를 포함합니다.

파이썬에서는 *args를 사용하지 않는 이상 선언한 매개변수의 개수에 맞게 호출해야 방식인데, 이 점에서 많이 상이합니다.

파이썬에 비해 유연한 방식으로 동작하는 것을 알 수 있습니다.

function sum() {
  let result = 0;
  for (let i = 0; i < arguments.length; i++) {
    result += arguments[i];
  }
  return result;
}

console.log(sum(1, 2, 3)); // 6

클로저

클로저 개념은 파이썬에서 정리했지만 간단하게 말하면 함수가 자신의 외부 스코프에 있는 변수를 기억하고 사용할 수 있는 것을 의미합니다.

function outer() {
  let outerArr = [];

  function inner(x) {
    outerArr.push(x)
    console.log(outerArr);
  }

  return inner;
}

let closureFunc = outer();
closureFunc(1); // [1]
closureFunc(10); // [1,10]

참고할 만한 글

Leave a Comment

목차