Các phương thức xử lý mảng trong JavaScript

– Trong JavaScript đã tích hợp sẵn các phương thức dùng để xử lý mảng. Với các phương thức này, ta có thể làm được những công việc như: chuyển một mảng về dạng chuỗi, thêm hoặc xóa các phần tử mảng, ghép các mảng lại với nhau, . . . .

– Dưới đây là bảng tóm tắt một vài phương thức xử lý mảng phổ biến mà ta phải thường hay dùng:

Phương thức	Mô tả
toString()	Chuyển một mảng về dạng chuỗi ký tự.
push()	Thêm một phần tử mới vào vị trí cuối mảng.
pop()	Xóa phần tử nằm ở vị trí cuối mảng.
unshift()	Thêm một phần tử mới vào vị trí đầu mảng.
shift()	Xóa phần tử nằm ở vị trí đầu mảng.
concat()	Ghép các mảng con lại với nhau rồi trả về một mảng mới.
slice()	Trích xuất một phần của mảng ban đầu rồi trả về một mảng mới.
splice()	Thêm hoặc xóa “một hoặc nhiều phần tử” ở vị trí bất kỳ trong mảng.
length	Trả về số lượng phần tử của mảng.

– Lưu ý: length được gọi là thuộc tính (không phải phương thức)

1) Chuyển mảng về dạng chuỗi ký tự

– Phương thức toString() dùng để chuyển một mảng về dạng chuỗi ký tự.

(chuỗi trả về sẽ là một dãy các phần tử mảng được ngăn cách bởi dấu phẩy)

– Cú pháp:

array.toString()

Ví dụ:

<script>
    var mobile = ["HTC", "Nokia", "SamSung", "LG", "Apple"];
    var text = mobile.toString();
</script>

Giá trị của biến text sẽ là:

HTC,Nokia,SamSung,LG,Apple

Xem ví dụ

– Ngoài ra, ta cũng có thể dùng phương thức join() để chuyển một mảng về dạng chuỗi ký tự.

– Tuy nhiên, đối với phương thức join() thì ta có thể xác định thêm ký tự đặt giữa các phần tử mảng trong chuỗi trả về.

– Cú pháp:

array.join(chuỗi ký tự ngăn cách giữa các phần tử mảng trong chuỗi trả về)

Ví dụ:

<script>
    var mobile = ["HTC", "Nokia", "SamSung", "LG", "Apple"];
    var text = mobile.join("- - -");
</script>

Giá trị của biến text sẽ là:

HTC- – -Nokia- – -SamSung- – -LG- – -Apple

Xem ví dụ

2) Thêm một phần tử mới vào vị trí cuối mảng

– Phương thức push() được dùng để thêm một phần tử mới vào vị trí cuối mảng.

– Cú pháp:

array.push(giá trị của phần tử mà bạn muốn thêm vào cuối mảng)

Ví dụ:

Thêm phần tử có giá trị là chuỗi Lenovo vào cuối mảng mobile

<script>
    var mobile = ["HTC", "Nokia", "SamSung", "LG", "Apple"];
    mobile.push("Lenovo");
</script>

Xem ví dụ

– Lưu ý: Phương thức push() ngoài việc thêm một phần tử mới vào vị trí cuối mảng thì nó còn trả về tổng số lượng phần tử trong mảng (tính luôn cả phần tử mới vừa được thêm vào)

Ví dụ:

<script>
    var mobile = ["HTC", "Nokia", "SamSung", "LG", "Apple"];
    var x = mobile.push("Lenovo"); //Biến x sẽ có giá trị là 6
</script>

Xem ví dụ

3) Xóa phần tử ở vị trí cuối mảng

– Phương thức pop() được dùng để xóa phần tử nằm ở vị trí cuối mảng.

– Cú pháp:

array.pop()

Ví dụ:

Xóa phần tử nằm ở vị trí cuối cùng trong mảng mobile

<script>
    var mobile = ["HTC", "Nokia", "SamSung", "LG", "Apple"];
    mobile.pop();
</script>

Xem ví dụ

– Lưu ý: Phương thức pop() ngoài việc xóa phần tử nằm ở vị trí cuối mảng thì nó còn trả về giá trị của phần tử bị xóa.

Ví dụ:

<script>
    var mobile = ["HTC", "Nokia", "SamSung", "LG", "Apple"];
    var x = mobile.pop(); //Biến x sẽ có giá trị là chuỗi Apple
</script>

Xem ví dụ

4) Thêm một phần tử mới vào vị trí đầu mảng

– Phương thức unshift() được dùng để thêm một phần tử mới vào vị trí đầu mảng.

– Cú pháp:

array.unshift(giá trị của phần tử mà bạn muốn thêm vào đầu mảng)

Ví dụ:

Thêm phần tử có giá trị là chuỗi Lenovo vào đầu mảng mobile

