Phương thức JavaScript includes() tìm kiếm mục trong mảng. Trả về true nếu phần tử tồn tại trong mảng. Phương thức filter() cho phép tìm mục trong danh sách. Khác với includes(), filter() trả về chính mục bạn tìm kiếm.
Bạn có thể muốn biết mảng có chứa giá trị cụ thể không. Ví dụ: có danh sách đơn hàng sản phẩm và muốn kiểm tra ai đã đặt tủ đầu giường từ cửa hàng.
JavaScript Array Contains
Có hai cách xác định mảng JavaScript có chứa mục:
- includes()
- filter()
includes() kiểm tra mục có tồn tại trong mảng và trả về true hoặc false. filter() tìm mục trong mảng và trả về mục đó.
Trong tutorial này, ta thảo luận dùng phương thức includes() mảng JavaScript xác định mảng có chứa phần tử cụ thể. Cũng thảo luận dùng filter() kiểm tra mảng đối tượng có chứa giá trị.
Array Contains JavaScript: includes()
Phương thức JavaScript includes() xác định mảng có chứa giá trị cụ thể. includes() trả về true nếu tìm thấy mục chỉ định và false nếu không tìm thấy.
array_name.includes(element, start_position);
includes() chấp nhận hai đối số:
- element: Giá trị cần tìm. (bắt buộc)
- start_position: Vị trí chỉ mục trong mảng bắt đầu tìm. (tùy chọn)
Phương thức includes() trả về true hoặc false. Các giá trị này gọi là JavaScript Booleans.
Array.includes() hoạt động giống String.includes(). Nhưng Array.includes() tìm qua mảng đối tượng.
Ví dụ includes() JavaScript
Giả sử điều hành quán cà phê. Muốn kiểm tra hôm nay ai đặt espresso không. Dùng code sau kiểm tra danh sách đơn hôm nay:
var todays_orders = ['Latte', 'Americano', 'Latte', 'Latte', 'Mocha', 'Cortado'];
console.log(todays_orders.includes('Espresso'));
Code trả về: false.
Mảng todays_orders không bao gồm giá trị Espresso. Khi includes() thực thi, trả về false. Nếu tìm trong mảng có phần tử tồn tại, includes() trả về true.
Bây giờ, muốn xem ai đặt latte trong ba đơn hàng cuối. Dùng includes() với đối số start_position:
var todays_orders = ['Latte', 'Americano', 'Latte', 'Latte', 'Mocha', 'Cortado'];
console.log(todays_orders.includes('Latte', 3));
Chương trình trả về: true. Vì latte được đặt sau chỉ mục 3 trong mảng, includes() trả về true.
Array Contains JavaScript: filter()
Trong ví dụ trên, dùng includes() kiểm tra mảng chuỗi có chứa giá trị cụ thể. Nhưng nếu muốn kiểm tra mảng đối tượng (array of objects) chứa giá trị cụ thể? Dùng hàm filter() thực hiện hành động đó.
Hàm filter() lặp qua mảng đối tượng và tìm giá trị cụ thể. filter() nhận một đối số: hàm dùng để tìm giá trị. Cú pháp filter() JavaScript:
var filterArray = array_name.filter(function(item) {
return item;
});
Ví dụ filter() JavaScript
Có mảng đối tượng đơn hàng cà phê chứa tên đồ uống và tên khách.
Muốn kiểm tra xem John Appleseed có đặt cà phê hôm nay không. John là khách thân thiết nên được giảm giá lần sau.
Code sau kiểm tra John Appleseed có đặt hàng:
var orders = [
{ drink: 'Cappuccino', name: 'John Appleseed' },
{ drink: 'Espresso', name: 'Mya Stuart' },
{ drink: 'Cappuccino', name: 'Emma Berry' }
];
var check_orders = orders.filter(order => (order.name === "John Appleseed"));
console.log(check_orders);
Chương trình trả về:
[{ drink: 'Cappuccino', name: 'John Appleseed' }]
Đầu tiên khai báo mảng orders lưu tên người đặt và đồ uống. Sau đó khai báo biến check_orders dùng filter() kiểm tra ai tên John Appleseed đặt cà phê.
In giá trị check_orders ra console. Vì John Appleseed đặt hàng hôm nay, hàm trả về bản ghi đơn hàng. Nếu không đặt, chương trình không trả về gì.
Nếu muốn học thêm về filter(), xem tutorial về JavaScript filter() và reduce().
Kết luận
Phương thức includes() kiểm tra giá trị có trong mảng. Trả về true hoặc false tùy kết quả. Phương thức filter() xác định mảng đối tượng có chứa giá trị cụ thể. Trả về đối tượng thỏa tiêu chí nếu tồn tại trong mảng.
Muốn học thêm JavaScript? Xem hướng dẫn How to Learn JavaScript. Sẽ tìm thấy lời khuyên chuyên gia và danh sách khóa học online, sách, tài nguyên top giúp bạn học.