모던 자바스크립트 Deep Dive - 12장

박상은·2021년 9월 29일
0

요약

1. 함수

함수란 입력값을 받아서 출력값을 내보내는 과정을 정의한 것을 의미한다.
함수란 일련의 과정을 문으로 구현하고 코드블럭으로 감싸서 하나의 실행 단위로 정의한 것이다.

  • 매개변수: 입력을 전달받는 변수
  • 인수: 함수내에서 사용하는 입력변수
  • 반환값: 함수가 반환하는 결과값

2. 함수정의방법

  1. 함수선언문
  2. 함수표현식
  3. 생성자함수
  4. 화살표함수
// 함수선언문
function testFunc(x, y){ return x + y; }

// 함수표현식
const testFunc = function(x, y){ return x + y; };

// 생성자함수
const testFunc = new Function("x", "y", "return x + y");

// 화살표함수
const testFunc = (x, y) => x + y;

2.1 함수호출

함수이름은 함수몸체내부에서만 참조할 수 있는 식별자이다.
그러면 우린 어떻게 함수이름으로 함수를 호출할 수 있는지 알아보자

function add(x, y){
  // add()는 여기서만 유효한 식별자임
  return x + y;
}

// 하지만 밖에서 호출이 가능함
add(1, 2);	// 3

그 이유는 자바스크립트엔진이 내부적으로 함수이름과 동일한 변수를 생성하고 함수의 주소값을 넣어주기 때문이다.

// 이런 형태로 엔진이 바꿔주기때문에 외부에서도 호출이 가능한 것
let add = function add(x, y){
  return x + y;
}

2.2 함수선언문과 함수표현식

함수선언문은 기본적으로 표현식이 아닌 문이다.
그 말은 값이 아닌 문 즉, 변수에 대입할 수 없는 의미이다.
하지만 함수선언문함수표현식은 형태를 구별할 수 없을 정도로 비슷하게 생겼는데 엔진이 어떻게 구별할까
이것은 엔진이 코드의 문맥에 따라 다르게 평가하기 때문이다.

// 함수선언문
function foo() { console.log("foo"); }

// 함수표현식
(function bar() { console.log("bar"); })
10 + 20;  // 이런 느낌이랑 비슷... 30이라는 결과는 나오지만 30을 저장하는 변수가 없어서 결과값을 사용할 수 없음

foo();	// foo
bar();	// error

foo()2.1 함수호출에서 말했듯이 엔진이 생성한 foo변수를 이용해서 접근이 가능하지만,
bar()는 함수표현식임에도 불구하고 외부에서 저장한 변수가 없으므로 내부에서만 접근가능함, 즉 외부에서는 함수에 접근할 수 있는 방법이 없게 됩니다.

3. 함수들

3.1 순수함수와 비순수함수

순수함수는 외부상태에 의존하지 않고, 외부상태를 변경하지도 않는 함수를 의미한다

3.2 재귀함수

자기자신을 호출하는 함수

3.3 중첩함수

함수내부에서 정의된 함수

3.4 콜백함수

함수의 매개변수를 통해 전달되는 함수

3.5 고차함수

함수를 인수로 받거나 반환하는 함수

마무리

  • 함수를 정의할 때는 매개변수 최대한 적게

0개의 댓글