개요
Underscore.js는 4KB 압축 만있는 매우 마른 라이브러리입니다. 수십 가지 기능 프로그래밍 방법을 제공하여 JavaScript 프로그래밍을 크게 용이하게합니다. MVC 프레임 워크 Backbone.js는이 라이브러리를 기반으로합니다.
밑줄 (_) 객체를 정의하고 기능 라이브러리의 모든 방법은이 객체에 속합니다. 이러한 방법은 수집, 배열, 기능, 개체 및 유틸리티의 5 가지 범주로 대략적으로 나눌 수 있습니다.
node.js 아래에 설치하십시오
coundscore.js는 브라우저 환경뿐만 아니라 node.js에서도 사용할 수 있습니다. 설치 명령은 다음과 같습니다.
코드 사본은 다음과 같습니다.
NPM 설치 밑줄
그러나 node.js는 _을 변수 이름으로 직접 사용할 수 없으므로 다음 방법을 사용하여 alterscore.js를 사용해야합니다.
코드 사본은 다음과 같습니다.
var u = 요구 사항 ( "밑줄");
수집과 관련된 방법
배열과 객체의 두 가지 구조를 포함하여 JavaScript 언어의 데이터 수집. 다음 방법은 두 구조 모두에 적용됩니다.
지도
이 방법은 차례로 컬렉션의 각 멤버에서 일부 작업을 수행하고 반환 된 값을 차례로 새로운 배열로 저장합니다.
코드 사본은 다음과 같습니다.
_.map ([1, 2, 3], 함수 (num) {return num * 3;}); // [3, 6, 9] _.map ({one : 1, 2 : 2, 3 : 3}, 함수 (num, key) {return num * 3;}); // [3, 6, 9]
각
이 방법은 MAP와 유사하므로 세트의 각 멤버에서 순서대로 일부 작업을 수행하지만 값을 반환하지 않습니다.
코드 사본은 다음과 같습니다.
_.Each ([1, 2, 3], 경고); _.Each ({one : 1, 2 : 2, 3 : 3}, 경고);
줄이다
이 방법은 세트의 각 멤버에서 순서대로 일부 작업을 수행 한 다음 특정 초기 값으로 작업 결과를 축적합니다. 모든 작업이 완료되면 누적 된 값이 반환됩니다.
이 메소드는 세 가지 매개 변수를 허용합니다. 첫 번째 매개 변수는 처리 할 세트이고, 두 번째 매개 변수는 각 멤버에서 작동하는 함수이고, 세 번째 매개 변수는 축적에 사용되는 변수입니다.
_.reduce ([1, 2, 3], 함수 (메모, num) {return memo + num;}, 0); // 6
감소 방법의 두 번째 매개 변수는 작동 함수이며, 자체는 두 개의 매개 변수를 허용합니다. 첫 번째는 축적에 사용되는 변수이고, 두 번째는 세트의 각 멤버의 값입니다.
필터링 및 거부
필터 메소드는 컬렉션의 각 멤버에서 차례로 일부 작업을 수행하며 작업 결과가 맞는 멤버 만 반환합니다.
코드 사본은 다음과 같습니다.
_.filter ([1, 2, 3, 4, 5, 6], 함수 (num) {return num % 2 == 0;}); // [2, 4, 6]
거부 방법은 작업 결과가 False 인 멤버 만 반환합니다.
코드 사본은 다음과 같습니다.
_.reject ([1, 2, 3, 4, 5, 6], 함수 (num) {return num % 2 == 0;}); // [1, 3, 5]
모든 것
모든 방법은 컬렉션의 각 구성원에서 차례로 일부 작업을 수행합니다. 모든 멤버의 작업 결과가 참이되면 true가 반환됩니다. 그렇지 않으면 False가 반환됩니다.
코드 사본은 다음과 같습니다.
_. // 거짓
멤버의 작업 결과가있는 한 일부 메소드는 TRUE를 반환합니다. 그렇지 않으면 False.
코드 사본은 다음과 같습니다.
_. SOME ([1, 2, 3, 4, 5, 6], 함수 (num) {return num % 2 == 0;}); // 진실
찾다
이 메소드는 세트의 각 멤버에서 순서대로 일부 작업을 수행하여 첫 번째 작업 결과가 True 인 멤버를 반환합니다. 모든 멤버의 작업 결과가 False 인 경우 정의되지 않은 것이 반환됩니다.
코드 사본은 다음과 같습니다.
_.find ([1, 2, 3, 4, 5, 6], 함수 (num) {return num % 2 == 0;}); // 2
포함
값이 세트 내에 있으면 메소드가 true를 반환하고 그렇지 않으면 false를 반환합니다.
코드 사본은 다음과 같습니다.
_. 포함 ([1, 2, 3], 3); // 진실
COUNTBY
이 방법은 세트의 각 멤버에서 순서대로 일부 작업을 수행하고 클래스와 동일한 작업 결과를 가진 멤버를 계산하고 마지막으로 객체를 반환하여 각 작업 결과에 해당하는 멤버 수를 나타냅니다.
코드 사본은 다음과 같습니다.
_. // {홀수 : 3, 짝수 : 2}
혼합
이 방법은 무질서한 순서 모음을 반환합니다.
코드 사본은 다음과 같습니다.
_.shuffle ([1, 2, 3, 4, 5, 6]; // [4, 1, 6, 3, 5, 2]
크기
이 메소드는 컬렉션의 멤버 수를 반환합니다.
코드 사본은 다음과 같습니다.
_.size ({one : 1, 2 : 2, 3 : 3}); // 3
객체 관련 방법
toarray
이 메소드는 객체를 배열로 변환합니다.
코드 사본은 다음과 같습니다.
_.toArray ({a : 0, b : 1, c : 2}); // [0, 1, 2]
당기기
이 방법은 여러 객체의 속성 값을 배열로 추출합니다.
코드 사본은 다음과 같습니다.
var standes = [{name : 'moe', age : 40}, {이름 : 'larry', age : 50}, {name : 'curly', age : 60}]; _.pluck (Stooges, 'name'); // [ "Moe", "Larry", "Curly"]
함수와 관련된 방법
묶다
이 메소드는 함수 런타임의 컨텍스트를 바인딩하고 새로운 기능으로 리턴합니다.
코드 사본은 다음과 같습니다.
_.bind (함수, 객체, [*arguments])
아래 예제를 참조하십시오.
코드 사본은 다음과 같습니다.
var o = {p : 2, m : function () {console.log (p);}}; om () // 2 _.bind (om, {p : 1}) () // 1
묶음
이 방법은 객체의 모든 방법을 해당 객체에 바인딩합니다.
코드 사본은 다음과 같습니다.
var buttonView = {label : 'aUndscore', onclick : function () {alert ( 'clicked :' + this.label); }, onhover : function () {console.log ( '호버링 :' + this.label); }}; _.bindall (ButtonView);
부분적
이 메소드 바인딩은 함수를 매개 변수에 바인딩하고 새로운 함수로 반환합니다.
코드 사본은 다음과 같습니다.
var add = function (a, b) {return a + b; }; add5 = _. 파티 (Add, 5); add5 (10); // 15
추억
이 메소드는 매개 변수의 함수 실행 결과를 캐시합니다.
코드 사본은 다음과 같습니다.
var fibonacci = _.memoize (function (n) {return n <2? n : fibonacci (n -1) + fibonacci (n -2);});
함수에 여러 매개 변수가있는 경우 캐시를 식별하는 해시 값을 생성하려면 해시 기능을 제공해야합니다.
지연
이 방법은 실행하기 전에 지정된 시간 동안 기능을 지연시킬 수 있습니다.
코드 사본은 다음과 같습니다.
var log = _.bind (console.log, console); _.delay (로그, 1000, '나중에 로그인'); // '나중에 로그인'
연기
이 방법은 실행하기 전에 실행될 작업 수가 0 초만 지연되는 효과와 유사하게 실행될 때까지 기능을 연기 할 수 있습니다.
코드 사본은 다음과 같습니다.
_.defer (function () {alert ( 'Deferred');});
조절판
이 메소드는 새 버전의 함수를 반환합니다. 이 새 버전의 함수를 지속적으로 호출 할 때는 다음 실행이 트리거되기 전에 일정 시간을 기다려야합니다.
코드 사본은 다음과 같습니다.
// 업데이트 기능의 새 버전을 반환합니다. // 함수의 새 버전은 $ (창) .scroll (스로틀) 만 트리거됩니다.
분노
이 메소드는 또한 새로운 버전의 함수를 반환합니다. 이 새 버전의 함수가 호출 될 때마다 마지막 호출에서 특정 시간 간격이어야합니다. 그렇지 않으면 유효하지 않습니다. 일반적인 응용 프로그램은 사용자가 버튼을 두 번 클릭하지 못하도록하여 두 가지 양식 제출물이 발생하는 것입니다.
코드 사본은 다음과 같습니다.
$ ( "버튼").
한 번
이 메소드는 함수를 한 번만 실행할 수 있도록 새로운 버전의 함수를 반환합니다. 주로 객체 초기화에 사용됩니다.
코드 사본은 다음과 같습니다.
var initialize = _.once (createApplication); 초기화 (); 초기화 (); // 응용 프로그램은 한 번만 작성됩니다
후에
이 메소드는 새로운 버전의 함수를 반환하며, 이는 특정 횟수로 불리는 후에 만 실행됩니다. 주로 반응하기 전에 일련의 작업이 완료되었음을 확인하는 데 사용됩니다.
코드 사본은 다음과 같습니다.
var rendernotes = _.after (notes.length, render); _.Each (참고, 함수 (참고) {note.asyncsave ({성공 : rendernotes});}); // 모든 메모가 저장되고 렌더 노테는 한 번 실행됩니다
포장하다
이 메소드는 하나의 함수로 매개 변수로 다른 함수로 전달되며 마지막으로 전자의 새 버전을 반환합니다.
코드 사본은 다음과 같습니다.
var hello = function (name) {return "hello :" + name; }; hello = _.wrap (hello, function (func) {return "~" + func ( "moe") + ", at apject";}); 안녕하세요(); // '전, Hello : Moe, After'
구성하다
이 메소드는 일련의 함수를 매개 변수로 받아들이고, 뒤로 실행되며, 이전 기능의 실행 결과는 다음 함수의 실행 매개 변수로 사용됩니다. 즉, f (g (), h ())의 형태를 f (g (h ()))로 변환합니다.
코드 사본은 다음과 같습니다.
var greet = function (name) {return "hi :" + name; }; var excem = function (state) {return state + "!"; }; var welcome = _.com clese (외식, 인사); 환영합니다 ( 'moe'); // 'Hi : Moe!'
도구 및 방법
주형
이 방법은 HTML 템플릿을 컴파일하는 데 사용됩니다. 세 가지 매개 변수를 허용합니다.
코드 사본은 다음과 같습니다.
_.template (templatestring, [data], [settings])
세 매개 변수의 의미는 다음과 같습니다.
Templatestring : 템플릿 문자열
데이터 : 템플릿의 데이터를 입력하십시오
설정 : 설정
템플릿 스트링
템플릿 문자열 templatestring은 일반적인 HTML 언어이며, 여기서 변수는 < %=… %>의 형태로 삽입됩니다. 데이터 객체는 변수의 값을 제공합니다.
코드 사본은 다음과 같습니다.
var txt = "
< %= Word %>
코드 사본은 다음과 같습니다.
"; _.template (txt, {Word :"Hello World "}) //"
안녕하세요 세계
코드 사본은 다음과 같습니다.
"
변수의 값에 5 개의 특수 문자 (& <>” /)가 포함 된 경우 < %-… %>로 탈출해야합니다.
코드 사본은 다음과 같습니다.
var txt = "
< %- 단어 %>
코드 사본은 다음과 같습니다.
"; _.template (txt, {Word :"H & W "}) //
H & W
JavaScript 명령은 < %… %>의 형태로 삽입 될 수 있습니다. 아래는 판결 진술의 예입니다.
코드 사본은 다음과 같습니다.
var txt = "< %var i = 0; if (i <1) { %>" + "< %= Word %>" + "< %} %>"; _.template (txt, {Word : "Hello World"}) // Hello World
일반적인 사용법에는 루프 문이 포함됩니다.
코드 사본은 다음과 같습니다.
var list = "< % _.each (사람, 함수 (이름) { %>
<%= 이름%> <%}); %> "; _.template (list, {people : [ 'moe', 'curly', 'larry']); //"
모
곱슬
래리”
템플릿 메소드에 첫 번째 매개 변수 템플릿 스트링 만 있고 두 번째 매개 변수가 생략되면 함수가 반환되고 향후이 함수에 데이터가 입력 될 수 있습니다.
코드 사본은 다음과 같습니다.
var t1 = _.template ( "hello <%= user%>!"); T1 ({user : ""}) // '안녕하세요!'
데이터
Templatestring의 모든 변수는 내부적으로 OBJ 객체의 속성이며 OBJ 객체는 두 번째 매개 변수 데이터 객체를 나타냅니다. 다음 두 문장은 동일합니다.
코드 사본은 다음과 같습니다.
_.template ( "hello <%= user%>!", {user : ""}) _.template ( "hello <%= obj.user%>!", {user : ""})
OBJ 객체의 이름을 변경하려면 세 번째 매개 변수로 설정해야합니다.
코드 사본은 다음과 같습니다.
_.template ( "< %if (data.title) { %> 제목 : < %= title %> < %} %>", null, {변수 : "data"});
템플릿은 변수를 교체 할 때 내부적으로 문장과 함께 사용하기 때문에 위의 방법은 더 빠르게 실행됩니다.