JS 일급객체란?
마침내 일급객체에 대해 배우게 되면서, 이 부분은 정리를 해보고자 한다.
일급객체(First-class Object)란?
다른 객체들에 일반적으로 적용 가능한 연산을 모두 지원하는 객체를 가리킨다.
JS 에서는 함수가 일급객체에 해당한다.
5가지 사례가 있으니 코드로 정리해보았다.
- 변수에 함수를 할당하는 경우
1
2
3
4
5
6
7
// 1. 변수에 함수를 할당
let sayHello = function () {
console.log("Hello");
};
sayHello(); // "Hello"
- 함수를 다른 함수의 인자로써 사용
1
2
3
4
5
6
7
// 2. 함수를 다른 함수의 인자로써 사용
let sayHello = function () {
console.log("Hello");
};
sayHello(); // "Hello"
- 함수를 반환하는 경우
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
// 3. 함수를 반환하는 경우
function createAdder(num) {
return function (x) {
return x + num;
};
}
const addFive = createAdder(5);
// 위처럼 쓰게되면, 아래과 같아진다. 오류 때문에 이름 뒤에 2 붙임.
const addFive2 = function (x) {
return x + 5;
};
console.log(addFive(10));
// 이제 addFive 에 인수를 넣으면
return 10 + 5;
// 가 되어 addFive(10) 은 15 가 나온다.
추가로, 그냥 console.log(createAdder(5))
를 해봤더니 결과로는 [Function (anonymous)]
가 나왔다. createAdder
가 반환하는 함수가 맞는지 제대로 확인해보고 싶어 이름을 붙여보려고 했는데, 오류가 발생했다. 익명함수만 사용가능한 건가?.
- 객체 내에서 사용되는 경우
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
// 4. 객체의 속성 사용되는 경우
const person = {
name: "kim",
age: "30",
money: 0,
isMarried: false,
greeting: function () {
console.log(`Hi, I'm ${this.name}`); // ${} : template literal
},
getMoney: (x) => {
console.log(`${this.name} get ${x}, now have ${this.money}`); // 왜 안될까? -> arrow func 는 this 를 binding 하지 않는다고 한다. function keyword 를 썼을 때와 차이점.
},
getMoney: function (x) {
this.money += x; // 이것도 사실 0 으로 계속 초기화된다.
console.log(`${this.name} get ${x}, now have ${this.money}`);
}
};
person.greeting();
person.getMoney(100);
- 배열의 요소로 함수를 할당하는 경우
1
2
3
4
5
6
7
8
9
10
11
12
// 5. 배열의 요소로 함수를 할당
const myArr = [
function (a, b) {
return a + b;
},
function (a, b) {
return a - b;
}
];
console.log(myArr[0](1, 3), myArr[1](1, 3)); // 4, -2
이렇게 5가지를 다루어 보았다.
일반 객체를 생각하면 이해하기 쉬울 것이다!
This post is licensed under CC BY 4.0 by the author.