일급객체/고차함수

[일급 객체] 

 

JavaScript에도 특별한 대우를 받는 일급 객체(first-class citizen)가 있다. 대표적으로 함수.

 

 

 

⭐️특징

 

1. 변수에 할당(assignment) 할 수 있다.

2. 다른 함수의 전달인자(argument)로 전달될 수 있다.

3. 다른 함수의 결과로서 리턴될 수 있다.

 

 

• 함수를 변수에 할당할 수 있기 때문에, 함수를 배열의 요소나 객체의 속성값으로 저장할 수 있다.
• 함수를 데이터(string, number, boolean, array, object)처럼 다룰 수 있다.

 

 

 

변수에 함수를 할당하는 경우

 

const square = function (num) {
  return num * num;
};

output = square(5);
console.log(output); // --> 25

 

JavaScript에서 함수는 일급 객체이기 때문에 변수에 할당할 수 있다.

 

 

 

객체 속성의 값으로 할당하는 경우

 

const student1 = {
 name: "James";
 age: 20;
 address: function(){
  console.log("seoul")
  }
 }

 

함수는 일급 객체의 특징을 가지기 때문에 객체 속성의 값으로 할당될 수 있다.

 

 

 

---

   ⭐️⭐️⭐️중요⭐️⭐️⭐️

 

• 일급 객체의 3가지 특징을 안다.
• 함수는 변수에 저장된 데이터를 전달 인자로 받거나, 리턴 값으로 사용할 수 있다.
• 함수도 변수에 저장될 수 있기 때문에 함수를 인자로 받거나, 리턴 값으로 사용할 수 있다.

 

 

 

---

 

[고차함수(higher-order function)]

 

• 함수를 전달인자(argument)로 받을 수 있고, 함수를 리턴할 수 있는 함수다.
• 함수는 변수에 저장할 수 있고, 함수를 담은 변수를 전달인자로 받을 수 있다.
• 고차 함수에 함수를 전달인자로 전달하고, 고차 함수는 함수 자체를 리턴하면 변수에 할당하지 않고 함수를 바로 이용할 수 있다.
• '함수를 리턴하는 함수'와 '함수를 전달인자로 받는 함수' 모두, 고차 함수로 사용한다.

 

 

 

 

 

[콜백 함수(callback function)]

 

• 다른 함수(caller)의 전달인자(argument)로 전달되는 함수다.
• 콜백 함수를 전달받은 고차 함수(caller)는, 함수 내부에서 이 콜백 함수를 호출(invoke)할 수 있고,
• 조건에 따라 콜백 함수의 실행 여부를 결정할 수도 있다. 아예 호출하지 않을 수도 있고, 여러 번 실행할 수도 있다.
• 콜백 함수는 전달받은 배열의 요소를 받아 함수를 실행하고, 콜백 함수 내부의 조건에 따라 참(true) 또는 거짓(false)을 리턴해야 합니다.

 

 

 

 

 

[내장함수]

 

JavaScript에는 기본적으로 내장된 고차 함수가 있다.

그중에서 배열 메서드들 중 일부가 대표적인 고차 함수에 해당한다.

 

method: 객체에 들어 있는 함수

 

 

 

[filter]

 

배열의 각 요소에 콜백함수를 적용시켰을 때, true를 리턴하는 요소들만 모은 새로움 배열을 리턴

 

배열의 요소 중에서 특정 조건을 만족하는 요소를 걸러내는 메서드

filter는 기존 배열을 변경하지 않는다.

 

let arr = [1,2,3];

let result=
arr.filter(function(ele) {
 return ele % 2 !==2
});

result;   // [1, 2, 3]



• 배열의 각 요소가
• 특정 논리(함수)에 따르면, 사실(true)일 때
• 따로 분류합니다(filter).

 

 

 

[map]

 

배열의 각 요소에 콜백 함수를 적용시킨 새로운 배열을 리턴

 

모든 요소에게 동일한 행동을 준 값에 대하여 반환

map은 기존 배열을 변경하지 않는다.

 

let arr = [1,2,3];

let result=
arr.map(function(ele){
 return ele * 2
});

result;   // [2, 4, 6]

 

• 배열의 각 요소가
• 특정 논리(함수)에 의해
• 다른 요소로 지정(map) 됩니다.

 

 

[reduce]

 

배열의 각 요소를 콜백 함수에 맞게 하나로 응축시킨 값을 리턴

 

배열을 하나의 값으로 만들어주는 함수

초기값을 정하지 않았다면 배열의 가장 첫번째 요소를 acc, cur 은 두 번재 요소부터 시작.(이 값은 누적값의 기반이 된다.)

 

초기값x

 

let arr = [1,2,3,4,5];



arr.reduce((acc,cur) => {

  return acc + cur

})          // 초기값이 없기 때문에배열의 가장 첫번째요소인 1이 acc자리에 들어간다.

 

acc	cur	retuen값
1	2	1+2 = 3
3	3	3+3 = 6
6	4	6+4 = 10
10	5	10+5=15

 

 

초기값o

 

let arr = [1,2,3,4,5];



arr.reduce((acc,cur,3) => {

  return acc + cur

})          // 초기값이 3이기 때문에 배열의 acc자리가 3부터 시작한다.

 

acc	cur	retuen값
3	2	3+2 = 5
5	3	5+3 = 8
8	4	8+4 = 12
12	5	12+5=17

• 배열의 각 요소를
• 특정 방법(함수)에 따라
• 원하는 하나의 형태로
• 응축합니다. (reduction)

 

배열을 숫자로도 문자로도 사용 가능하다.