Notice
Recent Posts
Recent Comments
Link
«   2024/12   »
1 2 3 4 5 6 7
8 9 10 11 12 13 14
15 16 17 18 19 20 21
22 23 24 25 26 27 28
29 30 31
Tags
more
Archives
Today
Total
관리 메뉴

개발공부일지

Javascript - 일급함수, 고차함수, Set객체, Symbol, iterator, iterable, map함수 본문

Javascript

Javascript - 일급함수, 고차함수, Set객체, Symbol, iterator, iterable, map함수

보람- 2023. 8. 29. 17:54

목차

1. 일급함수

2. Set 객체와 for ... of 반복문

3. Symbol

4. iterator

5. iterable만들기

6. map함수


 

 

 

1. 일급함수

 

※ 일급이란 ?

    - 값으로 다룰수있고

    - 변수에 담을수있고

    - 함수 인자에 사용할수있고

    - 함수 결과로 사용할수있는

 

일급함수로 함수를 반환하면 고차함수, 함수 인자로 사용한다면 콜백함수

 

① 고차함수

function a() {
  return function () {
    console.log("hello world");
  };
}

a()()

//아니면
const b = a();
b();
const a = () => () => {
  console.log("hello world");
};

// 화살표 함수를 풀어써보면
const a = () => {
  return () => {
    console.log("hello world");
  };
};

 

② 함수를 인자로 받아서 사용하는 경우

const apply1 = (f) => f(1);

const a = apply1((a) => a + 1);
console.log(a); // 2

const add = (a) => a + 2;
const b = apply1(add); // 3

 

 

 

 

2. Set 객체와 for ... of 반복문

https://developer.mozilla.org/ko/docs/Web/JavaScript/Guide/Keyed_collections

const set = new Set([1, 2, 3]);
console.log(set.size); // 3

for (let i = 0; i < set.size; i++) {
  console.log(set[i]); // undefined
}

for (const item of set) {
  console.log(item); // 1 2 3

 

 

 

 

3. Symbol

- ES6에서 추가된 원시타입.

https://developer.mozilla.org/ko/docs/Web/JavaScript/Reference/Global_Objects/Symbol

 

console.dir(Symbol);

 

 

 

4. iterator

https://developer.mozilla.org/ko/docs/Web/JavaScript/Guide/Iterators_and_generators

const arr = [1, 2, 3];
arr[Symbol.iterator];
const iterator = arr[Symbol.iterator](); // {}
console.dir(iterator);
iterator.next();

 

 

5. iterable만들기

https://ko.javascript.info/iterable

 

const iterable = {
  [Symbol.iterator]() {
    let i = 1;
    return {
      next() {
        const done = i === 4;
        const value = done ? undefined : i++;
        return {
          value: value,
          done: done,
        };
      },
      [Symbol.iterator]() {
        return this;
      },
    };
  },
};

const iterator = iterable[Symbol.iterator]();
console.log(iterator);

for (const a of iterator) console.log(a);

 

 

 

6. map함수

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

const map = (callback, arr) => {
  const result = [];
  for (const a of arr) {
    result.push(callback(a));
  }
  return result;
};

map((v) => v.name, products);
//  ['반팔티', '긴팔티', '핸드폰케이스', '후드티', '바지']
map((v) => v.price, products);
//  [15000, 20000, 15000, 30000, 25000]

 

 


※ 스프레드 연산자도 iterator를 가지고있다!

 [Symbol.iterator] 형태