JavaScript기초(15)_함수(1)

1. function hello() { } : 선언적  function

함수의 표현방식은 크게 3가지가 있다.

- 선억적 function 표현 방식 

- 익명 함수를 만들어 변수에 할당하는 표현 방식  

- 생성자 함수로 함수를 만드는 방식

 

이번 게시물은 선언적 function 표현 방식을 다루도록 한다.

function hello () {
    console.log('hello!');
}

console.log(hello, typeof hello);

아래는 위 코드에 대한 결과 값이다. 

[Running]
[Function: hello] function

위와 같은 코드로 출력을 하면 hello라는 함수와 함수 hello의 타입이 function 임이 출력된다.

함수 hello의 hello! 가 출력되는 것은 아니다. 

왜냐하면 console.log(hello); 는 함수 hello 자체를 나타내는 구문이기 때문이다. 

 

2. 함수의 결과 값 나타내기 

위에서는 hello 함수의 결과 값인 hello! 를 나타내지 못하였다.

그런 아쉬움을 달래기 위해 함수 결과 값을 나타낼 수 있는 두 가지 방식을 소개한다. 특별한 건 없다.

함수의 매개변수를 사용한 건 덤이다.

function hello2 (name ) {
    console.log('hello2!', name);
}

hello2('Kim');

[Running]
hello2! Kim

함수 hello2는 'name'이라는 이름을 가진 매개변수를 가진 함수이며 'hello2! [매개 변숫값]'을 출력하는 함수이다.

 

hello2와 똑같은 함수 hello3을 다음과 같이 만들어보았다.

function hello3 (name) {
    return `hello3! ${name}`;
}

console.log(hello3('Kim'));

[Running]
hello3! Kim

함수 hello3는 'name'이라는 이름을 가진 매개변수를 가진 함수이며 'hello3! [매개 변수 값]'을 호출하는 함수이다.

또한 백틱(`(키보드상 ₩))을 이용한 표현식을 썼다.

 

hello2와 hello3는 같은 함수 같지만 엄연히 다른 함수이다. 

hello2 자체에는 출력하는 기능(console.log)이 있고 hello3는 값을 호출할 뿐, 출력하는 기능은 없다. 

그래서 hello2의 경우 함수를 호출하는 것만으로 출력이 되었고

hello3의 경우 이후에 따로 console.log로 출력했다.