#TIL_21.8.11

평가와 일급, 고차함수

• 평가
  코드가 계산되어 값을 만드는 것

  • ex) 1 + 2 가 평가되면 3
(1 + 2) + 3 은 (1 + 2) 가 평가되어 3 + 4, 3 + 4 가 평가되어 7
[1, 2] 는 배열로 평가됨

• 일급
  값으로 다룰 수 있음
  변수에 담을 수 있음
  함수의 인자로 사용될 수 있음
  함수의 결과로 사용될 수 있음

const a = 10
const add10 = a + 10
    
const ans = add10(a)

• 일급 함수
  함수를 값으로 다룰 수 있음
  함수의 인자 / 결과값으로 함수가 사용될 수 있음
  평가에서 결과로 만들어 다른 함수에 전달할 수 있음
  조합성과 추상화의 도구로 함수를 잘 사용할 수 있다.
  

const a = 10
const add5 = a => a + 5

고차함수

함수를 값으로 다루는 함수를 고차함수 라고 한다.

• 함수를 인자로 받아서 실행해주는 함수

// 함수가 함수를 받아 안에서 실행됩니다.
const apply1 = f => f(1)

const add2 = a => a + 2
apply1(add2) // 3
apply1(a => a - 1) // 0

---

const times = (f, n) => {
	let i = -1
    while (++i < n)
    	f(i)
}

times(a => log(a + 10), 3) // 10 11 12

• 함수를 만들어 리턴하는 함수 (클로저를 만들어 리턴하는 함수)

const addMaker = a => b => a + b
const add10 = addMaker(10)
log(add10) // b => a + b
log(add10(5) // 15

---

이터레이터 프로토콜

리스트 순회

• 함수형 프로그래밍에서 리스트 순회는 굉장히 중요함

기존의 리스트 순회

for (let i = 0; i < arr.length; i++) ...

es6 에서의 리스트 순회

for (const item of list) ...

Array, Set, Map

• for of 는 인덱스로 접근하지 않음
  Array처럼 key: index 와 value: 값 으로 동작하지 않음
  Symbol.iterator 를 통해 확인 할 수 있음
  
• Array

const arr = [1, 2, 3]
for (const a of arr) log(a);

• Set

const set = new Set([1, 2, 3])
for (const a of set) log(a);

• Map

const map = new Map([['a', 1], ['b', 2], ['c', 3])
for (const a of map) log(a);

for (const a of map.keys()) log(a);
for (const a of map.values()) log(a);
for (const a of map.entries()) log(a);

이터러블 / 이터레이터 프로토콜

• 이터러블: 이터레이터를 리턴하는 [Symbol.iterator]() 를 가진 값
• 이터레이터: { value, done } 객체를 리턴하는 next() 를 가진 값
• 이터러블/이터레이터 프로토콜: 이터러블을 for ... of, 전개 연산자(...) 등과 함께 동작하도록 한 규약
  ex) for ... of 문의 경우 Array 가 이터러블 이고, Array 는 Symbol.iterator 를 통해서 이터레이터를 리턴하기 때문에, for ... of 문과 함께 동작하는 이터러블 객체이고,
  for ... of 로 순회할 수 있기 때문에 이터러블 / 이터레이터 프로토콜을 따른다.

사용자 정의 이터러블, 이터러블 / 이터레이터 프로토콜 정의

const iterable = {
	[symbol.iterator]() {
    	let i = 3
    	return {
        	next() {
            	return i == 0 ? {done: true| : { value: i--, done: false }
            }
        }
    }
}
let iterator = iterable[Symbol.iterator]()
log(iterator.next()) // { value: 3, done: false }
log(iterator.next()) // { value: 2, done: false }
log(iterator.next()) // { value: 1, done: false }
log(iterator.next()) // { done: true }

// 위는 for ... of 로 순회할 수 있음
for (const a of iteravble) log(a);

• 이터레이터 또한 이터레이터를 가질 수 있음
• 브라우저에서 사용할 수 있는 여러 순회가 가능한 형태를 가진 값들은 대부분 이터레이터 / 이터러블 프로토콜을 따르고 있음

---

이터러블과 이터레이터 부분은 추가적인 공부가 필요할 것 같다..
for of 를 사용하고 있으면서 어떻게 동작하는지에 대한 부분은 생각해 본 적이 없어서 생소한 개념으로 잘 와닿지 않는다.

아직은 간단히 es5 이전에서 쓰이는 for 반복문에서의 index를 사용하지 않고, 이터레이터와 next() 를 통해 각 값들에 접근할 수 있다는 정도로만 이해하고 있다. 추가적으로 공부를 하면서 더 개념을 잡아가려고 한다.
(이터레이터가 이터레이터를 가질 수 있다는 부분이 특히 잘 이해가 안간다..)

또한, 간단히 console.log 를 찍어보면서 산수 등은 기본적으로 한번쯤은 접해봤을 기본적인 개념이었는데
이를 평가와 일급의 어떠한 개념으로 정리 되어 있다는 걸 처음 알았다.

큰 생각 없이 지나가는 간단한 계산적인 부분에도 이런 개념들이 존재하니, 앞으로 공부를 이어나가면서도 하나하나 파고들어 볼 필요가 있음을 느꼈다.