[부스트코스] JavaScript -FE(3)

오늘은 JavaScript의 함수에 대해 알아보도록 하겠습니다 :)

 

 

함수 선언

function printName(firstname) {
    var myname = "jisu";
    return myname + " " +  firstname;
}

위와 같이 function 함수이름(인자){내용} 으로 선언하면 됩니다.

위의 예제를 보면 의문점이 하나 있습니다. 

바로 firstname이 정의되지 않은 것인데요. 이 함수를 호출하면 어떻게 될까요?

 

결과는 jisu undefined 라고 나오게 됩니다. 따로 오류가 나지 않는다는 특징이 있습니다.

undefined는 선언은 됐지만 할당되지 않는 변수에 대해 출력되는 값입니다.

 

 

함수 표현식

function test() { 
    console.log(printName()); 
    var printName = function() {
        return 'anonymouse';
    }
}

test();

변수 값에 함수 표현식을 담아놓은 형태입니다.

내부 함수가 실행한 후에 test 함수가 실행됩니다.

다른 말로 하면, printName에 해당하는 변수값이 먼저 정해진 후에 test라는 함수가 실행되었다는 것입니다.

자바스크립트 함수는 실행되기전 함수 안의 필요한 변수값을 모두 선언합니다. 

이러한 특징을 hoisting이라고 합니다.

 

 

함수 반환값

 

함수의 반환값은 return에 해당하는 값입니다.

return이 없을 경우엔 undefined가 반환됩니다.

 

 

arguments 객체

 

자바스크립트 함수가 실행될때 객체 타입의 지역변수가 자동으로 생성됩니다. 

이것이 바로 arguments입니다. 이러한 arguments를 배열 형태로 하나씩 접근할 수 있습니다.

하지만, arguments는 배열 타입은 아니기 때문에 배열 메서드는 사용 불가합니다.

 

 

+arrow function

function getName(name) {
   return "Kim " + name ;
}

//위 함수는 아래 arrow함수와 같다.
var getName = (name) => "Kim " + name;

 

변수의 형태처럼 함수를 선언할 수 있기 때문에 간단하게 사용할 수 있습니다.

다른 언어와는 차별화 된 함수 선언 방식이지만, 간결성 덕분에 많이 사용되고 있습니다.

 

[출처: https://www.edwith.org/boostcourse-web/lecture/16695/]