<script>
    var mobile = ["HTC", "Nokia", "SamSung", "LG", "Apple"];
    mobile.unshift("Lenovo");
</script>

Xem ví dụ

– Lưu ý: Phương thức unshift() ngoài việc thêm một phần tử mới vào vị trí đầu mảng thì nó còn trả về tổng số lượng phần tử trong mảng (tính luôn cả phần tử mới vừa được thêm vào)

Ví dụ:

<script>
    var mobile = ["HTC", "Nokia", "SamSung", "LG", "Apple"];
    var x = mobile.unshift("Lenovo"); //Biến x sẽ có giá trị là 6
</script>

Xem ví dụ

5) Xóa phần tử ở vị trí đầu mảng

– Phương thức shift() được dùng để xóa phần tử nằm ở vị trí đầu mảng.

– Cú pháp:

array.shift()

Ví dụ:

Xóa phần tử nằm ở vị trí đầu tiên trong mảng mobile

<script>
    var mobile = ["HTC", "Nokia", "SamSung", "LG", "Apple"];
    mobile.shift();
</script>

Xem ví dụ

– Lưu ý: Phương thức shift() ngoài việc xóa phần tử nằm ở vị trí đầu mảng thì nó còn trả về giá trị của phần tử bị xóa.

Ví dụ:

<script>
    var mobile = ["HTC", "Nokia", "SamSung", "LG", "Apple"];
    var x = mobile.shift(); //Biến x sẽ có giá trị là chuỗi HTC
</script>

Xem ví dụ

6) Ghép các mảng lại với nhau

– Phương thức concat() được dùng để ghép các mảng con lại với nhau rồi trả về một mảng mới.

– Cú pháp:

var tên mảng = array1.concat(array2, array3, ...., arrayN);

– Lưu ý: Mảng được trả về sẽ chứa tất cả các phần tử của những mảng con, thứ tự của các phần tử sẽ giống với thứ tự được sắp xếp lúc ghép mảng.

Ví dụ:

<script>
    var mobile = ["HTC", "Nokia"];
    var motorbike = ["Honda", "Yamaha", "Suzuki"];
    var SinhVien = ["Nguyễn Thành Nhân", 1993];
    var city = ["Cần Thơ", "Vĩnh Long"];
    var data = motorbike.concat(city, SinhVien, mobile);
</script>

Khi này mảng data sẽ là:

Honda,Yamaha,Suzuki,Cần Thơ,Vĩnh Long,Nguyễn Thành Nhân,1993,HTC,Nokia

Xem ví dụ

7) Trích xuất một phần của mảng

– Phương thức slice() được dùng để trích xuất một phần của mảng ban đầu rồi trả về một mảng mới.

– Cú pháp:

var tên mảng = array.slice(start, end);

– Trong đó:

“start” là chỉ số của phần tử bắt đầu được trích xuất.
“end” là chỉ số của phần tử kết thúc việc trích xuất (mảng trả về không bao gồm phần tử này)

Ví dụ:

<script>
   var data = ["HTC", "Nokia", "Apple", "LG", "Honda", "SYM", "Suzuki"];
   var abc = data.slice(1,5);
</script>

– Khi này mảng abc sẽ là:

Nokia,Apple,LG,Honda

Xem ví dụ

– Dưới đây là sơ đồ minh họa cho nguyên lý trích xuất mảng con của ví dụ phía trên:

Phần tử	HTC	Nokia	Apple	LG	Honda	SYM	Suzuki
Chỉ số	0	1 (start)	2	3	4	5 (end)	6

– Ngoài ra, nếu ta bỏ trống tham số “end” thì phương thức slice() sẽ trích xuất từ phần tử có chỉ số là “start” cho đến hết mảng (Xem ví dụ)

Phần tử	HTC	Nokia	Apple	LG	Honda	SYM	Suzuki
Chỉ số	0	1 (start)	2	3	4	5	6

– Lưu ý: Giá trị của tham số “start” và “end” cũng có thể là số âm. Tuy nhiên, với số âm thì chỉ số của các phần tử mảng sẽ được xác định theo chiều ngược lại (phần tử đầu tiên sẽ có chỉ số là -1)

Ví dụ:

<script>
   var data = ["HTC", "Nokia", "Apple", "LG", "Honda", "SYM", "Suzuki"];
   var abc = data.slice(-6,-3);
</script>

– Khi này mảng abc sẽ là:

Nokia,Apple,LG

Xem ví dụ

– Dưới đây là sơ đồ minh họa cho nguyên lý trích xuất mảng con của ví dụ phía trên:

Phần tử	HTC	Nokia	Apple	LG	Honda	SYM	Suzuki
Chỉ số	-7	-6 (start)	-5	-4	-3 (end)	-2	-1

