Hôm nay bạn hãy cùng mình đi vào tìm hiểu thêm các phương thức được sử dụng đối với array(mảng) trong ngôn ngữ lập trình Javascript để phát triển web nhé.
Phương Thức every() Array Javascript
Phương thức every() sẽ kiểm tra tất cả phần tử trong mảng có thỏa mãn điều kiện nào đó mà chúng ta đưa ra hay không. Và kết quả trả về của nó sẽ có giá trị là true hoặc false.
Mình có lưu ý là phương thức every() sẽ không ảnh hưởng đến mảng chính và phương thức này sẽ không thực hiện hàm đối với các phần tử không có giá trị(undefined).
Nếu chỉ có một phần tử không thỏa mãn điều kiện thì phương thức every() sẽ ngay lập tức trả về giá trị false nhé.
Cú pháp của phương thức every()
Bây giờ chúng ta đi vào tìm hiểu cú pháp của phương thức every() ở phía dưới đây nhé:
let ketQua = (Mảng).every(function (Phần Tử, Vị Trí Chỉ Mục, Mảng){
/*Mã Thực Thi*/
}) => Biểu thức- Phần tử: là giá trị phần tử hiện tại của mảng được xử lý.
- Vị trí chỉ mục: Vị trí chỉ mục của phần tử đó.
- Mảng: Là mảng chứa các phần tử mà chúng ta cần xử lý.
Khi sử dụng phương thức every() thì tham số phần tử là yêu cầu bắt buộc phải có nha. Còn hai tham số vị trí chỉ mục và mảng thì bạn có thể gọi hay không đều được tùy vào dữ liệu mà bạn cần đưa vào trong hàm để xử lý.
Ví dụ phương thức every()
Để bạn thấy được tiện ích của phương thứ every() thì mình sẽ đi vào xử lý vấn đề là kiểm tra tất cả phần tử có lớn hơn 2 không bằng hai cách.
Cách thứ nhất là chúng ta sử dụng vòng lặp for để kiểm tra nhé:
Đoạn Code:
let mang = [3, 4, 6, 8, 10];
let ketQua = true;
for(let i=0; i<mang.length; i++){
if(mang[i]< 2){
ketQua = false;
break;
}
}
console.log(ketQua);Kết Quả:
Chúng ta sử dụng vòng lặp để kiểm tra tất cả giá trị phần tử có lớn hơn 2 hay không. Biến ketQua dùng để lưu giá trị true hoặc false khi kiểm tra phần tử. Lệnh break; sẽ dừng vòng lặp ngay lập tức khi có phần tử không thỏa mãn điều kiện.
Bây giờ chúng ta sẽ dử dụng phương thức every để xử lý vấn đề trên nhé:
Đoạn Code:
let mang = [3, 4, 6, 8, 10];
let ketQua = mang.every(function (phanTu){
return phanTu > 2;
});
console.log(ketQua);Kết Quả:
Kết hợp phương thức every() với arrow function
Đây là cách viết phương thức every ngắn gọn và dễ nhìn hơn. Để dễ hiểu chúng ta sẽ giải quyết vấn đề là kiểm tra xem các số trong phần tử trong mảng có chia hết cho 3 hay không thông qua đoạn code sau đây nhé:
Đoạn Code:
let mang = [3, 4, 6, 8, 10];
let ketQua = mang.every(phanTu => phanTu % 3 == 0);
console.log(ketQua);Kết Quả:
Mình lưu ý là toán tử % sẽ giúp ta kiểm tra số dư của một biểu thức. Nếu bạn muốn tham khảo hay tìm hiểu thêm thì có thể xem ở đây nhé: Toán Tử Trong Javascript.
Sử dụng phương thức every() với object
Bây giờ chúng ta thử lấy các giá trị thuộc tính của object tạo các biểu thức điều kiện để xem các phần tử trong mảng có thỏa mãn điều kiện không nhé. Bây giờ để dễ hình dùng hơn bạn xem đoạn code sau nhé:
Đoạn Code:
let mang = [4, 6, 8, 10];
let khoangGiaTri = {
soNhoNhat : 2,
soLonNhat : 12
};
let ketQua = mang.every(function(phanTu){
return phanTu > khoangGiaTri.soNhoNhat && phanTu <= khoangGiaTri.soLonNhat
});
console.log(ketQua);Kết Quả:
Sử dụng phương thức every() với mảng rỗng
Nếu chúng ta dùng phương thức every() để kiểm tra một mảng rỗng thì kết quả sẽ luôn trả về là true. Để dễ hình dung bạn xem đoạn code sau nhé:
Đoạn Code:
let mang = [];
let ketQua = mang.every(phanTu => phanTu <= 2);
console.log(ketQua);Kết Quả:
Phương Thức some() Array Javascript
Phương thức some() sẽ kiểm tra mảng theo một điều kiện nhất và kết quả trả trả về sẽ có giá trị là true hoặc false. Điểm khác biệt chính của nó với phương thức every() là nếu chỉ một phần tử thỏa mãn điều kiện thì sẽ trả về giá trị true.
Mình có lưu ý là phương thức some() sẽ không ảnh hưởng đến mảng chính và phương thức này sẽ không thực hiện hàm đối với các phần tử không có giá trị(undefined).
Do cú pháp của nó giống với every() nên mình sẽ đi thẳng vào ví dụ để giúp bạn nắm rõ hơn nhé:
Ví dụ phương thức some()
Bây giờ chúng ta sẽ đi vào giải quyết vấn đề là nếu trong mảng có bất kỳ phần tử nào nhỏ hơn 10 sẽ trả về true còn ngược lại sẽ là false.
Mình sẽ giải quyết vấn đề trên theo hai cách để bạn có cái nhìn tổng quát hơn. Đầu tiên chúng ta đi vào cách sử dụng vòng lặp for:
Đoạn Code:
let mang = [30, 40, 20, 8, 12];
let ketQua = false;
for(let i=0; i<mang.length; i++){
if(mang[i] < 10){
ketQua = true;
break;
}
}
console.log(ketQua);Kết Quả:
Như bạn thấy ở vòng lặp trên thì ta sẽ lọc qua tất cả các phần tử trong mảng và nếu chỉ có một phần tử nhỏ hon 10 thì chúng ta gán giá trị true vào cho biến ketQua và dừng vòng lặp ngay lặp tức bằng lệnh break;
Bây giờ chúng ta sẽ đi vào giải quyết vấn đề trên bằng phương thức some() nhé:
Đoạn Code:
let mang = [30, 40, 20, 8, 12];
let ketQua = mang.some(function (phanTu){
return phanTu < 10;
});
console.log(ketQua);Kết Quả:
Kết hợp phương thức some() với arrow function
Bây giờ chúng ta thử giải quyết vấn đề trên bằng cách kết hợp giữa phương thức some() và arrow function bằng đoạn code dưới đây nhé:
Đoạn Code:
let mang = [30, 40, 20, 8, 12];
let ketQua = mang.some( phanTu => phanTu < 10);
console.log(ketQua);Kết Quả:
Mình có chú ý là nếu bạn dùng phương thức some với một mảng rỗng thì kết quả trả về sẽ luôn có giá trị false nhé.
Phương Thức reverse() Array Javascript
Phương thức reverse() sẽ trả về mảng chính được sắp xếp theo hướng ngược lại so với ban đầu. Cú pháp của nó ở dưới đây nhé:
(Mảng).reverse();Để giúp bạn nắm rõ hơn chúng ta đi vào ví dụ cụ thể sao đây nhé:
Đoạn Code:
let mang = [1, 2, 3, 4];
let ketQua = mang.reverse();
console.log(ketQua);Kết Quả:
Phương Thức split() Array Javascript
Phương thức split() sẽ giúp chuyển các ký tự trong chuỗi thành các phần tử ở trong mảng.
Cú pháp phương thức split()
Bây giờ chúng ta sẽ đi vào cú pháp của nó nhé:
(Chuỗi).split(Ký tự, Độ dài);- Với Ký tự: Dùng ký tự để xác định vị trí sẽ chia các ký tự trong chuỗi thành mảng. Ngoài ra chúng ta cũng có thể sử dụng biểu thức để thay cho ký tự.
- Với Độ dài: Dùng để xác định độ dài của mảng sẽ chứa các ký tự trong chuỗi. Các ký tự nếu vượt quá độ dài này sẽ bị bỏ qua.
Ví dụ phương thức split()
Chúng ta sẽ đi vào ví dụ khi sử dụng ký tự khoảng trắng để làm nơi xác định vị trí chuyển chuỗi thành mảng và sẽ không giới hạn độ dài của mảng chứa các ký tự. Để hiểu rõ hơn bạn xem đoạn code sau đây nhé:
Đoạn Code:
let chuoi = "Xin Chào Các Bạn";
let mangKyTu = chuoi.split(" ");
console.log(mangKyTu);Kết Quả:
Bạn có thể không cần xác định ký tự để xác định vị trí tách chuỗi trong phương thức split(). Lúc này nó sẽ tự động xác định mỗi ký tự trong chuỗi sẽ là một phần tử con trong mảng (Khoảng trắng cũng là ký tự nha). Và với ví dụ trên chúng ta sẽ thử không sử dụng ký tự để xem kết quả như thế nào nhé:
Đoạn Code:
let chuoi = "Xin Chào Các Bạn";
let mangKyTu = chuoi.split("");
console.log(mangKyTu);Kết Quả:
Tiếp theo chúng ta sẽ đi vào ví dụ với việc sử dụng phương thức split() với vòng lặp for...of trong mảng nhé:
Đoạn Code:
let chuoi = "An,Hưng,Lan";
let mangKyTu = chuoi.split(",");
for(let phanTu of mangKyTu){
console.log("Xin chào bạn " + phanTu)
}Kết Quả:
Phương Thức join() Array Javascript
Phương thức join() sẽ trả về kết quả là một chuỗi bằng cách kết hợp các phần tử trong mảng. Và phương thức này sẽ không ảnh hưởng đến mảng chính nhé.
Cú pháp phương thức join()
Bây giờ chúng ta sẽ đi vào tìm hiểu cú pháp của nó nhé:
(Mảng).join(Ký tự ngăn cách)- Ký tự ngăn cách là ký tự phân chia các phần tử trong mảng sau khi đã chuyển sang dạng chuỗi.
Ví dụ phương thức join()
Bây giờ chúng ta thử chuyển các phần tử trong mảng thành dạng chuỗi với ký tự ngăn cách là dấu <. Để dễ hình dung bạn xem ví dụ sau đây nhé:
Đoạn Code:
let mang = [2, 4, 6, 8];
let chuoi = mang.join(" < ");
console.log(chuoi);
console.log(typeof chuoi);Kết Quả:
Tổng kết:
Qua đây mình mong bài viết sẽ giúp bạn hiểu được cách sử dụng các phương thức với mảng trong ngôn ngữ Javascript và nếu có thắc mắc gì cứ gửi email mình sẽ phản hồi sớm nhất có thể. Rất mong bạn tiếp tục ủng hộ trang web để mình có thể viết nhiều bài hay hơn nữa nhé. Chúc bạn có một ngày vui vẻ!
