Trong javascript, filter là một hàm của đối tượng Array, cho phép lọc các phần tử trong mảng dựa trên điều kiện được xác định. Nó trả về một mảng mới chứa các phần tử mà điều kiện đã được thỏa mãn.
Các bài viết liên quan:
Cú pháp của hàm filter:
array.filter(callback[, thisArg])
- callback: hàm để xác định xem một phần tử của mảng có được giữ lại hay không. Hàm này có 3 tham số:
- currentValue: giá trị của phần tử hiện tại trong mảng đang được xử lý.
- index: chỉ số của phần tử hiện tại trong mảng.
- array: mảng gốc đang được lọc.
- thisArg (tùy chọn): giá trị để dùng làm giá trị “this” trong hàm callback.
Vì sao nên sử dụng Filter ?
Sử dụng filter trong javascript có rất nhiều lợi ích. Một trong những lợi ích chính là giúp cho việc lọc dữ liệu mảng trở nên dễ dàng và nhanh chóng hơn. Bằng cách sử dụng filter, bạn có thể chỉ lấy ra các phần tử mà bạn quan tâm, và bỏ qua các phần tử không cần thiết, giúp cho mã lệnh trở nên ngắn gọn và dễ đọc hơn.
Filter cũng giúp cho việc tách biệt và xử lý các phần tử cần thiết trong mảng, giúp cho việc quản lý dữ liệu trở nên dễ dàng hơn. Filter cũng rất hữu ích khi bạn muốn lọc dữ liệu trước khi sử dụng các hàm khác, như tính tổng của một mảng, tìm phần tử lớn nhất, v.v.
Sử dụng Filter trong javascript như thế nào ?
Sử dụng filter trong javascript rất đơn giản, với cú pháp cụ thể như sau:
let newArray = oldArray.filter(function(item){
// code xử lý
return true or false;
});Trong đó:
- oldArray là mảng cần lọc
- function(item) là hàm lọc, trong đó item là phần tử trong mảng cần được xử lý
- return true or false là xác định phần tử cần lọc hay không
Ví dụ:
let numbers = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10];
let evenNumbers = numbers.filter(function (number) {
return number % 2 == 0;
});
console.log(evenNumbers); // [2, 4, 6, 8, 10]Trong ví dụ trên, chúng ta đang sử dụng hàm filter để lọc ra các số chẵn trong mảng numbers.
Hàm filter sẽ gọi hàm callback (function (number)) với mỗi phần tử của mảng numbers.
Trong hàm callback, chúng ta kiểm tra xem số đó có chia hết cho 2 không, nếu chia hết thì trả về true và số đó sẽ được giữ lại, ngược lại trả về false và số đó sẽ bị bỏ qua.
Mảng kết quả sau khi filter chỉ chứa các số chẵn.
Khi nào nên sử dụng Filter trong javascript ?
“Filter” trong javascript thường được sử dụng khi bạn muốn lọc ra một tập hợp các phần tử của một mảng theo một tiêu chí đặc biệt. Ví dụ như:
- Lọc ra các số chẵn trong một mảng số
- Lọc ra các phần tử có giá trị lớn hơn một số đã cho
- Lọc ra các phần tử thỏa mãn một điều kiện cụ thể trong một mảng đối tượng.
Các ví dụ trên chỉ là vài trong nhiều trường hợp sử dụng filter, nó có thể dùng để lọc ra một tập hợp phần tử phù hợp với nhiều yêu cầu khác nữa, nhưng tất cả chúng đều liên quan đến việc lọc ra một tập hợp phần tử trong mảng.
Các ví dụ khi sử dụng Filter trong javascript.
Đây là một vài ví dụ về cách sử dụng filter trong javascript:
- Lọc ra các số chẵn trong một mảng số:
let numbers = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10];
let evenNumbers = numbers.filter(function(number) {
return number % 2 === 0;
});
console.log(evenNumbers); // [2, 4, 6, 8, 10]- Lọc ra các phần tử có giá trị lớn hơn một số đã cho:
let numbers = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10];
let greaterThanFive = numbers.filter(function(number) {
return number > 5;
});
console.log(greaterThanFive); // [6, 7, 8, 9, 10]- Lọc ra các phần tử thỏa mãn một điều kiện cụ thể trong một mảng đối tượng:
let people = [
{ name: 'John', age: 30 },
{ name: 'Mike', age: 25 },
{ name: 'Emily', age: 22 },
{ name: 'Ashley', age: 35 }
];
let adults = people.filter(function(person) {
return person.age >= 18;
});
console.log(adults);
// [{ name: 'John', age: 30 }, { name: 'Mike', age: 25 }, { name: 'Emily', age: 22 }, { name: 'Ashley', age: 35 }]Chú ý rằng trong ví dụ trên, callback function truyền vào filter sẽ được gọi cho mỗi phần tử trong mảng. Nếu phần tử nào thỏa mãn điều kiện trong callback (trả về true), nó sẽ được thêm vào mảng kết quả.
Một số ví dụ nâng cao hơn:
- Sử dụng filter để lọc ra các phần tử trong một mảng đa chiều:
let arr = [[1, 2, 3], [4, 5, 6], [7, 8, 9]];
let flatten = arr.filter(function(item) {
return Array.isArray(item);
});
console.log(flatten); // [[1, 2, 3], [4, 5, 6], [7, 8, 9]]- Lọc ra các phần tử thỏa mãn điều kiện trong một mảng đa chiều:
let arr = [[1, 2, 3], [4, 5, 6], [7, 8, 9]];
let flatten = arr.filter(function(item) {
return Array.isArray(item) && item.length >= 3;
});
console.log(flatten); // [[1, 2, 3], [4, 5, 6], [7, 8, 9]]- Sử dụng filter để tìm các phần tử có tên thỏa mãn điều kiện trong một mảng đối tượng:
let people = [
{ name: 'John', age: 30 },
{ name: 'Mike', age: 25 },
{ name: 'Emily', age: 22 },
{ name: 'Ashley', age: 35 }
];
let searchName = people.filter(function(person) {
return person.name.toLowerCase().indexOf("e") > -1;
});
console.log(searchName);
// [{ name: 'Mike', age: 25 }, { name: 'Emily', age: 22 }, { name: 'Ashley', age: 35 }]Các ví dụ trên chỉ là một số ví dụ để giúp cho bạn hiểu rõ hơn về cách sử dụng filter. Bạn có thể sử dụng các câu lệnh filter để lọc dữ liệu một cách linh hoạt theo nhu cầu của mình.
Kết luận
Filter là một trong những hàm cần thiết và thường xuyên sử dụng trong javascript. Nó cho phép lọc các phần tử của một mảng theo điều kiện mà bạn chỉ định, trả về một mảng mới chứa các phần tử đã được lọc. Điều này giúp cho việc quản lý dữ liệu trong javascript trở nên dễ dàng hơn và tăng hiệu suất cho ứng dụng của bạn.
