일급 객체

컴퓨터 프로그래밍 언어 디자인에서, 일급 객체(영어: first-class object)란 다른 객체들에 일반적으로 적용 가능한 연산을 모두 지원하는 객체를 가리킨다. 보통 함수에 매개변수로 넘기기, 수정하기, 변수에 대입하기와 같은 연산을 지원할 때 일급 객체라고 한다.
(from 나무위키)

일급 객체가 가지는 3가지 특징은 아래와 같다.

• 변수에 할당(assignment) 할 수 있다.
• 다른 함수의 인자(argument)로 전달될 수 있다.
• 다른 함수의 결과로서 리턴될 수 있다.

자바스크립트의 대표적인 일급 객체는 함수이다. 함수는 변수에 할당할 수 있으며(함수 표현식), 배열의 요소나 객체의 속성값으로 저장할 수 있다. 이는 함수를 데이터(string, number, boolean, array, object)를 다루듯이 다룰 수 있다는 것을 의미한다.

고차 함수란?

고차 함수는 함수를 인자로 전달받거나 함수를 결과로 반환하는 함수를 말한다.
고차함수는 인자로 받은 함수를 필요한 시점에 호출하거나 클로저를 생성하여 반환한다.
자바스크립트의 함수는 일급 객체이므로 값처럼 인자로 전달할 수 있으며 반환할 수도 있다.

• 다른 함수의 인자로 전달되는 함수를 콜백 함수(callback function)라고 한다.
• '함수를 리턴하는 함수'를 커리 함수라고 하기도 한다. (커리함수 ⊂ 고차함수)

왜 꼭 고차함수를 써야할까?

➡️ 추상화(abstraction)를 하기 위해서이다❗️
추상화란 복잡한 어떤 것을 압축해서 핵심만 추출한 상태로 만드는 것이다. 함수 또한 추상화의 결과이고, 고차함수는 함수를 한 레벨 더 추상화한 결과라고 볼 수 있다. 추상화를 이용하면 효율적이고 편리하게 값을 다룰 수 있으므로 생산성을 높일 수 있다.

자주 쓰는 고차함수들

arr.filter()

filter는 주어진 함수의 테스트를 통과하는 모든 요소를 모아 새로운 배열로 리턴한다.

const words = ['spray', 'limit', 'elite', 'exuberant', 'destruction', 'present'];

const result = words.filter(word => word.length > 6);

console.log(result);
// ["exuberant", "destruction", "present"]

arr.map()

map은 배열 내의 모든 요소 각각에 대하여 주어진 함수를 호출한 결과를 모아 새로운 배열을 리턴한다.

const array = [1, 4, 9, 16];
const map = array.map(x => x * 2);

console.log(map);
// [2, 8, 18, 32]

arr.forEach()

forEach()는 주어진 함수를 배열 요소 각각에 대해 실행한다.

map과 forEach의 차이?

forEach는 기존의 배열을 변경하는 반면, map은 새로운 배열을 반환한다. forEach는 함수 밖으로 리턴값을 보내지 못한다.

// Example of forEach() 1
let arr1 = [1,2,3,4,5];
let arr2 = arr.forEach(function(value){
	return value;
});
console.log(arr2);   //undefined

// Example of forEach() 2

const arr = [1, 2, 3, 4, 5];
const mulArr = [];

arr.forEach(num => {
  mulArr.push(num * 3);
});

console.log(mulArr); // [3, 6, 9, 12, 15]

arr.reduce()

배열의 각 요소에 대해 주어진 리듀서(reducer) 함수를 실행하고, 하나의 결과값을 리턴한다.

reduce()는 배열 내에 존재하는 각 요소에 대해 콜백 함수를 한 번씩 실행하는데, 콜백 함수는 다음의 네 인수를 받는다:

• accumulator(이하 acc)
• currentValue(이하 cur)
• currentIndex
• array

만약 reduce() 함수를 호출할 때 초기값을 제공한 경우 acc는 초기값, cur은 배열의 첫 번째 값이 된다. 초기값이 없는 경우, acc는 배열의 첫 번째 값, cur은 배열의 두번째 값이 된다.
➡️ 초기값이 있으면 reduce()는 배열의 인덱스 0부터 콜백함수를 실행하고, 있으면 인덱스 1부터 콜백함수를 실행한다.

// 중첩 배열 펼치기

var flattened = [[0, 1], [2, 3], [4, 5]].reduce(
  function(acc, cur) {
    return acc.concat(cur);
  },
  []
);
// 펼친 결과: [0, 1, 2, 3, 4, 5]

arr.find()

주어진 판별 함수를 만족하는 첫 번째 요소의 값을 리턴한다. 없으면 undefined를 리턴한다.

const array1 = [5, 12, 8, 130, 44];

const found = array1.find(element => element > 10);

console.log(found);

// expected output: 12

arr.sort()

배열의 요소를 적절한 위치에 정렬한 후 그 배열을 리턴한다. 기본 정렬 순서는 문자열의 유니코드 코드 포인트를 따른다.

const array1 = [1, 30, 4, 21, 100000];
array1.sort();
console.log(array1);

// expected output: Array [1, 100000, 21, 30, 4]

arr.every()

배열 안의 모든 요소가 주어진 판별 함수를 통과하는지 테스트한다. (빈 배열에서 호출하면 무조건 true를 리턴)

function isBigEnough(element) {
  return element >= 10;
}
[12, 5, 8, 130, 44].every(isBigEnough);   // false
[12, 54, 18, 130, 44].every(isBigEnough); // true

arr.some()

주어진 판별 함수를 통과하는 요소가 하나라도 있으면 true를 리턴

function isBiggerThan10(element) {
  return element > 10;
}

[2, 5, 8, 1, 4].some(isBiggerThan10);  // false
[12, 5, 8, 1, 4].some(isBiggerThan10); // true