[DAY8] 함수의 종류와 특징

m1njae·2022년 1월 10일

22 Basic Challenge

목록 보기

8/25

JavaScript 함수의 종류

일반 함수

우리가 알고 있는 함수의 기본적인 모습이며, function 키워드를 사용하는 것이 일반적인 함수이다. 일반 함수는 JavaScript가 처음 읽힐 당시에 해석이 되므로 함수가 쓰여진 위치가 상관이 없다. 이를 호이스팅(Hoisting)이라고 한다.

Hoisting이란, 함수 안에 있는 선언들을 모두 끌어올려서 해당 함수 유효 범위의 최상단에 선언하는 것 같은 현상을 말한다.

호이스팅의 자세한 내용은 링크 참고.

Hello(); 		// "hello world!" 가 정상적으로 출력됨.

function Hello(){
  console.log("hello world!");
}

Hello(); // "hello world!" 가 정상적으로 출력됨.

// 호이스팅 된 모습
//
//  function Hello(){      <- 함수 선언이 먼저 일어나고,
//   console.log("hello world!");
// }
//
// Hello(); <- 첫 번째 Hello();
// Hello(); <- 두 번재 Hello();

익명 함수

재사용 하지 않는, 한번만 사용할 함수를 위한 개념으로, 따로 함수의 이름을 갖지 않는다. 리터럴(Literal) 방식으로 변수에 저장해 사용하는 함수이다.

리터럴(Literal) 방식이란 "문자 그대로 읽는 방식"을 의미하며, 변수에 데이터를 저장할 때 사용하는 방식이 리터럴 방식이다.

리터럴 방식으로 선언한 익명 함수는 변수에 저장이 된다. 이 방식으로 저장된 함수의 경우에는 호이스팅 시 함수를 담는 변수의 선언부만 위로 올라가고, 익명 함수 자체는 변수가 호출되었을 때 실행되기 때문에 선언부가 호출 위치보다 위에 있어야 한다.

Hello();  // Error

var Hello = function(){
  console.log("hello world!");
}

Hello(); 

// javascript가 코드를 읽는 방식
//
// var Hello();        var 변수 선언
//
//  Hello(); <- 첫 번째 Hello();   초기화가 진행되지 않은 상황
//
// Hello = function(){      
//   console.log("hello world!");    함수 표현식
// }
//
// 
// Hello(); <- 두 번재 Hello();  초기화가 진행되었으니 원래대로면 정상 출력 가능

콜백(callback) 함수

콜백(callback)함수란, 다른 함수의 인자로써 이용되는 함수이며, 어떤 이벤트에 의해 호출되는 함수이다.


var Hello = function(){
  console.log("hello world!");
}

function slowfunc(callback){
  callback();
}

slowfunc(Hello);  // hello world!가 출력

다른 함수의 인자로써 이용되는 함수의 관점으로서 살펴보자면, Hello를 slowfunc함수의 매개변수로서 전달하므로 Hello함수는 콜백(callback)함수라고 할 수 있다.

컴퓨터에서 이벤트는 '어떤 상황이 발생했다'고 이해해도 좋다. 스마트폰에서 앱을 클릭하는 것도 이벤트이고, 케이블을 연결하는 것, 홈페이지를 클릭하는 것 등등 모두 이벤트라고 할 수 있다.
예를 들어 홈페이지 주소를 클릭하면 '반갑습니다'가 표시된다고 가정하고 코드를 확인해보자.

function HomepageClick(){
  console.log('반갑습니다.');
}

// 홈페이지 주소를 클릭할 때, 전달된 HompageClick이 실행된다고 가정
LinkInHompage(HomepageClick);

LinkInHomepage()로 설정된 함수가 홈페이지 주소를 클릭할 때마다 호출되므로, HomepageClick()은 이벤트에 의해 호출되는 함수 즉, 콜백(callback)함수라고 할 수 있다.

JavaScript 함수의 특징

JavaScript에서 함수는 값이다. JavaScript 함수는 객체이기 때문에 변수에 할당할 수 있고, 함수의 매개변수로 넘겨줄 수 있다.

백준 문제 풀이

4673번

내가 작성한 코드

function d(n){
    let StringNumber = String(n);
    let result = 0;                    
    for(let i = 0; i < StringNumber.length; i++){
        result += Number(StringNumber[i]);
    }
    return Number(StringNumber)+result;
}


let selfNumbers = Array(10001).fill(true);

for (let i = 1; i <= 10000; i++) {
    selfNumbers[d(i)] = false;
}

for (let i = 1; i <= 10000; i++) {
    if (selfNumbers[i]) {
        console.log(i);
    }
}

0~10000의 범위에 true로 채워넣어 반복문을 돌린다. 이때 d(n)값은 false로 값을 변경하여 selfNumbers 배열에 셀프넘버 값만 true가 되도록 생각해내는 것이 오래 걸렸다.

1065번

내가 작성한 코드

let fs = require('fs');
let input = fs.readFileSync('/dev/stdin').toString();
let num = Number(input);

function hansu(n){
    let count = 0;
    for(let i = 1; i <= n; i++){
        if ( i < 100){
            count += 1;
        }else{
            let StringNumber = String(i);
            if ((Number(StringNumber[2])-Number(StringNumber[1]))=== (Number(StringNumber[1])-Number(StringNumber[0]))){
                count +=1;
            }
        }
    }
    return count;   
}

console.log(hansu(num));

문제에서 요구하는 사항을 직관적으로 풀었다.

정리 및 느낀 점

'이해하는 것'과 '익숙한 것'은 다르다. 포스팅으로 그날 공부한 내용을 정리해도 100% 완벽히 알고 있다고 말할 수는 없다. 하지만 자주 노출을 시키면서 익숙해진다면 온전한 나의 지식으로 받아들일 수 있지 않을까라는 생각이다. 이미 실력이 뛰어난 사람들을 부러워하기보다는 지금 내가 할 수 있는 것을 열심히 해야겠다!