본문 바로가기
반응형

Library & Framework43

[Lodash] 배열에서 false인 요소들 제거하기 (ft. compact) compact lodash에서 제공하고 있는 compact() 메서드의 경우 배열에서 false인 요소들을 제외할 때 사용되는 메서드이다. _.compact([0, 1, false, 2, '', 3]); // => [1, 2, 3] 이런 식으로 배열 요소 중 자바스크립트에서 false로 간주되는 것들을 제거한 배열을 반환해 준다. 근데 이렇게만 보면 굳이 사용할 필요가 있나? 싶기도 하다. const array = [0, 1, false, 2, '', 3] array.filter(v => v) // => [1, 2, 3] 이렇게 filter만 사용해도 크게 복잡하지 않게 사용이 가능하기 때문이다. 실제로 나 같은 경우에는 특수한 경우가 아니면 filter 메서드를 사용하는 편이고, api 응답 데이터를 .. 2024. 1. 24.
[Lodash] 객체에서 특정 프로퍼티만 뽑아서 사용하기 (ft. pick) pick lodash에서 제공하고 있는 pick() 메서드의 경우 객체에서 특정 프로퍼티만 사용하고자 할 때 사용된다. 일반적으로 어디서든 omit을 소개할때 같이 소개되는 메서드이기도 하며, omit과 마찬가지로 다른 곳에서도 흔하게 볼 수 있고 기능 또한 비슷하기 때문에 한 번 알아두면 이런 기능이구나 하고 쉽게 이해하고 갈 수 있다. // _.pick(object, [paths]) const object = { 'a': 1, 'b': '2', 'c': 3 }; const result = _.pick(object, ['a', 'c']); console.log(result) // { 'a': 1, 'c': 3 } pickBy pickBy() 메서드는 특정 프로퍼티만 뽑아 사용하는것은 동일하나 특정 조건.. 2023. 6. 18.
[Lodash] 객체에서 특정 프로퍼티 제외하기 (ft. omit) omit lodash에서 제공하고 있는 omit() 메서드의 경우 객체에서 특정 프로퍼티를 제외할 때 사용되는 메서드이다. omit이라는 명칭은 다른 곳에서도 흔하게 볼 수 있고 기능 또한 비슷하기 때문에 한 번 알아두면 이런 기능이구나 하고 쉽게 이해하고 갈 수 있다. 특히 typescript의 유틸리티 타입에서도 흔하게 볼 수 있다. // _.omit(object, [paths: string|string[]]) const object = { 'a': 1, 'b': '2', 'c': 3 }; console.log(_.omit(object, ['a', 'c'])); //{ 'b': '2' } 특정 객체를 기준으로 제외하고 싶은 프로퍼티의 키 배열을 넣어두면 제외된 나머지 객체가 반환되는 형식이다. omi.. 2023. 6. 13.
[Lodash] 배열 차집합(difference) 구하기 difference lodash에서 제공하고 있는 difference() 메서드의 경우 차집합의 개념과 마찬가지로 하나의 기준이 되는 배열이 있고 그 이후에 오는 배열로 이루어진 값들과 비교하여 중복되지 않는 값을 반환한다. // _.difference(array, [values]) const arr = [2, 1] console.log(_.difference(arr, [2, 3])) // [1] console.log(_.difference(arr, [2, 3], [1])) // [] console.log(_.difference(arr, [3, 4], [5])) // [2. 1] 새로운 배열을 반환하기 때문에 변수에 담아서 사용하도록 하자. 참고: https://lodash.com/docs/4.17.15.. 2023. 3. 13.
[Lodash] 배열 교집합(intersection) 구하기 intersection lodash에서 제공하고 있는 intersection() 메서드의 경우 단순하게 여러 개의 동일한 값을 가지고 있는 배열의 중복 데이터만을 추출한다. // _.intersection([arrays]) const arr1 = [1, 2, 3, 4, 5] const arr2 = [3, 4, 5, 6, 7] console.log(_.intersection(arr1, arr2)) // [3, 4, 5] 여기서 결과값의 순서와 참조는 첫 번째 배열에 의해 결정된다는 것만 알고 가면 될 듯하다. 참고: https://lodash.com/docs/4.17.15#intersection Lodash Documentation _(value) source Creates a lodash object w.. 2023. 3. 8.
[Lodash] 배열 중복 제거하기 (ft. uniq, uniqBy, union, unionBy) uniq lodash에서 제공하고 있는 uniq() 메서드의 경우 단순하게 여러 개의 동일한 값을 가지고 있는 배열의 중복 데이터를 제거한다. // _.uniq(array) const arr1 = [1,1,1,3,3,4,5,2,6,4,7] console.log(_.uniq(arr1)); // [1,3,4,5,2,6,7] uniqBy 아마 사용하게 된다면 위에서 설명한 uniq메서드보다는 uniqBy 메서드를 좀 더 많이 사용하지 않을까 생각된다. uniqBy() 메서드는 "중복을 구분할 속성"값을 두번째 인수로 사용이 가능하다. // _.uniqBy(array, identity) const search = [ { id: 12, title: 'testest', name: 'jack', age: 26}, {.. 2023. 2. 22.
[Lodash] Lodash란? Lodash Lodash는 개발을 하다 보면 한 번쯤은 들어보거나 접해볼 수밖에 없는 Javascript의 인기있는 라이브러리 중 하나이다. 나 역시 Lodash에 대해 아무것도 모르던 때가 있었는데도 불구하고 검색을 하다 보면 자연스레 알게 되었다. Lodash는 배열, 숫자, 객체, 문자열 등으로 작업할 때 번거로움을 없애고 쉽게 다룰 수 있게끔 하는 데 사용된다. 그렇기에 보통 Lodash는 유틸용 라이브러리라고 봐도 무방하다. 하지만 하나 알아둬야 할게 Lodash를 많이 사용하긴 하지만 꼭 좋기만 한 건 아니다. https://measurethat.net/Benchmarks/Show/6534/1/lodash-vs-es6-in-find-method Benchmark: lodash vs es6 in.. 2023. 2. 21.
[jsTree] 검색(search plugin) 감지하기 jstree 에서 제공하는 plugin중에 하나인 search에 대해 알고 있다는 가정하에 작성한다. https://mine-it-record.tistory.com/397 2022. 2. 12.
[jqGrid] 특정 셀 편집(editable) 유무 설정하기 (ft. editable-cell, not-editable-cell) - 특정 셀 편집(editable) 유무 설정하기 - jqGrid를 사용하다보면 cellEdit 옵션을 통해 편집모드를 사용하여 셀을 편집하게 되는 경우가 있는데, 이때 "editable-cell", "not-editable-cell" 이라는 클래스 속성을 통해 편집 유무를 설정할 수 있다. 예제를 통해 몇가지 방법에 대해 배워보자. ▷ 1. cellattr 옵션을 통한 편집 유무 설정하기 (ft. 편집 방지) cellattr : function(rowid, value, rawObject, cm, rdata){ //필요에 따라서 if 조건문을 걸어 조건에 맞는 cell만 편집 방지 return "class='not-editable-cell'"; }, cellattr 옵션은 jqgrid에서 사용되는 col.. 2021. 12. 30.
반응형
TOP