ABOUT ME

-

Today
-
Yesterday
-
Total
-
  • 자바스크립트의 함수 알아보기 - 1
    개발/자바스크립트로의 깊은 잠수 2026. 4. 29. 21:30

    자바스크립트도, 여타 프로그래밍 언어들과 마찬가지로 함수를 가지고 있습니다.

    자바스크립트 함수의 주요한 특징들을 나열하면서, 궁금한 점들을 하나씩 알아보려 합니다.

     

    함수의 본질적 특성

    수학에서 함수라는 것은 입력을 받으면 출력을 하는 일련의 과정을 정의한 것입니다.

    자바스크립트에서도 이와 비슷하게 동작합니다. 인수를 받아서 결과값을 반환합니다.

    그리고 함수의 시작에서부터 결과값이 반환되기까지 그 사이에 있는 코드들을 실행합니다.

    그리고 함수는 한번 정의해 놓으면 여러 번 호출해서 사용할 수 있습니다.

     

    순수함수가 좋은 이유

    순수함수라고 하면, 부수효과(side effect)가 없는, 같은 값을 넣으면 항상 같은 결과가 출력되며 외부의 상태가 변경되지 않는 함수를 가리킵니다.

    개발자로 일하다 보면 "순수함수를 써야 한다"같은 얘기를 듣게 됩니다. 왜 그런 걸까요?

     

    위에서 본 함수의 본질적 특성에 따르면, 함수란 녀석은 보통 여러번 쓰기 위해 정의하는 녀석입니다.

    그런데 사용할 때마다 결과가 달라지는 함수라면 코드의 결과를 예측하기 어렵겠죠.

    결과를 예측하기 위해 매번 그 함수 내부를 들여다보며 관련된 코드를 읽어야 할 겁니다.

    반면 순수함수는, 그 함수 내부에서 무슨 동작을 하는지 신경쓰지 않아도 결과를 예측할 수 있습니다.

    그러면 나중에 코드를 읽을 때, 매번 들여다보지 않아도 술술 읽어내려갈 수 있겠죠.

    그래서 순수함수로 만들 수 있으면 순수함수로 만드는 게 좋다고 하는 겁니다.

     

    한번에 하나의 일만 하는 함수가 좋은 이유

    함수가 한번에 하나의 일만 하면 일단 예측이 쉽습니다.

    함수에는 이름을 붙여야 합니다. 그래야 호출할 수 있으니까요.

    함수 이름이 "processUser()"라면, 함수 이름만 가지고 그 함수가 유저를 어떻게 처리하는지 예측할 수 있는 사람은 없을 겁니다.

    반면 "validateUser()", "saveUser()" 같은 함수는 이름을 봤을때 대략 어떤 일을 할지 예측할 수 있습니다.

     

    또한 버그가 발생했다든지 하는 여러 이유로 코드를 수정할 일이 생겼을 때, 수정할 부분을 찾기가 쉽습니다.

    위에서 봤듯 함수 이름만 봐도 어느 정도 함수가 하는 역할을 파악할 수 있기 때문에, 코드에서 수정하지 않아도 되는 부분을 슉슉 제외할 수 있어요. 모든 라인을 읽을 필요가 없는거죠.

     

    매개변수와 인수의 차이

    정의할 때는 매개변수(parameter)라고 부르며, 호출할 때는 인수(argument)라고 부릅니다.

     

    function greet(name) { // <- name은 매개변수입니다
      console.log('Hello, ' + name);
    }
    
    greet('John'); // <- 'John'은 인수입니다

     

    실제로도 매개변수에 정의된 식별자는 함수 내에서 변수처럼 쓰일 수 있습니다.

     

    함수는 선언한 위치에 따라 "함수 선언문"이 될 수도 있고 "함수 리터럴 표현식"이 될 수도 있다

    자바스크립트 엔진이 코드를 해석하는 문맥에 따라 함수 선언문 또는 함수 리터럴 표현식이 될 수 있습니다.

    예를 들어 함수가 단독으로 작성되어 있으면 함수 선언문으로 해석됩니다.

    function foo() {}


    하지만 함수가 변수에 할당되거나, 괄호 안에 들어가거나, 다른 표현식의 일부로 사용되면 함수 리터럴 표현식으로 해석됩니다.

    const foo = function () {};
    
    (function foo() {});


    즉, 같은 function 키워드를 사용하더라도 코드가 놓인 위치와 문맥에 따라 자바스크립트 엔진은 이를 다르게 해석합니다.

     

    자바스크립트에서 함수는 함수 이름으로 호출하는 것이 아니라, 함수 객체를 가리키는 식별자로 호출한다

    자바스크립트에서 함수 이름은 함수 몸체 내부에서 자기 자신을 참조할 때만 사용됩니다.
    실제로 함수를 호출할 때는 함수 객체가 할당된 식별자를 사용합니다.

    const foo = function bar() {
      console.log("hello");
    };
    
    foo(); // 가능
    bar(); // ReferenceError


    위 예시에서 함수 이름은 bar이지만, 함수 객체를 가리키는 식별자는 foo입니다.
    따라서 외부에서는 foo()로 호출해야 합니다.

    댓글

Copyright 2022. ProdYou All rights reserved.