2023-11-02 본 캠프 21일차 / 40일차 TIL

2023-11-02 본 캠프 21일차 / 40일차 TIL

주요진행사항

- 리액트 강의 수강 (유데미)

- 알고리즘 강의 수강 및 풀이 (인프런)

- 리액트 개인프로젝트 ToDoList UI 구성

- 리액트 챌린지반 수업 (npm 패키지 배포)

 

알고리즘 강의 수강 및 풀이

Array.prototype.reduce()

 

사용법 

array.reduce(( accumulator, value, index, array )=>{콜백}, init);

 

기본적으로 reduce는 초기값이 세팅되었을 때는 array.length만큼, 초기값이 세팅되지 않았을 때는 array.length-1만큼 (초기값이 array[0]) 순회한다.

 

accumulator 는 이전 콜백함수 반복의 반환값이 들어간다

value는 배열의 순회값을 나타낸다.

 

따라서 reduce는 다음과 같은 로직을 만들어 낼 수 있다.

const array = [1,3,4,2,5];

// 최솟값
const min = array.reduce((acc,value)=>acc-value<0?acc:value);
// 최댓값
const max = array.reduce((acc,value)=>acc-value>0?acc:value);


// 누적합
const sum = array.reduce((acc,value)=>acc+value);

console.log(min,max,sum);

 

기존의 산술문제를 reduce로 대체한다면 좀더 효율적인 코드가 나올 것으로 생각한다.

 

---

개인프로젝트 ToDoList UI 구성

이전 UI를 개선하였다.

컨셉은 티켓느낌으로 UI를 구성하였다.

 

ToDoList의 메인기능을 끝났지만 입력 창의 validation check를 구현하여 UX를 개선할 예정이다.