03/08/2018, 10:00

Các hàm xử lý mảng trong javascript

Việc xử lý mảng trong javascript đóng vai trò rất quan trọng vì nó được sử dụng khá nhiều trong thực tế. Chính vì vậy việc biết một số hàm xử lý ...

Việc xử lý mảng trong javascript đóng vai trò rất quan trọng vì nó được sử dụng khá nhiều trong thực tế.  Chính vì vậy việc biết một số hàm xử lý mảng thông dụng trong javascript sẽ giúp bạn dễ dàng học cũng như tìm hiểu javascript hơn.

Mảng thực chất cũng là một Object (đối tượng) nên thực chất các hàm mà ta hay gọi chính là các phương thức (method) của đối tượng mảng, vì vậy bạn đừng nhầm lẫn giữa hai khái niệm nhé. Trong nội dung bài này mình sẽ gọi là các hàm xử lý mảng để tiện cho việc diễn giải hơn.

1. Danh sách các hàm xử lý mảng trong javascript

Phần này chúng ta sẽ tìm hiểu một số hàm có sẵn trong javascript được tích hợp vào array object, chính vì nó chỉ dùng trong array object nên nếu bạn dùng với kiểu dữ liệu khác sẽ bị sai đấy nhé.

Hàm array.valueOf()

Hàm này có tác dụng tương tự như hàm array.join() mà ta đã học ở bài trước, có nghĩa là nó sẽ nối các phần tử với nhau vào một chuỗi cách nhau bởi dấu phẩy.

Ví dụ: XEM DEMO

var mang = ["Học", "lập", "trình", "tại", "code24h.com"];
document.write(mang.valueOf());

Hàm array.push()

Hàm thêm một phần tử vào cuối mảng.

Ví dụ: XEM DEMO

var mang = ["Học", "lập", "trình", "tại", "code24h.com"];

// in mảng
document.write(mang.valueOf());
document.write('<br/>');

// Thêm và in
mang.push("Miễn phí");
document.write(mang.valueOf());

Hàm array.pop()

Ngược với hàm array.push(), hàm này có tác dụng xóa đi phần tử cuối cùng trong mảng.

Ví dụ: XEM DEMO

var mang = ["Học", "lập", "trình", "tại", "code24h.com"];

// in mảng
document.write(mang.valueOf());
document.write('<br/>');

// Thêm và in
mang.pop();
document.write(mang.valueOf());

Hàm array.shift()

Hàm xóa phần tử đầu tiên của mảng, sau đó dồn các phần tử phía sau xuống một bậc.

Ví dụ: XEM DEMO

var mang = ["Học", "lập", "trình", "tại", "code24h.com"];

// in mảng
document.write(mang.valueOf());
document.write('<br/>');

// Thêm và in
mang.shift();
document.write(mang.valueOf());

Hàm array.unshift()

Thêm một phần tử vào vị trí đầu tiên của mảng, đồng thời đẩy các phẩn từ phía sau lên một bậc.

Ví dụ: XEM DEMO

var mang = ["Học", "lập", "trình", "tại", "code24h.com"];

// in mảng
document.write(mang.valueOf());
document.write('<br/>');

// Thêm và in
mang.unshift("Chào Mừng");
document.write(mang.valueOf());

Hàm array.splice()

Hàm splice() có ba tham số truyền vào như sau: splice(position_add, num_element_remove, value1, value2, ...).

Trong đó:

  • position_add là vị trí sẽ thêm (vị trí đầu tiên là 0)
  • num_element_remove là số phần tử sẽ xóa (bắt đầu từ position_add)
  • value1, value2, .. là danh sách các phần tử sẽ được thêm vào sau khi tại vị trí position_add và sau khi remove num_element_remove phần tử.

Ví dụ 1: XEM DEMO

var mang = ["Học", "lập", "trình", "tại", "code24h.com"];

mang.splice(1, 2, 'PHP', 'căn bản ');
document.write(mang.valueOf());

Trong ví dụ này thì:

  • Vị trí thêm là số 1 (phần tử có giá trị là "lập")
  • Xóa 2 phần tử liên tiếp từ vị trí 1 (xóa phần tử "lập" và "trình")
  • Thêm hai phần tử "php" và "căn bản" vào

Cuối cùng ta có được một mảng gồm ["Học", "php", "căn bản", "tại", "code24h.com"].

Ví dụ 2: XEM DEMO

Trong ví dụ này ta sẽ không thêm phần tử nữa mà sẽ lợi dụng hàm này để xóa đi một số phần tử.

var mang = ["Học", "lập", "trình", "tại", "code24h.com"];
// xóa phần tử "lập" và "trình"
mang.splice(1, 2);
document.write(mang.valueOf());

Hàm array.sort()

Hàm này dùng để sắp xếp các phần tử trong mảng theo thứ tự chữ cái alpha.

Ví dụ: XEM DEMO

var mang = ["Học", "lập", "trình", "tại", "code24h.com"];
document.write(mang.valueOf());
document.write('<br/>');

// Sắp xếp lại
mang.sort();
document.write(mang.valueOf());

Hàm array.reverse()

