Notice
Recent Posts
Recent Comments
Link
일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
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 |
Tags
- 코딩
- 디자인패턴
- Design Pattern
- Funtional programming
- Programming
- Ramda.js
- 개발
- Node.js
- context api
- VUE
- code-first
- 자바스크립트
- Front-End
- 리액트
- VanillaJS
- schema-first
- It
- 프로그래밍
- graphql
- angular
- goorm.io
- react.js
- JavaScript
- ELECTRON
- 함수형
- ECMAScript6
- React
- 프론트엔드
- apollo client
- vue.js
Archives
공부하는 블로그
FP 비교 본문
인프런의 FP 강좌를 보다가 URL 쿼리문을 작성하는 내용을 보고 다른 함수형 라이브러리들은 어떤가 살펴보기 위해서 살짝 끄적여보았다.
아래 나온 obj1
변수를 파싱해서 a=1&c=CC&d=DD
로 결과를 내는 함수를 만드는 것이다. 단 b
는 undefined
이니까 제외한다.
순수 JS, lodash, ramda 에서 쓰임새가 어떤지를 맛보고자 하는 것이기에 특별한 내용이나 설명이 있지는 않다.
순수 JS
const obj1 = {
a: 1,
b: undefined,
c: 'CC',
d: 'DD'
};
console.log(
Object
.entries(obj1)
.filter(([_,v]) => v !== undefined)
.map(([k, v]) => `${k}=${v}`)
.join('&')
)
ramda.js
풀이 1
console.log(
R.pipe(
R.toPairs,
R.reject(([_, v]) => v === undefined),
R.map(([k, v]) => `${k}=${v}`),
R.join('&')
)(obj1)
)
풀이 2
console.log(
R.compose(
R.join('&'),
R.map(([k, v]) => `${k}=${v}`),
R.reject(([_, v]) => v === undefined),
R.toPairs
)(obj1)
)
compose와 pipe는 흐름이 반대이다.
lodash
console.log(
_.chain(obj1)
.toPairs()
.reject(([_, v]) => v === undefined)
.map(([k, v]) => `${k}=${v}`)
.join('&')
.value()
)
간단하게 해결해보았다. 다음에는 더 복잡한 내용을 다뤄보자.
'자바스크립트' 카테고리의 다른 글
Ramda.js를 이용한 함수형 프로그래밍 수련 (0) | 2020.02.09 |
---|---|
First look of Svelte App (0) | 2020.02.03 |
Vue.js Composition API 리뷰 (0) | 2019.12.21 |
Vue.js의 새롭게 개선된 prop.sync (0) | 2019.05.10 |
console.log에 대해 알아보자 (2) | 2018.10.23 |
Comments