• 이터러블 map함수 생성을 사용한 중복제거 및 유사배열 처리

const products = [
    {name: '반팔티', price: 15000},
    {name: '긴팔티', price: 20000},
    {name: '핸드폰케이스', price: 15000},
    {name: '후드티', price: 30000},
    {name: '바지', price: 25000}
];

const map = (f, iter)=>{
    let res=[];
    for(const a of iter){
        res.push(f(a))
    }
    return res;
}

//name, price 속성 값을 제외하곤 중복임
let names=[];
for(const a of products){
    names.push(a.name);
}
console.log(names);
//
console.log(map(p=>p.name, products));
console.log(map(p=>p.price, products));

//이터러블 프로토콜을 사용한 map의 다형성
document.querySelectorAll('*').map(el=> el.nodeName); // 유사배열로 map 사용 불가

//우리가 만든 map함수는 유사배열도 처리가능
map(el=> el.nodeName, document.querySelectorAll('*'));-

• 이터러블 프로토콜을 따르면 모두 map 사용 가능

const l = document.querySelectorAll('*')[Symbol.iterator]();
l //Array Iterator {}
l.next(); //{value: html, done: false}
l.next(); //{value: head, done: false}

//gen을 활용해 사실상 모든로직은 map을 사용가능
function *gen(){
    yield 2;
    yield 3;
    yield 4;
}

console.log(map(a => a * a, gen())); //4,9,16

• 이터러블 프로토콜을 활용한 map(key,value) 예제

let m = new Map();
m.set('a',10);
m.set('b',10);
m.set('c',10);

console.log(map(([k, v]) => [k, v * v], m));
//[ [ 'a', 100 ], [ 'b', 100 ], [ 'c', 100 ] ]

• 이터러블 프로토콜을 활용한 filter 함수 생성

const products = [
    {name: '반팔티', price: 15000},
    {name: '긴팔티', price: 20000},
    {name: '핸드폰케이스', price: 15000},
    {name: '후드티', price: 30000},
    {name: '바지', price: 25000}
];

let under20000 = [];
for(const a of products){
    a.price <20000? under20000.push(a): null
}

console.log(...under20000);

function filter(f, iter){
    let res= [];
    for(const a of iter){
        if(f(a)) res.push(a);
    }
    return res;
}

console.log(filter(a => a.price < 20000, products));
console.log(filter(a => a.price > 20000, products));
console.log(filter(a => a % 2, [1, 2, 3, 4]));
console.log(filter(a => a % 2, function* () {
    yield 1;
    yield 2;
    yield 3;
    yield 4;
}()));

• Reduce 함수 생성을 통한 이터러블 프로토콜 제어

const nums = [1,2,3,4,5];
let total =0;
//기존 reduce(접기방식)
for(const a of nums){
    total+=a;
}
console.log(total);

function reduce(f, acc, iter){
    if(!iter){ //iter이 없다면 첫번째 요소를 0 번째로 세팅
        iter= acc[Symbol.iterator]();
        acc=iter.next().value;
    }
    for(const a of iter){
        acc=f(acc,a)
    }
    return acc;
}
function add(a,b){
    return a+b;
}
console.log(reduce(add, [1,2,3,4,5]));
const products = [
    {name: '반팔티', price: 15000},
    {name: '긴팔티', price: 20000},
    {name: '핸드폰케이스', price: 15000},
    {name: '후드티', price: 30000},
    {name: '바지', price: 25000}
];
console.log(reduce((total,product) =>total+product.price, 0, products));