Hàm đảo ngược các phẩn tử lại. Vị trí đầu sẽ được chuyển xuống cuối mảng và vị trí cuối mảng sẽ được chuyển lên đầu mảng.

Ví dụ: XEM DEMO

var mang = ["Học", "lập", "trình", "tại", "code24h.com"];
document.write(mang.valueOf());
document.write('<br/>');

// Đảo ngược vị trí của các phần tử
mang.reverse();
document.write(mang.valueOf());

Hàm array.concat()

Hàm dùng để nối hai mảng với nhau và trả về một mảng gồm tổng số phần tử của hai mảng đó.

Ví dụ: XEM DEMO

var mang1 = ["Học", "lập", "trình"];<br>var mang2 = ["tại", "code24h.com"];<br><br>// Nối mảng<br>var mang_con = mang1.concat(mang2);<br>document.write(mang_con.valueOf());

Hàm array.slice()

Hàm dùng để lấy một số phần tử con trong mảng. Có hai tham số truyền vào như sau: slice(start, end).

Trong đó:

  • start: là vị trí bắt đầu 
  • end: là vị trí kết thúc 

Lưu ý: Để dễ hiểu thì start sẽ phần tử đầu tiên là 0 và end sẽ tính phần tử đầu tiên là 1. Chính vì vậy bạn sẽ phải cộng thêm 1 ở end thì mới lấy đúng phần tử mong muốn

Ví dụ: XEM DEMO

var mang = ["Học", "lập", "trình", "tại", "code24h.com"];

// Lấy phần tử "tại" và "code24h.com"
var mang_moi = mang.slice(3, 5);

// In ra thử
document.write(mang_moi.valueOf());

Trường hợp bạn muốn lấy từ vị trí nào đó đến cuối mảng thì bạn sẽ truyền một tham số thôi.

Ví dụ: XEM DEMO

<!DOCTYPE html>
<html>
    <body>
        <script language="javascript">
            var mang = ["Học", "lập", "trình", "tại", "code24h.com"];

            // Lấy phần tử "tại" và "code24h.com"
            var mang_moi = mang.slice(3);

            // In ra thử
            document.write(mang_moi.valueOf());
        </script>
    </body>
</html>

2. Lời kết

Trên là danh sách các hàm xử lý mảng trong javascript mà ta hay sử dụng nhất, vẫn còn khá nhiều hàm nên mình không thể liệt kê hết được. Sau này học nâng cao lên bạn có thể tự định nghĩa thêm các hàm riêng cho mình bằng cách sử dụng prototype. 

BÀI KẾ SAU
BÀI KẾ TIẾP

Nguồn: code24h.com

Bài liên quan

Bài 7: Các hàm xử lý mảng trong php

1. array_merge($array1, $array2 [,array...]); Sáp nhập các phần tử của một hoặc nhiều mảng với nhau để mà các value của mảng này được phụ thêm vào cuối mảng kia. Nếu các mảng đầu vào có cùng các key ở dạng chuỗi, thì value sau cho key đó sẽ được ghi đè lên value trước (với cùng key đó). ...

Bùi Văn Nam viết 3 tuần trước

Tổng hợp các hàm xử lý mảng trong php

Hướng dẫn phương thức get và post trong php Danh sách các hàm xử lý chuỗi trong php Tổng hợp các hàm xử lý file trong php Hướng dẫn upload file lên server với php Giới thiệu một số hàm xử lý mảng trong php giúp bạn đọc tiện cho việc tra cứu học lập trình. Chúng ta cùng bắt đầu tìm ...

Tạ Quốc Bảo viết 17:11 ngày 04/09/2018

Tổng hợp các hàm xử lý chuỗi trong Javascript

Tìm hiểu setTimeout() và setInterval() trong Javascript Tìm hiểu chuỗi (string) trong Javascript Tìm hiểu hàm typeof trong Javascript Tìm hiểu đối tượng Number trong Javascript Các hàm xử lý chuỗi trong Javascript dưới đây được mình tổng hợp và đưa ra các ví dụ thực hành giúp bạn đọc ...

Tạ Quốc Bảo viết 17:04 ngày 04/09/2018

Tổng hợp các hàm xử lý mảng trong Javascript

Tổng hợp một số ví dụ học Javascript căn bản Cách thao tác với mảng trong Javascript Tìm hiểu DOM là gì? Các loại DOM trong Javascript Tìm hiểu DOM Element trong Javascript Danh sách các hàm xử lý mảng, thao tác với các mảng trong Javascript đóng vai trò quan trọng vì nó rất thực tế ...

Hoàng Hải Đăng viết 16:51 ngày 04/09/2018

Các hàm xử lý mảng trong PHP

PHP Các hàm xử lý mảng trong PHP , PHP cung cấp các hàm xử lý mảng khác nhau để truy cập và thao tác các phần tử của mảng. Các hàm mảng PHP quan trọng được đưa ra dưới đây. 1. Hàm array() trong PHP Hàm PHP array() được sử dụng để tạo và trả về một mảng. Nó cho phép bạn ...

Trịnh Tiến Mạnh viết 22:44 ngày 27/08/2018
0