반응형 유인동5 map, filter, reduce map // map (고차함수) // 함수에서는 처리한 결과값을 리턴하게 된다 const map = (f, iter) => { let res = []; for (const a of iter) { res.push(f(a)); } return res; }; // 예제 1 let names = []; for (const p of products) { names.push(p.name); } console.log(names); // map을 이용해서 다시 작성한 예제 1 console.log(map(p => p.name, products)); // 예제 2 let prices = []; for (const p of products) { prices.push(p.price); } console.log(prices).. 2021. 11. 24. 제너레이터와 이터레이터 1) 제너레이터와 이터레이터 제너레이터 : 이터레이터이자 이터러블을 생성하는 함수, well-formed iterator를 리턴하는 함수 어떠한 값들을 제너레이터를 통해서 이터러블로 만들고, for.. of 문을 통해 순회를 할 수 있게 만들 수 있다는 것! function *gen() { yield 1; yield 2; yield 3; } let iter = gen(); console.log(iter[Symbol.iterator]() == iter); // true 반환 예제 10까지의 홀수만 뽑아내는 제너레이터 함수 function *odds(l) { for(let i = 0; i < l; i++) { if (i % 2) yield i; } } let iter2 = odds(10); console.l.. 2021. 11. 24. ES6에서의 순회와 이터러블:이터레이터 프로토콜(2) 1) 사용자 정의 이터러블, 이터러블/이터레이터 프로토콜 정의 // 사용자 정의 이터러블 const iterable = { [Symbol.iterator]() { let i = 3; return { next() { return i == 0 ? { done: true } : { value: i--, done: false }; }, [Symbol.iterator]() { return this; } } } }; let iterator = iterable[Symbol.iterator](); // console.log(iterator.next()); // console.log(iterator.next()); // console.log(iterator.next()); // console.log(iterator.ne.. 2021. 11. 4. ES6에서의 순회와 이터러블:이터레이터 프로토콜(1) 1) ES5 vs ES6 리스트 순회 비교 ES5에서의 리스트 순회 const list = [1, 2, 3]; for (var i = 0; i < list.length; i++) { console.log(list[i]); } const str = 'abc'; for (var i = 0; i < str.length; i++) { console.log(str[i]); } ES6에서의 리스트 순회 for (const a of list) { console.log(a); } for (const a of str) { console.log(a); } ES6에서 확실히 간결해진게 눈에 보인다. 2) 이터러블/이터레이터 프로토콜 (Array, Set, Map) // Array const arr = [1, 2, 3]; f.. 2021. 11. 3. 함수형 자바스크립트 기본기 회사 업무에서 리액트를 다루는데, 자바스크립트 기본이 되어 있지 않은 상태에서 업무 처리를 하기가 매우 힘들었다. 더군다나, 핵심 기능들은 자바스크립트 함수형으로 많이 구현되어 있었다. 회사 교육비를 지원받아서 듣게 된 강의이다. 공부한 내용을 기록하기 위해서 작성하는 게시글. 다 수강할 때까지 블로그에 배운 내용을 정리할 생각이다. 평가 : 코드가 계산(Evaluation)되어 있는 값을 만드는 것 일급 - 값으로 다룰 수 있다. - 변수에 담을 수 있다. - 함수의 인자로 사용될 수 있다. - 함수의 결과로 사용될 수 있다. const a = 10; const add10 = a => a + 10; const r = add10(a); add10(a); 일급 함수 - 함수를 값으로 다룰 수 있다. - 조.. 2021. 10. 31. 이전 1 다음 반응형