🎃 lodash가 뭔데?

---

자바스크립트의 라이브러리 중 하나로 array, collection, date 등 데이터의 필수적인 구조를 쉽게 다룰 수 있게끔 하는데에 사용된다고 한다.

함수형태로 미리 만들어둔 것들을 필요할때마다 꺼내쓸 수 있는데 lodash 라이브러리도 그러한 형태이다.

이러한 라이브러리를 사용하는 이유는 설치를 통해 편리하게 함수를 이용할 수 있고, 성능이 좋은 다양한 메소드를 활용할 수 있어 코드를 짜는데 수월하기 때문에 사용하기도 한다.

❓ 어떻게 쓰는데?

---

터미널을 열어서 간단하게 명령어를 입력하면 된다.

# 터미널
yarn add lodash

명령어로 lodash를 설치했으면 이제 내 파일과 연결을 해주어야 한다.

# 내파일.js
import _ from 'lodash';

js파일 제일 상단에 import를 함으로써 이제 라이브러리에서 제공하는 편리한 기능들을 우리가 사용할 수 있다.

글쓴이가 사용해본 기능은 포스팅에 수시로 추가해서 풀어보겠다.

_.cloneDeep()

---

깊은 복사를 할 수 있게하는 함수. 깊은 복사를 할 수 있는 방법으로는 JSON.parse를 사용할 수 있는데 이게 조금 성능이 느리다 보니 이 함수를 사용해서 좀더 수월하고 좋게 라이브러리에서 꺼내 쓸 수 있다.

⭕ 자바스크립트 깊은 복사

# 객체의 깊은 복사 방법
let profile = {
	 name: 'a',
	 age: 13,
	 hobby: {
	 	hobby1: 'b',
	 	hobby2: 'c'
	 }
}

let profile2 = JSON.parse(JSON.stringify(profile)); # 깊은 복사

깊은 복사의 방법으로 JSON.parse를 쓸 수 있는데, 과정을 하나씩 살펴보자면 다음과 같다.

• JSON.stringify() : 이 메소드는 ()의 값(객체나 값)을 JSON 문자열로 변환
• JSON.parse() : JSON 문자열의 구문을 분석하고 객체로 반환한다.

즉 이렇게 된다.

JSON.stringify(profile)

JSON.stringify를 통해 profile을 JSON 문자열로 만들고,

JSON.parse(JSON.stringify(profile))

그 만든 문자열을 JSON.parse()를 통해 다시 객체로 바꾸는 작업이 진행되는 것이다.

딱봐도 무겁고 오래걸릴것 같은 작업인데 lodash 라이브러리를 사용하면 성능 빠르게 처리 할 수 있다.

✅ lodash의 cloneDeep()

---

# lodash의 라이브러리

let profile = {
	 name: 'a',
	 age: 13,
	 hobby: {
	 	hobby1: 'b',
	 	hobby2: 'c'
	 }
}

let profile2 = _.cloneDeep(profile);

문장도 간결해지고 같은 출력값을 내고 있으며 더 무거운 작업을 처리할때 성능도 좋다.

---

참고자료
https://velog.io/@kysung95/%EC%A7%A4%EB%A7%89%EA%B8%80-lodash-%EC%95%8C%EA%B3%A0-%EC%93%B0%EC%9E%90
https://lodash.com/