# lodash

84개의 포스트
post-thumbnail

[실전프로젝트] 검색기능 구현

Debounce와 Throttle Debounce : 이벤트의 마지막 이벤트만 인식 Throttle : 이벤트가 발생하고서 일정 주기마다 이벤트가 발생되도록한다. 사용자가 검색하려고 할때 검색하는 단어 타이핑을 마쳤을 때 api요청을 하는게 자연스럽다. 스로틀의 경

2022년 5월 8일
·
0개의 댓글
post-thumbnail

[패스트 캠퍼스 FE] JS 데이터

JS 데이터 목차 >1. 문자 숫자와 수학 배열 객체 구조 분해 할당 전개 연산자 불변성 얕은 복사와 깊은 복사 문자 (string) >String 전역 객체는, 문자열(문자의 나열)의 생성자이다. 종류 String.length 문자열의 길이 반환 Strin

2022년 4월 28일
·
0개의 댓글

깊은 객체, 배열에 의한 리렌더링

깊은 객체, 배열에 의한 리렌더링

2022년 4월 26일
·
0개의 댓글

lodash를 이용해 중복데이터 거르기

이 전 포스트처럼 가져온 데이터를 다룰 때 중복값이 존재할 수 있다. 물론 바닐라 자바스크립트로도 중복을 가릴 순 있지만,lodash 라이브러리를 활용하면 비교적 쉽게 중복을 걸러낼 수 있다. \_.\*\*uniqBy\*\*(중복된 아이템이 있는 배열, '중복을 구분할

2022년 4월 26일
·
0개의 댓글
post-thumbnail

npm(parcel, lodash)로 프로젝트 만들기

npm으로 프로젝트 실행하기.

2022년 4월 26일
·
0개의 댓글

[JS] 디바운스, 쓰로틀 (Debounce, Throttle) with lodash

연이어 호출되는 함수들 중 마지막 함수(또는 제일 처음)만 호출하도록 하는 것검색어 자동완성기능을 구현하는 경우를 생각해보자.ㄷ 디 딥 디바 디방 디바우 디바운 디바운ㅅ 디바운스'디바운스' 검색하는데 쓸데없이 api 호출 9번하면 자원낭비 넘 심하고요?이 때 와다다 치

2022년 4월 15일
·
0개의 댓글
post-thumbnail

[React] lodash-debounce 검색 폼 성능 향상

onChange 이벤트는 input에 변화가 감지될 때마다 호출된다. e.target.value을 console에 찍어보면 자음, 모음까지 나뉘어진 단위로 출력된다.해리포터를 검색할 때 'ㅎ', '핼', '해ㄹ' 이런 검색어는 필요가 없다. 이러한 쿼리를 모두 API에

2022년 4월 14일
·
0개의 댓글

Debouncing / Throttling

Debouncing / Throttling 단순하게 onChangeSearch에 리패치를 줘서 검색 버튼을 없애면 글자를 입력할때마다 리패치되기때문에 서버에 무리가 갈 수 있다. 디바운싱(디바운스) : 특정시간이 지날때까지 재반복이 일어나지 않을 경우 작업이 한번 실행

2022년 4월 9일
·
0개의 댓글
post-thumbnail

lodash vs lodash-es

최근에 프로젝트셋팅을 진행하면서 lodash 대신에 lodash-es를 사용하면 어떤지 리뷰를 받았다. 그래서 오늘 둘의 차이점을 보려고한다.lodash: node.js 모듈 기반으로 내보낸 라이브러리lodash-es: es-module 기반으로 내보낸 라이브러리lod

2022년 4월 6일
·
0개의 댓글
post-thumbnail

lodash map 함수 비동기 처리 이슈

lodash map 함수 사용하여 내부에서 데이터 조회시 response 데이터 빈배열로 반환(DB에 데이터가 있음에도)map 함수의 비동기 처리map 함수 대신 for await 사용

2022년 4월 3일
·
0개의 댓글
post-thumbnail

Lodash Method

자주 쓰이는 Lodash 메소드와 간단 설명...

2022년 3월 29일
·
0개의 댓글
post-thumbnail

우당탕탕 늑개 Lodash #2 - _.join

데이터가 이렇게 넘어올 때가 있다그리고 다음과 같은 요청사항이 있다이럴 때 유용한 것이 바로 \_.join()이다lodash 공식 가이드에 따르면 다음과 같이 사용한다배열 내의 모든 요소를 구분 기호로 구분된 문자열로 반환해 준다따라서, 위 요청은 다음과 같이 사용하면

2022년 3월 22일
·
0개의 댓글
post-thumbnail

우당탕탕 늑개 Lodash #1 - Intro

개발을 하다보면,api를 통한 값들을 가공해야 할 때가 있다api를 통해 호출된 데이터 구조는 저어어어어언혀 프론트 개발자에게 친절하다고 할 수는 없다화면 기준으로 바인딩 되는 데이터만 넘어오면 프론트 개발은 발로도 할 수 있을 것이다순서를 바꾼다거나, 필터링을 한다거

2022년 3월 21일
·
0개의 댓글

🌤 BE TIL 0316

SpreadOperator, RestParameter, TransferProtocol, JSON

2022년 3월 16일
·
0개의 댓글
post-thumbnail

Webpack | Bundle 사이즈 줄이는 lodash import 방법

개발 끝내고 배포 시, bundle 사이즈는 항상 신경을 써야 됨. lodash를 import 하는 방식에 따라서 최종 bundle js의 사이즈가 달라짐. 실행 사항 Webpack | 개념 / 필수 개발 환경 세팅 1(https://velog.io/@k

2022년 3월 13일
·
0개의 댓글
post-thumbnail

Lodash

배열, 객체, 숫자, 문자열 등의 데이터를 손쉽게 변형 및 수정시킬 수 있는 다양한 기능이 들어 있는 패키지.$ npm i -D lodashupperFirst 메서드는 문자열의 맨 앞글자를 대문자로 변경unionBy는 앞에 인수들에 들어오는 배열 데이터를 병합하고, 마

2022년 3월 8일
·
0개의 댓글

[js] deep copy lodash

업무를 하는 도중 deep copy를 해야할 상황에 자주 놓인다.deep copy에는 다양한 방법이 있지만 lodash가 쓰기에 나의 경우 직관적이라서자주 쓸 것 같아 메모해둔다.사용이유 : 내용은 같지만 참조값이 다른 별개의 객체를 만들기 위함사용방법\_.cloneD

2022년 2월 25일
·
0개의 댓글