20210818-TIL

노강표 Noh Gang Pyo ·2021년 8월 19일

모던자바스크립트 딥다이브

함수와 일급 객체

다음 조건을 만족하는 객체를 일급객체라 한다.
1. 무명의 리터럴로 생성 할 수있는가.
2. 변수나 자료구조(객체,배열)에 저장 할 수 있는가.
3. 함수의 매개변수에 전달할 수있는가.
4. 함수의 반환값으로 사용할 수 있는가.

자바스크립트 함수는 위의 조건을 모두 만족함으로 일급객체로 취급한다.
함수가 일급객체라는것은 함수를 객체와 동일하게 사용할 수있다는 의미인데, 객체는 값이므로 함수를 값과 동일하게 취급 할 수있다.

함수 객체의 프로퍼티

함수도 객체로 취급하기떄문에 프로퍼티가 존재한다.
객체 내부의 프로퍼티를 보여주는 코드를 작성해보면

function square(number) {
 return number*number; 
}

console.dir(square); // 객체내부의 프로퍼티를 보여줌.

arguments 프로퍼티

arguments프로퍼티의 값은 argumnets 객체다.
argumentsr객체는 함수 호출시 전달된 인수들의 정보를 담고있고, 함수 내부에서 지역 변수처럼 사용되며 함수 외부에선 참조할 수없다. arguments객체는 선언된 매개변수의 개수와 함수를 호출할 떄 전달하는 인수의 개수를 확인하지않는 자바스크립트의 특성떄문에 함수가 호출될떄 인수개수를 확인하고 이에따라 함수의 동작을 달리 정의할 필요할떄 사용된다.

caller 프로퍼티

caller 프로퍼티의 값은 함수 자신을 호출한 함수를 가리킨다.

length 프로퍼티

함수를 정의할떄 선언한 매개변수의 개수를 가리킨다.
이떄 주의할점은 arguments객체의 length프로퍼티와 함수 객체의 length프로퍼티의 값은 다를 수있다. arguments객체의 length프로퍼티는 인자의 개수를 가리키고, 함수 객체의 length 프로퍼티는 매개변수의 개수를 가리킨다.

name 프로퍼티

name프로퍼티는 ES5와 ES6에서 다르게동작하는데,익명 함수 표현식의 경우 ES5에서 name 프로퍼티는 빈 문자열을 값으로 갖는다. 하지만 ES6에서는 함수 객체를 가리키는 식별자를 값으로 갖는다.

//기명 함수 표현식
let namedFunc = function foo() {};
console.log(namedFunc.name); // foo

//익명함수 표현식
let anonymousFunc = function () {};
// ES5 : name 프로퍼티는 빈 문자열을 값으로 갖는다.
// ES6 : name 프로퍼티는 함수 객체를 가리키는 변수 이름을값으로 갖는다.
console.log(anonymousFunc.name); // anonymousFunc