Thư viện lodash là một thư viện javascript hay, có nhiều chức năng giúp xử lý array, date, function, lang, math, number, string, util…
Nhúng thư viện lodash vào trang
- Download : Vào https://lodash.com => chọn Full build => rồi Save file về máy
- Nhúng lodash.js vào trang html với lệnh <script src=”lodash.js”></script>
Chú ý: Có thể nhúng trực tiếp từ CDN như bên dưới (có thể đổi 4.17.21 thành version khác nếu cần)
<script src=”https://cdn.jsdelivr.net/npm/lodash@4.17.21/lodash.min.js”> </script>
Các hàm thông dụng trong thư viện lodash
_.concat() : Hàm tạo 1 mảng bằng cách ghép các tham số lại
<script>
arr1 = ['Gạo','Mắm'];
arr2 = _.concat("Dưa", arr1, "Cà");
console.log(arr2); //["Dưa", "Gạo", "Mắm", "Cà"]
</script>_.chunk() : Đây là hàm tạo 1 mảng dựa trên 1 mảng đã có , gồm các mảng con có số phần tử truyền vào
<script>
arr = ['ba','sẽ','là','cánh','chim','đưa','con','đi','thật','xa','mẹ','sẽ','là'];
arr2 = _.chunk(arr, 5);
console.log(arr2); // ["ba", "sẽ", "là", "cánh", "chim"]
// ["đưa", "con", "đi", "thật", "xa"]
// ["mẹ", "sẽ", "là"]
</script>_.findindex() : Hàm trả về vị trí của phần tử với điều kiện chỉ ra
<script>
sachhay = [
{'id':'mht', 'ten':'Mùi Hương Trầm','gia': 72000},
{'id':'n20', 'ten':'Nói với tuổi 20','gia': 25000},
{'id':'quanglo', 'ten':'Quẳng gánh lo đi','gia': 81000},
{'id':'sm', 'ten':'Sức mạnh của thói quen','gia': 125000},
];
vt = _.findIndex(sachhay, function(s){ return s.ten.indexOf('a')>=0; })
console.log(vt); // 3
</script>_.filter() : Hàm trả về 1 mảng các gồm các phẩn tử thỏa điều kiện chỉ ra
<script>
sachhay = [
{'id':'mht', 'ten':'Mùi Hương Trầm','gia': 72000},
{'id':'n20', 'ten':'Nói với tuổi 20','gia': 25000},
{'id':'quanglo', 'ten':'Quẳng gánh lo đi','gia': 81000},
{'id':'sm', 'ten':'Sức mạnh của thói quen','gia': 125000},
];
arr = _.filter(sachhay, function(s){ return s.ten.indexOf('t')>=0; })
console.log(arr);
// [ {id: "n20", ten: "Nói với tuổi 20", gia: 25000},
// {id: "sm", ten: "Sức mạnh của thói quen", gia: 125000}
</script>_.find() : Hàm này trả về phần tử đầu tiên trong mảng thõa điều kiện trong hàm callback
<script>
sachhay = [
{'id':'mht', 'ten':'Mùi Hương Trầm','gia': 72000},
{'id':'n20', 'ten':'Nói với tuổi 20','gia': 25000},
{'id':'qlo', 'ten':'Quẳng gánh lo đi','gia': 81000},
{'id':'sm', 'ten':'Sức mạnh của thói quen','gia': 125000},
];
arr = _.find(sachhay, function(s){ return s.gia>=75000; })
console.log(arr); //{'id':'qlo', 'ten':'Quẳng gánh lo đi','gia': 81000},
</script>_.includes() : Là hàm giúp kiểm tra 1 giá trị có trong mảng hay không, kết quả là true/false
<script>
words = ["Trời", "Buồn", "Làm", "Gì", "Trời", "Rầu","Rầu"];
kq = _.includes(words, "Rầu");
console.log(kq); // True
</script>Hàm _.map() : Tạo ra 1 mảng mới bằng cách biến đổi từng phần tử trong mảng
<script>
words = ["Trời", "Buồn", "Làm", "Gì", "Trời", "Rầu","Rầu"];
words1 = _.map(words, function(w){return w.toUpperCase() });
console.log(words1); //["TRỜI", "BUỒN", "LÀM", "GÌ", "TRỜI", "RẦU", "RẦU"]
diem = [8, 4, 7, 6, 5, 4];
diem1 = _.map(diem, function(d){return d+1 });
console.log(diem1); // [9, 5, 8, 7, 6, 5]
sachhay = [
{'id':'mht', 'ten':'Mùi Hương Trầm','gia': 72000},
{'id':'n20', 'ten':'Nói với tuổi 20','gia': 25000},
{'id':'qlo', 'ten':'Quẳng gánh lo đi','gia': 81000},
];
sachhay1 = _.map(sachhay, function(s){return s.gia });
console.log(sachhay1); // [72000, 25000, 81000]
</script>Hàm _.remove() : Xóa phần tử trong mảng thỏa điều kiện
<script>
sachhay = [
{'id':'mht', 'ten':'Mùi Hương Trầm','gia': 72000},
{'id':'n20', 'ten':'Nói với tuổi 20','gia': 25000},
{'id':'qlo', 'ten':'Quẳng gánh lo đi','gia': 81000},
{'id':'sm', 'ten':'Sức mạnh của thói quen','gia': 125000},
];
sachhay1 = _.remove(sachhay, function(s){return s.gia>=80000 });
console.log(sachhay1);
// {id: "qlo", ten: "Quẳng gánh lo đi", gia: 81000}
// {id: "sm", ten: "Sức mạnh của thói quen", gia: 125000}
</script>Đó là một vài tính năng hay của thư viện lodash , bạn khám phá thêm nữa nhé. Một thư viện nữa giúp có nhiều tính năng hay giúp code javascript dễ dàng hơn đó là thư viện moment, bạn xem nhé.
