Underscore.JS - Hướng dẫn nhanh
Underscore.JS là một thư viện dựa trên javascript phổ biến cung cấp hơn 100 chức năng để hỗ trợ phát triển web. Nó cung cấp các chức năng trợ giúp như bản đồ, bộ lọc, gọi cũng như ràng buộc hàm, tạo khuôn mẫu javascript, kiểm tra bình đẳng sâu, tạo chỉ mục, v.v. Underscore.JS có thể được sử dụng trực tiếp trong trình duyệt và cả với Node.js.
Làm việc với các đối tượng bằng JavaScript có thể khá khó khăn, cụ thể là nếu bạn phải thực hiện nhiều thao tác với chúng. Dấu gạch dưới đi kèm với rất nhiều tính năng giúp giảm bớt công việc của bạn với các đối tượng.
Underscore.JS là một dự án mã nguồn mở và bạn có thể dễ dàng đóng góp cho thư viện và thêm các tính năng dưới dạng plugin và cung cấp nó trên GitHub và trong Node.js.
Đặc trưng
Hãy để chúng tôi hiểu chi tiết tất cả các tính năng quan trọng có sẵn với Dấu gạch dưới -
Bộ sưu tập
Underscore.JS cung cấp các chức năng khác nhau cho các tập hợp như từng, ánh xạ, thu gọn được sử dụng để áp dụng một thao tác trên từng mục của tập hợp. Nó cung cấp phương thức như groupBy, countBy, max, min để xử lý các bộ sưu tập và dễ dàng thực hiện nhiều tác vụ.
Mảng
Underscore.JS cung cấp các chức năng khác nhau cho các mảng như lặp lại và xử lý các mảng như đầu tiên, ban đầu, cuối cùngIndexOf, giao điểm, sự khác biệt, v.v.
Chức năng
Underscore.JS cung cấp các chức năng như ràng buộc, trì hoãn, trước, sau, v.v.
Các đối tượng
Underscore.JS cung cấp các chức năng để thao tác các đối tượng, để ánh xạ các đối tượng và so sánh các đối tượng. Ví dụ: khóa, giá trị, mở rộng, mở rộng, riêng, isEqual, isEmpty, v.v.
Tiện ích
Underscore.JS cung cấp các phương thức tiện ích khác nhau như noConflict, random, iteratee, Escape, v.v.
Chuỗi
Underscore.JS cung cấp các phương thức chuỗi cũng như chuỗi, giá trị.
Trong các chương tiếp theo, chúng tôi sẽ đề cập đến các chức năng quan trọng của Dấu gạch dưới.
Trong chương này, bạn sẽ tìm hiểu chi tiết về cách thiết lập môi trường làm việc của Underscore.JS trên máy tính cục bộ của bạn. Trước khi bắt đầu làm việc với Underscore.JS, bạn cần có quyền truy cập vào thư viện. Bạn có thể truy cập các tệp của nó bằng bất kỳ phương pháp nào sau đây:
Phương pháp 1: Sử dụng tệp Underscore.JS trong trình duyệt
Trong phương pháp này, chúng tôi sẽ cần tệp Underscore.JS từ trang web chính thức của nó và sẽ sử dụng nó trực tiếp trong trình duyệt.
Bước 1
Bước đầu tiên, hãy truy cập trang web chính thức của Underscore.JS https://underscorejs.org/.
Quan sát rằng có một tùy chọn tải xuống có sẵn để cung cấp cho bạn tệp underscore-min.js UMD (Sản xuất) mới nhất hiện có. Nhấp chuột phải vào liên kết và chọn lưu dưới dạng. Lưu ý rằng tệp có sẵn có và không có thu nhỏ.
Bước 2
Bây giờ, bao gồm underscore-min.js bên trong scriptvà bắt đầu làm việc với Underscore.JS. Đối với điều này, bạn có thể sử dụng mã được cung cấp bên dưới -
<script type = "text/JavaScript" src = "https://underscorejs.org/underscore-min.js"></script>
Dưới đây là một ví dụ hoạt động và đầu ra của nó để hiểu rõ hơn -
Thí dụ
<html>
<head>
<title>Underscore.JS - Working Example</title>
<script type = "text/JavaScript" src = "https://underscorejs.org/underscore-min.js"></script>
<style>
div {
border: solid 1px #ccc;
padding:10px;
font-family: "Segoe UI",Arial,sans-serif;
width: 50%;
}
</style>
</head>
<body>
<div style = "font-size:25px" id = "list">
</div>
<script type = "text/JavaScript">
var numbers = [1, 2, 3, 4];
var listOfNumbers = '';
_.each(numbers, function(x) { listOfNumbers += x + ' ' });
document.getElementById("list").innerHTML = listOfNumbers;
</script>
</body>
</html>
Đầu ra
Phương pháp 2: Sử dụng Node.js
Nếu bạn đang chọn phương pháp này, hãy đảm bảo rằng bạn có Node.js và npmđược cài đặt trên hệ thống của bạn. Bạn có thể sử dụng lệnh sau để cài đặt Underscore.JS -
npm install underscore
Bạn có thể quan sát kết quả sau khi Underscore.JS được cài đặt thành công:
+ underscore@1.10.2
added 1 package from 1 contributor and audited 1 package in 6.331s
found 0 vulnerabilities
Bây giờ, để kiểm tra xem Underscore.JS có hoạt động tốt với Node.js hay không, hãy tạo tệp tester.js và thêm mã sau vào nó:
var _ = require('underscore');
var numbers = [1, 2, 3, 4];
var listOfNumbers = '';
_.each(numbers, function(x) { listOfNumbers += x + ' ' });
console.log(listOfNumbers);
Lưu chương trình trên vào tester.js. Các lệnh sau được sử dụng để biên dịch và thực thi chương trình này.
Chỉ huy
\>node tester.js
Đầu ra
1 2 3 4
Underscore.JS có nhiều phương pháp dễ sử dụng giúp lặp lại các Bộ sưu tập. Chương này thảo luận chi tiết về chúng.
Underscore.JS cung cấp các phương pháp khác nhau để lặp lại các Bộ sưu tập như được liệt kê bên dưới:
Sr.No. | Phương thức & Cú pháp |
---|---|
1 | mỗi _.each (danh sách, lặp lại, [ngữ cảnh]) |
2 | bản đồ _.map (danh sách, lặp lại, [ngữ cảnh]) |
3 | giảm _.reduce (danh sách, lặp lại, [bản ghi nhớ], [ngữ cảnh]) |
4 | giảm thiểu _.reduceRight (danh sách, lặp lại, [bản ghi nhớ], [ngữ cảnh]) |
5 | tìm thấy _.find (danh sách, vị ngữ, [ngữ cảnh]) |
6 | bộ lọc _.filter (danh sách, vị từ, [ngữ cảnh]) |
7 | Ở đâu _.where (danh sách, thuộc tính) |
số 8 | findWhere _.findWhere (danh sách, thuộc tính) |
9 | Từ chối _.reject (danh sách, vị từ, [ngữ cảnh]) |
10 | mỗi _.every (danh sách, [vị từ], [ngữ cảnh]) |
11 | một số _.some (danh sách, [vị từ], [ngữ cảnh]) |
Underscore.JS có nhiều phương pháp dễ sử dụng giúp xử lý Bộ sưu tập. Chương này thảo luận chi tiết về chúng.
Underscore.JS cung cấp các phương pháp khác nhau để xử lý Bộ sưu tập như được liệt kê bên dưới:
Sr.No. | Phương thức & Cú pháp |
---|---|
1 | chứa đựng _.contains (danh sách, giá trị, [fromIndex]) |
2 | cầu khẩn _.invoke (đối số list, methodName, *) |
3 | nhổ lông _.pluck (list, propertyName) |
4 | tối đa _.max (danh sách, [lặp lại], [ngữ cảnh]) |
5 | min _.min (danh sách, [lặp lại], [ngữ cảnh]) |
6 | sortBy _.sortBy (list, iteratee, [context]) |
7 | groupBy _.groupBy (danh sách, lặp lại, [ngữ cảnh]) |
số 8 | indexBy _.indexBy (list, iteratee, [context]) |
9 | countBy _.countBy (list, iteratee, [context]) |
10 | xáo trộn _.shuffle (danh sách) |
11 | mẫu vật _.sample (danh sách, [n]) |
12 | toArray _.toArray (danh sách) |
13 | kích thước _.size (danh sách) |
14 | vách ngăn _. phân vùng (danh sách, vị ngữ) |
15 | gọn nhẹ _.compact (danh sách) |
Underscore.JS có nhiều phương pháp dễ sử dụng giúp lặp lại Mảng. Chương này thảo luận chi tiết về chúng.
Underscore.JS cung cấp các phương pháp khác nhau để lặp lại các Mảng như được liệt kê bên dưới:
Sr.No. | Phương thức & Cú pháp |
---|---|
1 | Đầu tiên _.first (mảng, [n]) |
2 | ban đầu _.initial (mảng, [n]) |
3 | Cuối cùng _.last (mảng, [n]) |
4 | nghỉ ngơi _.rest (mảng, [chỉ số]) |
5 | Chỉ số _.indexOf (mảng, giá trị, [được sắp xếp]) |
6 | lastIndexOf _.lastIndexOf (mảng, giá trị, [fromIndex]) |
7 | sortedIndex _.sortedIndex (mảng, giá trị, [lặp lại], [ngữ cảnh]) |
số 8 | findIndex _.findIndex (mảng, vị từ, [ngữ cảnh]) |
9 | findLastIndex _.findLastIndex (mảng, vị từ, [ngữ cảnh]) |
Underscore.JS có nhiều phương pháp dễ sử dụng giúp xử lý Mảng. Chương này thảo luận chi tiết về chúng.
Underscore.JS cung cấp các phương pháp khác nhau để xử lý Mảng như được liệt kê bên dưới:
Sr.No. | Phương thức & Cú pháp |
---|---|
1 | làm phẳng _.flatten (mảng, [cạn]) |
2 | không có _.without (mảng, * giá trị) |
3 | liên hiệp _.union (* mảng) |
4 | ngã tư _.intersection (* mảng) |
5 | Sự khác biệt _.difference (mảng, * những cái khác) |
6 | uniq _.uniq (mảng, [được sắp xếp], [lặp]) |
7 | zip _.zip (* mảng) |
số 8 | giải nén _.unzip (mảng) |
9 | vật _.object (danh sách, [giá trị]) |
10 | khúc gỗ _.chunk (mảng, độ dài) |
11 | phạm vi _.range ([bắt đầu], dừng lại, [bước]) |
Underscore.JS có nhiều phương pháp dễ sử dụng giúp xử lý các hàm. Chương này thảo luận chi tiết về chúng.
Underscore.JS cung cấp nhiều phương pháp khác nhau để xử lý các hàm như được liệt kê bên dưới:
Sr.No. | Phương thức & Cú pháp |
---|---|
1 | trói buộc _.bind (hàm, đối tượng, * đối số) |
2 | một phần _.partial (hàm, * đối số) |
3 | ghi nhớ _.memoize (function, [hashFunction]) |
4 | sự chậm trễ _.delay (đối số hàm, đợi, *) |
5 | Một lần _.once (hàm) |
6 | trước _.before (đếm, hàm) |
7 | bọc lại _.wrap (hàm, trình bao bọc) |
số 8 | phủ nhận _.negate (vị ngữ) |
9 | soạn, biên soạn _.compose (* các hàm) |
Underscore.JS có nhiều phương thức dễ sử dụng giúp ánh xạ các đối tượng. Chương này thảo luận chi tiết về chúng.
Underscore.JS cung cấp các phương pháp khác nhau để xử lý ánh xạ đối tượng như được liệt kê bên dưới:
Sr.No. | Phương thức & Cú pháp |
---|---|
1 | chìa khóa _.keys (đối tượng) |
2 | allKeys _.allKeys (đối tượng) |
3 | giá trị _.values (đối tượng) |
4 | mapObject _.mapObject (đối tượng, vòng lặp, [ngữ cảnh]) |
5 | cặp _.pairs (đối tượng) |
6 | đảo ngược _.invert (đối tượng) |
7 | tạo nên _.create (nguyên mẫu, đạo cụ) |
số 8 | chức năng _.functions (đối tượng) |
9 | findKey _.findKey (đối tượng, vị từ, [ngữ cảnh]) |
Underscore.JS có nhiều phương pháp dễ sử dụng giúp cập nhật các đối tượng. Chương này thảo luận chi tiết về chúng.
Underscore.JS cung cấp các phương pháp khác nhau để xử lý các cập nhật đối tượng như được liệt kê bên dưới:
Sr.No. | Phương thức & Cú pháp |
---|---|
1 | mở rộng _.extend (đích, * nguồn) |
2 | hái _.pick (đối tượng, phím *) |
3 | bỏ sót _.omit (đối tượng, phím *) |
4 | mặc định _.defaults (đối tượng, * mặc định) |
5 | nhân bản _.clone (đối tượng) |
6 | gõ nhẹ _.tap (đối tượng, bộ đánh chặn) |
7 | có _.has (đối tượng, khóa) |
số 8 | bất động sản _.property (đường dẫn) |
9 | tài sản của _.propertyOf (đối tượng) |
Underscore.JS có nhiều phương pháp dễ sử dụng giúp so sánh các đối tượng. Chương này thảo luận chi tiết về chúng.
Underscore.JS cung cấp các phương pháp khác nhau để xử lý so sánh đối tượng như được liệt kê bên dưới:
Sr.No. | Phương thức & Cú pháp |
---|---|
1 | người kết hợp _.matcher (đính kèm) |
2 | isEqual _.isEqual (đối tượng, khác) |
3 | isMatch _.isMatch (đối tượng, thuộc tính) |
4 | isEmpty _.isEmpty (đối tượng) |
5 | isArray _.isArray (đối tượng) |
6 | isObject _.isObject (giá trị) |
7 | isArguments _.isArguments (đối tượng) |
số 8 | isFunction _.isFunction (đối tượng) |
9 | isString _.isString (đối tượng) |
10 | isNumber _.isNumber (đối tượng) |
11 | isFinite _.isFinite (đối tượng) |
12 | isBoolean _.isBoolean (đối tượng) |
13 | isDate _.isDate (đối tượng) |
14 | isRegExp _.isRegExp (đối tượng) |
15 | isError _.isError (đối tượng) |
16 | isSymbol _.isSymbol (đối tượng) |
17 | isMap _.isMap (đối tượng) |
18 | isWeakMap _.isWeakMap (đối tượng) |
19 | isSet _.isSet (đối tượng) |
20 | isWeakSet _.isWeakSet (đối tượng) |
21 | isNaN _.isNaN (đối tượng) |
22 | isNull _.isNull (đối tượng) |
23 | không định nghĩa được _.isUndefined (giá trị) |
Underscore.JS có nhiều phương thức tiện ích dễ sử dụng. Chương này thảo luận chi tiết về chúng.
Underscore.JS cung cấp các phương thức tiện ích khác nhau như được liệt kê bên dưới:
Sr.No. | Phương thức & Cú pháp |
---|---|
1 | danh tính _.identity (giá trị) |
2 | không thay đổi _.giá trị hiện có) |
3 | không ra đâu _.không ra đâu() |
4 | lần _.times (n, lặp lại, [ngữ cảnh]) |
5 | ngẫu nhiên _ .random (tối thiểu, tối đa) |
6 | mixin _.mixin (đối tượng) |
7 | lặp lại _.iteratee (giá trị, [ngữ cảnh]) |
số 8 | uniqueId _.uniqueId ([tiền tố]) |
9 | bỏ trốn _.escape (chuỗi) |
10 | unescape _.unescape (chuỗi) |
11 | kết quả _.result (đối tượng, thuộc tính, [defaultValue]) |
12 | hiện nay _.hiện nay() |
13 | bản mẫu _.template (templateString, [cài đặt]) |
Underscore.JS có các phương pháp để tạo một chuỗi các phương pháp và sau đó thu lại kết quả hiệu quả của chúng. Chương này thảo luận chi tiết về chúng.
Underscore.JS cung cấp các phương thức tiện ích khác nhau như được liệt kê bên dưới:
Sr.No. | Phương thức & Cú pháp |
---|---|
1 | chuỗi _.chain (đối tượng) |
2 | giá trị _.chain (obj) .value () |