Skip to content

Commit 1d29b45

Browse files
author
Nara Shin
committed
[18장] 함수와 일급객체
1 parent 983896d commit 1d29b45

File tree

1 file changed

+1
-172
lines changed

1 file changed

+1
-172
lines changed
+1-172
Original file line numberDiff line numberDiff line change
@@ -1,172 +1 @@
1-
## 일급객체
2-
3-
자바스크립트의 함수는 일급 객체이다!
4-
5-
1. 무명의 리터럴로 생성할 수 있으므로 런타임에 생성이 가능하다.
6-
2. 변수나 자료구조(객체, 배열 등)에 저장할 수 있다.
7-
3. 함수의 매개변수에 전달할 수 있다
8-
4. 함수의 반환값으로 사용할 수 있다.
9-
10-
```jsx
11-
//1. 함수는 무명의 리터럴로 생성 가능
12-
//2. 함수는 변수에 저장할 수 있다.
13-
const increase = function (num) {
14-
return ++num;
15-
}
16-
const decrease = function (num) {
17-
return --num;
18-
}
19-
20-
//2. 함수는 객체에 저장할 수 있다
21-
const auxs = { increase, decrease };
22-
23-
//3. 함수는 매개변수에 전달할 수 있다.
24-
//4. 함수는 함수의 반환 값으로 사용할 수 있다.
25-
function makeCouner(aux){
26-
let num = 0;
27-
return function() {
28-
num = aux(num);
29-
return num;
30-
}
31-
}
32-
33-
const increaser = makeCounter(auxs.increase);
34-
```
35-
36-
- 함수와 객체의 차이점
37-
38-
함수=일급객체 → 함수를 객체와 동일하게 사용할 수 있다.
39-
40-
but 일반 객체는 호출할 수 없지만 함수 객체는 호출할 수 없다!
41-
42-
함수 객체는 일반 객체에는 없는 함수 고유의 프로퍼티를 소유한다.
43-
44-
45-
## 함수 객체의 프로퍼티
46-
47-
함수도 객체이므로 프로퍼티를 가질 수 있다
48-
49-
![스크린샷 2022-12-15 오후 2.19.03.png](https://s3-us-west-2.amazonaws.com/secure.notion-static.com/58cf7cca-caea-4733-8be0-46ecfd0eda85/%E1%84%89%E1%85%B3%E1%84%8F%E1%85%B3%E1%84%85%E1%85%B5%E1%86%AB%E1%84%89%E1%85%A3%E1%86%BA_2022-12-15_%E1%84%8B%E1%85%A9%E1%84%92%E1%85%AE_2.19.03.png)
50-
51-
![스크린샷 2022-12-15 오후 2.19.48.png](https://s3-us-west-2.amazonaws.com/secure.notion-static.com/a72b7728-5483-4a60-bb09-6c421fc491e0/%E1%84%89%E1%85%B3%E1%84%8F%E1%85%B3%E1%84%85%E1%85%B5%E1%86%AB%E1%84%89%E1%85%A3%E1%86%BA_2022-12-15_%E1%84%8B%E1%85%A9%E1%84%92%E1%85%AE_2.19.48.png)
52-
53-
- arguments
54-
55-
프로퍼티의 값은 arguments 객체
56-
57-
- 함수 호출시 전달된 인수(argument)의 정보를 담고 있는 순회 가능한 유사배열객체
58-
- 함수 내부에서 지역 변수처럼 사용된다
59-
- 함수 외부에서 참조할 수 없다.
60-
61-
![스크린샷 2022-12-15 오후 2.23.29.png](https://s3-us-west-2.amazonaws.com/secure.notion-static.com/d7ca1f94-6c1b-45e6-9060-67b0ed07458b/%E1%84%89%E1%85%B3%E1%84%8F%E1%85%B3%E1%84%85%E1%85%B5%E1%86%AB%E1%84%89%E1%85%A3%E1%86%BA_2022-12-15_%E1%84%8B%E1%85%A9%E1%84%92%E1%85%AE_2.23.29.png)
62-
63-
- 인수를 프로퍼티 값으로 소유, 키는 인수의 순서
64-
- callee: 함수 자신
65-
- length: 인수의 개수
66-
67-
함수가 호출되면 함수 몸체 내에서 암묵적으로 매개변수가 선언되고 undefined로 초기화된 이후 인수가 할당됨
68-
69-
선언된 매개변수의 개수보다 인수를 적게 전달했을 경우, 인수가 전달되지 않은 매개변수는 undefined로 초기화된 상태 유지, 매개변수의 개수보다 인수를 더 많이 전달할 경우 초과된 인수는 무시됨(버려지지 않고, 프로퍼티로 보관된다)
70-
71-
72-
매개 변수 개수를 확정할 수 없는 가변인자 함수를 구현할 때 유용
73-
74-
```jsx
75-
function sum(){
76-
let res = 0;
77-
78-
for(let i = 0; i < arguments.length; i++){
79-
res += arguments[i];
80-
}
81-
return res;
82-
}
83-
84-
console.log(sum(1,2,3)); //6
85-
```
86-
87-
유사배열 객체 → length프로퍼티를 가진 객체, for문으로 순회 가능 but 배열이 아니므로 배열 메서드 사용시 에러가 발생
88-
89-
`Function.prototype.call`, `Function.prototype.apply` 간접 호출
90-
91-
⇒ rest 파라미터(ES6 도입)
92-
93-
```jsx
94-
function sum(...args) {
95-
return args.reduce((pre, cur) => pre + cur, 0);
96-
}
97-
console.log(1,2,3); //6
98-
```
99-
100-
- caller
101-
102-
ECMAScript 사양에 포함되지 않은 비표준 프로퍼티
103-
104-
함수 자신을 호출한 함수를 가리킨다
105-
106-
```jsx
107-
function foo(func) {
108-
return func();
109-
}
110-
111-
function bar(){
112-
return bar.caller
113-
}
114-
115-
console.log(foo(bar)); //function foo(func){...}
116-
console.log(bar()); //null
117-
```
118-
119-
- length
120-
121-
함수를 정의할 때 선언한 매개변수의 개수를 가리킨다.
122-
123-
```jsx
124-
function foo() {}
125-
console.log(foo.length); //0
126-
127-
function bar(x) {
128-
return x;
129-
}
130-
console.log(bar.length); //1
131-
```
132-
133-
<aside>
134-
🚨 arguments객체의 length 프로퍼티의 값과 다를 수 있다.
135-
arguments 객체의 length 프로퍼티 - 인자(aragument)의 개수
136-
함수 객체의 length 프로퍼티 - 매개변수(parameter)의 개수
137-
138-
</aside>
139-
140-
- name
141-
142-
함수 이름을 나타내는 프로퍼티
143-
144-
```jsx
145-
//기명함수 표현식
146-
var namedFunc = function foo() {};
147-
console.log(nameFunc.name); //foo
148-
149-
//익명함수 표현식
150-
var anonymousFunc = function() {};
151-
//ES5: name 프로퍼티는 빈 문자열을 값으로 갖는다.
152-
//ES6: name 프로퍼티는 함수 객체를 가리키는 변수 이름을 값으로 갖는다.
153-
console.log(anonymousFunc.name); //anonymousFunc
154-
155-
//함수 선언문
156-
function bar() {}
157-
console.log(bar.name); //bar
158-
```
159-
160-
- __proto__
161-
162-
내부슬롯(Prototype)이 가리키는 프로토타입 객체에 접근하기 위해 사용하는 접근자 프로퍼티
163-
164-
모든 객체는 [[Prototype]]이라는 내부 슬롯을 가진다 → 객체 지향 프로그래밍의 상속을 구현하는 프로토타입 객체
165-
166-
- prototype
167-
168-
생성자 함수로 호출할 수 있는 함수 객체인 constructor만이 소유하는 프로퍼티
169-
170-
![스크린샷 2022-12-15 오후 3.41.28.png](https://s3-us-west-2.amazonaws.com/secure.notion-static.com/32652a21-6258-4dc9-aad7-e2cc730fa9a6/%E1%84%89%E1%85%B3%E1%84%8F%E1%85%B3%E1%84%85%E1%85%B5%E1%86%AB%E1%84%89%E1%85%A3%E1%86%BA_2022-12-15_%E1%84%8B%E1%85%A9%E1%84%92%E1%85%AE_3.41.28.png)
171-
172-
prototype 프로퍼티는 함수가 객체를 생성하는 함수로 호출될 때 생성자 함수가 생성할 인스턴스의 프로토타입 객체를 가리킨다.
1+
[함수와 일급객체 정리](https://arannhs.notion.site/18-8b6c4092a4d84a8ebe591b910da3812f)

0 commit comments

Comments
 (0)