Một số hàm hữu ích để xử lý mảng trong Javascript
M t s hàm h u ích đ x lý m ng trong Javascriptộ ố ữ ể ử ả
Đôi khi chúng ta b cu n theo nh ng Framework, lib... đ c xây d ng s n ị ố ữ ượ ữ ẵ
mà quên đi nh ng ki n th c căn b n có th đã t ng t n t i trong đ u c a ữ ế ứ ả ể ừ ồ ạ ầ ủ
chúng ta.
Bài vi t này s nói v nh ng ki n th c đó, chúng ta s xem xét m t vài ế ẽ ề ữ ế ứ ẽ ộ
ph ng th c có s n c a Array Object và cách s d ng nh ng ph c này đ ươ ứ ẵ ủ ử ụ ư ứ ể
s p x p, l c và nhi u tác v h n th đ có đ c k t qu mà chúng ta ắ ế ọ ề ụ ơ ể ể ượ ế ả
mong mu n.ố
Gi i thi uớ ệ
Tr c khi tìm hi u v các ph ng th c, chúng ta nên xem xét m t chút v ướ ể ề ươ ứ ộ ề
các ph ng th c c a đ i t ng Array trong Javascript. Các ph ng th c ươ ứ ủ ố ượ ươ ứ
này có th làm thay đ i giá tr c a m ng ho c không.ể ổ ị ủ ả ặ
Các ph ng th c này n m trong prototype c a b t kỳ m ng nào, b n có ươ ứ ằ ủ ấ ả ạ
th s d ng console devtool c a trình duy t đ log ra m t m ng b t kỳ và ể ử ụ ủ ệ ể ộ ả ấ
các ph ng th c có trong prototype c a nó.ươ ứ ủ
Danh sách này li t kê t t c các ph ng th c mà b n có th s d ng v i ệ ấ ả ươ ứ ạ ể ử ụ ớ
b t c m ng nào, nh đã nói trên, các ph ng th c có th làm thay đ i ấ ứ ả ư ở ươ ứ ể ổ
giá tr c a m ng ho c s nh n l i giá tr t ph ng th c.ị ủ ả ặ ẽ ậ ạ ị ừ ươ ứ
B n cũng bi t r ng không có giá tr nào trong m t m ng c a Javascript ạ ế ằ ị ộ ả ủ
đ c c đ nh, có nghĩa nó có th thay đ i b t c lúc nào (k các các ượ ố ị ể ổ ấ ứ ể
ph ng th c c a m ng). T t nhiên b n v n có cách làm cho chúng không ươ ứ ủ ả ấ ạ ẫ
th thay đ i, nh ng theo "đ nh nghĩa" thì m ng luôn có th thay đ i n i ể ổ ư ị ả ể ổ ộ
dung và đ i dài.ộ
.sort() và .reverse()
T i gi i thi u 2 ph ng th c này tr c tiên, vì theo tôi chúng là nh ng ố ớ ệ ươ ứ ướ ữ
ph ng th c đ n gi n và th ng dùng nh t c a chúng ta.ươ ứ ơ ả ườ ấ ủ
Đ gi i thi u v 2 ph ng th c này, tôi s d ng m t m ng s đ n gi n ể ớ ệ ề ươ ứ ử ụ ộ ả ố ơ ả
nh sau:ư
var array = [1, 8, 3, 5, 9, 7];
Hãy t ng t ng, b n có m t m ng nh trên, nh ng gi b n mu n m ng ưở ượ ạ ộ ả ư ư ờ ạ ố ả
đó ph i đ c s p x p t nh t i l n.ả ượ ắ ế ừ ỏ ớ ớ
var sortedArray = array.sort();
Nó s tr l i m ng m i v i các giá tr :ẽ ả ạ ả ớ ớ ị
[1, 3, 5, 7, 8, 9]
Ph ng th c này cũng làm vi c v i các chu i, ký t n u b n mu n s p ươ ứ ệ ớ ỗ ự ế ạ ố ắ
x p chúng theo th t b ng ch cái, nó s th c hi n vi c s p x p mà ế ứ ự ả ữ ẽ ự ệ ệ ắ ế
không c n truy n vào b t kỳ tham s nào.ầ ề ấ ố
L u ý: Ph ng th c nàyư ươ ứ tr l i m t m ng m iả ạ ộ ả ớ và th t các ph n t c aứ ự ầ ử ủ
m ng cũng b thay đ i.ả ị ổ
B n cũng có th truy n tham s cho ph ng th c này, tham s đó làạ ể ề ố ươ ứ ố hàm
s p x p, theo m c đ nh c a Javascript thì hàm đó s là:ắ ế ặ ị ủ ẽ
array.sort((a, b) => {
// a = ph n t hi n t i c a m ngầ ử ệ ạ ủ ả
// b = ph n t ti p theo c a m ngầ ử ế ủ ả
return a < b;
});
Ch c năng c a hàm s p x p m c đ nh là đi qua m i ph n t c a m ng và ứ ủ ắ ế ặ ị ọ ầ ử ủ ả
xem xét li u ph n t hi n t i có nh h n ph n t ti p theo hay không và ệ ầ ử ệ ạ ỏ ơ ầ ử ế
theo cách đó t ch c l i m ng c a b n. Vì v y, n u b n mu n s p x p ổ ứ ạ ả ủ ạ ậ ế ạ ố ắ ế
ng c l i thì vi c ph i làm là xem xét xem ph n t hi n t i có l n h n ượ ạ ệ ả ầ ử ệ ạ ớ ơ
ph n t ti p theo hay không, nh th này:ầ ử ế ư ế
array.sort((a, b) => {
return a > b;
});
// [9, 8, 7, 5, 3, 1]
Ngoài ra có m t cách khác đ th c hi n vi c s p x p theo chi u t nh t iộ ể ự ệ ệ ắ ế ề ừ ỏ ớ
l n, đây là lúc ph ng th cớ ươ ứ .reverse() xu t hi n, ch c năng c a ph ng ấ ệ ứ ủ ươ
th c này là đ o ng c th t c a m ng. Do đó ngoài cách trên, chúng ta cóứ ả ượ ứ ự ủ ả
thêm cách:
array.sort().reverse();
// [9, 8, 7, 5, 3, 1]
Ph ng th c này không nh n vào tham s nào, tr l i m t m ng m i và ươ ứ ậ ố ả ạ ộ ả ớ
làm thay đ i m ng g i nó.ổ ả ọ
.filter()
Sau khi chúng ta đã bi t v vi c s p x p và đ o ng c m t m ng, ti p ế ề ệ ắ ế ả ượ ộ ả ế
theo chúng ta s tìm hi u cách l c m t m ng s d ng ph ng th cẽ ể ọ ộ ả ử ụ ươ ứ .filter().
Chúng ta s s d ng m t m ng d li u m u, m ng này s đ c s d ng ẽ ử ụ ộ ả ữ ệ ẫ ả ẽ ượ ử ụ
cho nh ng ví d sau n a.ữ ụ ữ
var people = [
{
name: 'Helga Brekke',
age: 25,
gender: 'f',
us: true
},
{
name: 'Christine Hansen',
age: 18,
gender: 'm',
us: false,
},
{
name: 'Alfred Roob',
age: 17,
gender: 'm',
us: false,
},
{
name: 'Crystal Hermann',
age: 27,
gender: 'm',
us: false,
},
{
name: 'Dax Koch',
age: 22,
gender: 'f',
us: true
}
];
B n có m ng này và b n ch mu n có đ c danh sách nh ng ng i là ph ạ ả ạ ỉ ố ượ ữ ườ ụ
n . V c b n nh ng gì b n ph i làm là l c m ng này và ch nh n nh n ữ ề ơ ả ữ ạ ả ọ ả ỉ ậ ẫ
nh ng đ i t ng có tr ngữ ố ượ ườ gender là f.
Ph ng th c này tr l i m t m ng, không làm thay đ i m ng g i nó.ươ ứ ả ạ ộ ả ổ ạ ọ
Ph ng th cươ ứ .filter() nh n vào m t tham s và đ i s là m t hàm, hàm mà ậ ộ ố ố ố ộ
chúng ta mu n ch y cho t ng ph n t trong m ng.ố ạ ừ ầ ử ả
Hàm tham s c aố ủ .filter() nh n vào 1 tham s , đó là ph n t hi n t i c a ậ ố ầ ự ệ ạ ủ
m ng mà vi c l c đang th c hi n.ả ệ ọ ự ệ
có thể bạn quan tâm
Tìm hiểu về ES6 trong Javascript
0
644
342
Lập trình
(New)
Cùng tìm hiểu về biến trong JavaScript
6
624
322
Lập trình
6
(New)
Khả năng tương thích trình duyệt trong JavaScript
3
684
297
Lập trình
3
(New)
Cách kích hoạt JavaScript trong các trình duyệt
2
748
275
Lập trình
2
(New)
KIẾN TRÚC MẠNG CHUYỂN MẠCH CHÙM QUANG OBS VÀ BÁO HIỆU VÀ GIẢI QUYẾT XU...
88
852
435
Kỹ thuật
88
(New)
Báo cáo tốt nghiệp: Thiết bị không dây, phần mềm, Các mảng kiến thức c...
54
869
321
Kỹ thuật
54
(New)
Trình bày tổng quan về cơ sở của mạng nơron nhân tạo, và nêu khái quát...
88
912
333
Kinh tế quản lý
88
(New)
NHẬN THỰC TRONG MÔI TRƯỜNG LIÊN MẠNG VÔ TUYẾN VÀ NHỮNG ỨNG DỤNG TIỀM N...
83
825
335
Kỹ thuật
83
(New)
thông tin tài liệu
Đôi khi chúng ta bị cuốn theo những Framework, lib... được xây dững sẵn mà quên đi những kiến thức căn bản có thể đã từng tồn tại trong đầu của chúng ta. Bài viết này sẽ nói về những kiến thức đó, chúng ta sẽ xem xét một vài phương thức có sẵn của Array Object và cách sử dụng nhưng phức này để sắp xếp, lọc và nhiều tác vụ hơn thể để có được kết quả mà chúng ta mong muốn.
Mở rộng để xem thêm
từ khóa liên quan
tài liệu mới trong mục này
tài liệu hot trong mục này
tài liệu giúp tôi
Nếu bạn không tìm thấy tài liệu mình cần có thể gửi yêu cầu ở đây để chúng tôi tìm giúp bạn!
×
