16. 함수 표현식

Chipmunk_jeong·2021년 2월 23일
0

TIL

목록 보기
16/62
post-thumbnail

함수는 자바스크립트에서 값으로 취급이 된다.
그래서 함수또한 변수에 할당 및 복사가 가능하다.

아래의 코드는 변수에 함수를 할당한다.

let hello = function() {
  console.log('hello');
}

함수는 값이고, 변수에 할당할 수 있다.
함수를 만들고 그 함수를 변수 hello에 할당했다.

console.log(hello);

함수 hello를 콘솔에 찍으면 안에 정의되어있는 코드들이 문자열로 변환되어 출력이 된다. 즉 함수자체도 다른 데이터들처럼 값으로 사용이 가능하다. 하지만 다른 값들과 다른점도 있다.
그것은 호출이 가능하다는 점.
하지만 이것 말고는 값이라는것은 같기 때문에 다른 값에 할 수 있는 일은 함수에도 똑같이 할 수 있다.

아래의 코드를 보며 함수도 값처럼 복사가 일어난다는 것을 알 수 있다.

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

let cloneHello = hello;

hello(); // hello
cloneHello(); // hello

함수의 표현식은 끝에 세미콜론이?

if {...}, for{...}, function temp{...}등등 중괄호를 사용하는 블럭 끝에는 ;를 사용안해도 된다.
하지만 함수 표현식은 변수에 을 할당하는 역활을 한다.
즉, 중괄호를 이요한 코드블럭을 사용하지만 이것 자체를 값으로 취급하기 때문에 일반적인 구문 끝에는 ;을 붙여주는것과 동일하게 ;를 붙여준다. 표현식이라 붙여지는게 아닌 값으로 취급되어 구문이 되기때문에 붙여주는것이 좋다.

콜백 함수(⭐️)

함수를 파라미터로 전달할때 전달되는 함수를 콜백함수라고 한다.

function zeroNum(number, ok, sorry) {
  number===0 ? ok() : sorry();
}

함수의 파라미터로 ok, sorry라는 함수를 받고,
조건에 다라 해당 파라미터를 실행시켜준다.
여기서 ok와 sorry는 함수라는 값을 받아야 된다.
이것을 콜백함수라고 한다.

익명 함수

파라미터로 함수를 넣을때 바로 생성하며 넣어줄 수 있다.
이것을 익명함수라 부르며 아래와 같다.

function zeroNum(number, ok) {
  number===0 ? ok() : console.log('no Zero');
}
zeroNum(0, function() {
  console.log('It`s Zero!');
});

매개변수로 값을 넣어줄때 그자리에서 선언을 하는것이다.
익명함수는 변수에 할당된것이 아니라서 밖에서 접근할 수는 없다.
익명함수는 그 의도에 맞게 작성및 사용이 되어야한다.
콜백함수로 넘겨주는 함수를 작성할때 많이 사용된다.

선언문 vs 표현식

  • 문법이 다르다.
  • 함수의 생성시기가 다르다
    --> 표현식은 실행 흐름이 해당 함수에 도달했을때 함수를 생성하지만 선언문은 그 전에도 호출이 된다.(호이스팅)
    이러한 이유는 자바스크립트가 실행되기전 전역에 생성된 선언문을 찾아 생성을 먼저하는 알고리즘이 있기 때문이다.
  • scope의 차이점
    --> 표현식은 해당함수를 변수에 담아 사용할 수 있다. 즉 블럭 내에서 생성되는 함수를 전역변수에 담아 블럭 밖에서도 사용이 가능하지만 선언문은 그것이 불가능하다.
profile
Web Developer

0개의 댓글