– Ngoài ra, nếu ta bỏ trống tham số “end” thì phương thức slice() sẽ trích xuất từ phần tử có chỉ số là “start” cho đến hết mảng (Xem ví dụ)

Phần tử	HTC	Nokia	Apple	LG	Honda	SYM	Suzuki
Chỉ số	-7	-6 (start)	-5	-4	-3	-2	-1

8) Thêm & xóa phần tử ở vị trí bất kỳ trong mảng

– Như chúng ta đã biết:

Phương thức push() dùng để thêm một phần tử mới vào vị trí cuối mảng.
Phương thức pop() dùng để xóa phần tử nằm ở vị trí cuối mảng.
Phương thức unshift() dùng để thêm một phần tử mới vào vị trí đầu mảng.
Phương thức shift() dùng để xóa phần tử nằm ở vị trí đầu mảng.

– Tuy nhiên, để thêm hoặc xóa “nhiều phần tử” ở một “vị trí bất kỳ” thì ta phải làm như thế nào !?

==> Phương thức splice() có thể giải quyết được vấn đề này.

– Phương thức splice() dùng để thêm hoặc xóa “một hoặc nhiều phần tử” ở vị trí bất kỳ trong mảng.

8.1) Trường hợp xóa phần tử mảng

– Nếu dùng phương thức splice() để xóa phần tử mảng thì ta sử dụng cú pháp như sau:

array.splice(start, length)

– Trong đó:

Tham số “start” là chỉ số của phần tử bắt đầu được xóa.
Tham số “length” là số lượng phần tử mà bạn muốn xóa.

Ví dụ:

Xóa khỏi mảng data bốn phần tử (bắt đầu từ phần tử thứ hai)

<script>
    var data = ["HTC", "Nokia", "Apple", "LG", "Honda", "SYM", "Suzuki"];
    data.splice(1,4);
</script>

Xem ví dụ

– Lưu ý: Nếu ta bỏ trống tham số “length” thì phương thức splice() sẽ xóa tất cả những phần tử bắt đầu từ phần tử có chỉ số là start cho đến hết mảng.

Ví dụ:

<script>
    var data = ["HTC", "Nokia", "Apple", "LG", "Honda", "SYM", "Suzuki"];
    data.splice(1);
</script>

Xem ví dụ

8.2) Trường hợp thêm phần tử vào mảng

– Nếu dùng phương thức splice() để thêm phần tử mới vào mảng thì ta sử dụng cú pháp như sau:

array.splice(start, 0, phần tử mới 1, phần tử mới 2, phần tử mới 3, ....)

– Trong đó:

Tham số “start” là chỉ số của phần tử nơi mà bạn muốn chèn các phần tử mới ngay tại đó.
Tham số “0” là số không.
Các tham số “phần tử mới” là những phần tử mà bạn muốn thêm vào mảng.

Ví dụ:

Chèn bốn phần tử là chuỗi “a”, “b”, “c”, “d” vào mảng mobile (bắt đầu chèn tại phần tử thứ ba)

<script>
    var mobile = ["HTC", "Nokia", "SamSung", "LG", "Apple"];
    mobile.splice(2, 0, " a ", " b ", " c ", " d ");
</script>

Xem ví dụ

– Lưu ý: Nếu ta thay giá trị của tham số 0 thành một số khác thì phương thức splice() ngoài việc thêm phần tử mới vào mảng, nó còn xóa đi những phần tử nằm phía sau phần tử có chỉ số là start với số lượng phần tử bị xóa sẽ bằng với giá trị của tham số này.

Ví dụ:

<script>
    var mobile = ["HTC", "Nokia", "SamSung", "LG", "Apple"];
    mobile.splice(1, 3, " a ", " b ", " c ", " d ");
</script>

Xem ví dụ

9) Xác định số lượng phần tử của mảng

– Thuộc tính length dùng để trả về số lượng phần tử của một mảng.

Ví dụ:

Xác định số lượng phần tử của mảng mobile

<script>
    var mobile = ["HTC", "Nokia", "SamSung", "LG", "Apple"];
    var a = mobile.length; //Biến a sẽ có giá trị là 5
</script>

Các phương thức xử lý mảng trong JavaScript

1) Chuyển mảng về dạng chuỗi ký tự

2) Thêm một phần tử mới vào vị trí cuối mảng

3) Xóa phần tử ở vị trí cuối mảng

4) Thêm một phần tử mới vào vị trí đầu mảng

5) Xóa phần tử ở vị trí đầu mảng

6) Ghép các mảng lại với nhau

7) Trích xuất một phần của mảng

8) Thêm & xóa phần tử ở vị trí bất kỳ trong mảng

8.1) Trường hợp xóa phần tử mảng

8.2) Trường hợp thêm phần tử vào mảng

9) Xác định số lượng phần tử của mảng

Chuyên mục

Recent News