Hàm xử lý mảng trong Javascript

Thì như mình đã nói rằng lượng kiến thức về mảng cũng khá nhiều. Nếu bạn đã lắm được kiến thức về mảng như mình đã giới thiệu ở bài trước mà chưa lắm được kiến thức trong nội dung mình sắp trình bày dưới đây thì coi như là bạn chưa lắm được gì cả.

Trong nội dung bài viết này chúng ta sẽ đi tìm hiểu một số hàm & một số thuộc tính thông dụng được dùng để xử lý mảng trong Javascript nhé.

1. Thuộc tính length.

Thuộc tính length trong Javascript là sẽ trả về tổng số phần tử tồn tại trong mảng. 

Trong nhiều trường hợp chúng ta cần biết tổng số phần tử mảng để chúng ta có những bước xử lý tiếp theo. E.g trong vòng lặp mà chúng ta đã học để biết được số vòng lặp sẽ thực hiện.

<script type="text/javascript">
	// Khai báo mảng
	var languages = ['PHP', 'MySQL', 'JQuery', 'HTML', 'CSS'];
	
	// Xuất ra tổng số phần tử mảng
	document.write('Tổng số phần tử mảng :'+ languages.length);
</script>

Xem kết quả

2. Hàm join()

Hàm join() được xử dụng trong mảng Javascript để nối các phần tử mảng thành một chuỗi.

Cú pháp:

array.join(separator)

Trong đó:

• separator − Xác định một chuỗi để phân biệt riêng rẽ các phần tử trong một mảng. Nếu bị bỏ qua, các phần tử trong mảng được phân biệt bởi dấu phảy.

Ví dụ:

<script type="text/javascript">
	// Khai báo mảng
	var languages = ['PHP', 'MySQL', 'JQuery', 'HTML', 'CSS'];
	
	// Nối các phần tử mảng sử dụng dấu |
	document.write('Tổng số phần tử mảng :'+ languages.join('|'));
	
	document.write('<br />');
	
	// Nối các phần tử mảng không truyền dấu bất kỳ
	document.write('Tổng số phần tử mảng :'+ languages.join());
</script>

Xem kết quả

3. 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.

Cú pháp:

array.valueOf()

Ví dụ:

<script type="text/javascript">
	// Khai báo mảng
	var languages = ['PHP', 'MySQL', 'JQuery', 'HTML', 'CSS'];
	document.write(languages.valueOf());
</script>

Xem kết quả

4. Hàm array.push()

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

<script type="text/javascript">
	// Khai báo mảng
	var languages = ['PHP', 'MySQL', 'JQuery', 'HTML', 'CSS'];
	// Thêm phần tử mảng
	languages.push('Android');
</script>

Xem kết quả

5. Hàm array.pop()

Hàm này có tác dụng xóa đi phần tử cuối cùng trong mảng.

<script type="text/javascript">
	// Khai báo mảng
	var languages = ['PHP', 'MySQL', 'JQuery', 'HTML', 'CSS'];
	// Xóa phần tử cuối cùng mảng
	languages.pop();
</script>

Xem kết quả

6. Hàm array.shift()

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

<script type="text/javascript">
	// Khai báo mảng
    var languages = ['PHP', 'MySQL', 'JQuery', 'HTML', 'CSS'];
	
	languages.shift();
</script>

Xem kết quả

7. 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 tăng chỉ mục các phẩn từ phía sau lên một bậc.

<script type="text/javascript">
	// Khai báo mảng
    var languages = ['PHP', 'MySQL', 'JQuery', 'HTML', 'CSS'];
	
	languages.unshift("Android");
</script>

Xem kết quả

8. Hàm array.slice()

Hàm dùng để lấy một số phần tử con trong mảng.

Cú pháp:

array.slice(start, end)

Trong đó:

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

<script type="text/javascript">
	// Khai báo mảng
	var languages = ['PHP', 'MySQL', 'JQuery', 'HTML', 'CSS'];
	// Lấy phần tử từ vị trí thứ 1 -> 3 
	var languages_sub = languages.slice(1,3);
	
	document.write(languages_sub.valueOf());
</script>

Xem kết quả

9. Hàm array.concat()

Hàm dùng để ghép nối hai mảng với nhau và trả về một mảng bao gồm tổng số phần tử của hai mảng kết hợp.

<script type="text/javascript">
	// Khai báo mảng 1
	var array1 = ['PHP', 'MySQL', 'CSS'];
	// Khai báo mảng 2
	var array2 = ['JQuery', 'HTML'];
	
	// Merge mảng
	var groups = array1.concat(array2);
</script>

Xem kết quả

10. Hàm array.reverse()

Hàm này được sử dụng để đả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.

<script type="text/javascript">
	// Khai báo mảng
	var languages = ['PHP', 'MySQL', 'JQuery', 'HTML', 'CSS'];
	document.write('Before: ' + languages.valueOf());
	
	document.write('<br/>');
	
	var languages = languages.reverse();
	document.write('After: ' + languages.valueOf());
</script>

Xem kết quả

11. Tổng kết.

Trong bài viết này mình đã giới thiệu với các bạn về các hàm xử lý trong Javascript. Nói chung thì Javascript vẫn là ngôn ngữ không thể thiếu trong việc xây dựng những ứng dụng trên website. Việc lắm vững những kiến thức về lập trình mảng sẽ phần nào giúp bạn giải quyết tốt các yêu cầu phức tạp của các bài toán khó trong xây dựng các ứng dụng.