상세 컨텐츠

본문 제목

javascript underscore 언더스코어

웹 < 프론트앤드 >/자바스크립트

by 코린’s 2023. 5. 16. 09:12

본문

728x90
반응형

Underscore.js는 자바스크립트 라이브러리 중 하나로, 다양한 유틸리티 함수를 제공하여 개발자가 자바스크립트 코드를 더욱 효율적이고 간결하게 작성할 수 있도록 도와줍니다. 이 라이브러리는 함수형 프로그래밍 스타일을 적극적으로 지원하며, 객체, 배열, 함수, 컬렉션 등에 대한 다양한 메서드를 제공합니다.

Underscore.js는 다양한 환경에서 동작하기 때문에 브라우저에서도 사용할 수 있으며, Node.js 환경에서도 사용할 수 있습니다. 이 라이브러리를 사용하면 자바스크립트 코드를 작성할 때 다양한 상황에서 편리하게 활용할 수 있는 유틸리티 함수들을 쉽게 사용할 수 있습니다.

예를 들어, 배열에서 특정 값이 있는지 확인하거나, 배열 또는 객체를 정렬하거나, 컬렉션을 필터링하거나, 함수를 캐싱하거나, 디바운스 또는 스로틀링을 구현하는 등 다양한 기능을 제공합니다. 이러한 기능들을 통해 코드를 더욱 간결하고 가독성 높게 작성할 수 있습니다.

 


Underscore.js는 매우 다양한 유틸리티 함수들을 제공합니다. 여기에는 대표적인 함수들만 나열했습니다.

1. Collections
   - each()
   - map()
   - reduce()
   - reduceRight()
   - find()
   - filter()
   - where()
   - findWhere()
   - reject()
   - every()
   - some()
   - contains()
   - invoke()
   - pluck()
   - max()
   - min()
   - sortBy()
   - groupBy()
   - indexBy()
   - countBy()
   - shuffle()
   - sample()
   - toArray()
   - size()

2. Arrays
   - first()
   - initial()
   - last()
   - rest()
   - compact()
   - flatten()
   - without()
   - union()
   - intersection()
   - difference()
   - uniq()
   - zip()
   - unzip()
   - object()
   - indexOf()
   - lastIndexOf()
   - sortedIndex()
   - range()

3. Functions
   - bind()
   - bindAll()
   - partial()
   - memoize()
   - delay()
   - defer()
   - throttle()
   - debounce()
   - once()
   - after()
   - before()
   - wrap()
   - negate()
   - compose()

4. Objects
   - keys()
   - allKeys()
   - values()
   - mapObject()
   - pairs()
   - invert()
   - create()
   - functions()
   - findKey()
   - extend()
   - extendOwn()
   - pick()
   - omit()
   - defaults()
   - clone()
   - tap()
   - has()
   - property()
   - propertyOf()
   - matcher()
   - isEqual()
   - isMatch()
   - isEmpty()

5. Utility
   - noConflict()
   - identity()
   - constant()
   - noop()
   - times()
   - random()
   - mixin()
   - iteratee()
   - uniqueId()
   - escape()
   - unescape()
   - result()
   - now()
   - template()

Underscore.js는 이 외에도 다양한 함수들을 제공합니다. 이러한 함수들은 자바스크립트 개발을 보다 쉽고 간편하게 만들어줍니다.


Underscore.js는 다양한 유틸리티 함수들을 제공합니다. 이 중 일부 함수들과 해당 함수들의 예제를 살펴보겠습니다.

1. map()
배열의 각 요소를 변환하여 새로운 배열을 반환합니다.

예제:
```
_.map([1, 2, 3], function(num){ return num * 2; });
// [2, 4, 6]
```

2. reduce()
배열의 각 요소를 순회하며 값을 누적하여 하나의 결과값을 반환합니다.

예제:
```
var sum = _.reduce([1, 2, 3], function(memo, num){ return memo + num; }, 0);
// 6
```

3. filter()
배열의 각 요소를 필터링하여 새로운 배열을 반환합니다.

예제:
```
var evens = _.filter([1, 2, 3, 4, 5, 6], function(num){ return num % 2 == 0; });
// [2, 4, 6]
```

4. find()
배열에서 조건을 만족하는 첫 번째 요소를 반환합니다.

예제:
```
var even = _.find([1, 2, 3, 4, 5, 6], function(num){ return num % 2 == 0; });
// 2
```

5. pluck()
객체 배열에서 지정한 속성 값을 추출하여 새로운 배열을 반환합니다.

예제:
```
var people = [{name: 'John', age: 23}, {name: 'Mary', age: 32}];
var names = _.pluck(people, 'name');
// ['John', 'Mary']
```

6. extend()
객체를 병합하여 새로운 객체를 반환합니다.

예제:
```
var obj1 = {name: 'John', age: 23};
var obj2 = {job: 'Developer'};
var newObj = _.extend(obj1, obj2);
// {name: 'John', age: 23, job: 'Developer'}
```

7. debounce()
함수 호출을 지연시키고, 이전 호출 이후 일정 시간이 지난 후 함수를 실행합니다.

예제:
```
function searchQuery(query) {
  // 검색 쿼리 실행
}
var debounceSearchQuery = _.debounce(searchQuery, 300);
$('input').on('input', function(event) {
  debounceSearchQuery(event.target.value);
});
```


 

728x90
반응형

'웹 < 프론트앤드 > > 자바스크립트' 카테고리의 다른 글

콜백함수  (0) 2023.06.27
화살표 함수  (0) 2023.05.17
원시자료형과 참조 자료형  (0) 2023.05.01
객체  (0) 2023.04.25
배열  (0) 2023.04.24

관련글 더보기