Ở phần hằng và biến trong javascript mình cũng có nói qua về cách khai báo mảng trong javascript rồi. Nhưng đó mới chỉ là mức độ khai báo còn sử dụng thì mình chưa nói, nên bài này mình sẽ giới thiệu lại với mọi người về cách xử lý mảng trong javascript một cách chi tiết hơn.
Khai báo mảng
-Ở trong javascript chúng ta có thể khai báo mảng bằng 2 cách sau đây:
Khai báo bằng dấu []
-Đối với cách này các bạn khai báo theo cú pháp sau:
|
1 |
var arr = [value1, value2, ..., valuen]; |
Trong đó:
- arr là tên biến mảng.
- value1,…valuen là các giá trị của mảng mà các bạn muốn tạo.
VD: Khai báo mảng arr gồm các số: 1,2,4,5,9,6 bằng dấu [].
|
1 |
var arr = [1, 2, 4, 5, 9, 6]; |
Khai báo bằng new Array()
-Đối với cách này các bạn khai báo với cú pháp như sau:
|
1 |
var arr = new Array(value1, value2, ..., valuen); |
Trong đó:
- arr là tên biến mảng.
- value1,…valuen là các giá trị của mảng mà các bạn muốn tạo.
VD: Khai báo mảng arr gồm các số: 1,2,4,5,9,6 bằng từ khóa new Arrray().
|
1 |
var arr = new Array(1, 2, 4, 5, 9, 6); |
Truy xuất mảng
-Sau khi đã tạo được mảng rồi thì chúng ta cần phải truy xuất thông tin của mảng. Để có thể lấy ra giá trị của một thành phần trong mảng thì chúng ta sử dụng cú pháp sau:
|
1 |
arr[index]; |
Trong đó: arr là tên biến mảng, index là vị trí của mảng(bắt đầu từ 0).
VD:
|
1 2 3 |
var arr = new Array(1, 2, 4, 5, 9, 6); alert(arr[1]); //result: 2 |
Các hàm xử lý mảng trong Javascript
1. pop()
Phương thức này cho phép xóa phần tử cuối cùng trong mảng và kết quả trả về là phần tử vừa được xóa. Các bạn có thể xem chi tiết ví dụ dưới đây để hiểu hơn về pop trong Javascript
|
1 2 3 4 5 |
let fruits = ["Bananas", "Mangos", "Apples", "Cherries", "Pineapples"]; fruits.pop(); Kết quả: "Pineapples" //output |
Sau khi xóa xong mảng fruits còn lại
|
1 |
["Bananas", "Mangos", "Apples", "Cherries"] //output |
2. push()
Phương thức push() cho phép thêm mới 1 phần tử vào vị trí cuối cùng của mảng. Giá trị thêm vào có thể là chuỗi, số, array hoặc object. Sau khi push thành công nó sẽ trả về tổng số phần tử của mảng.
|
1 2 3 |
let fruits = ["Bananas", "Mangos", "Apples", "Cherries"] fruits.push("Grapes"); Trả về: 5 //output |
Dữ liệu của mảng sau khi thêm mới phần tử
|
1 |
["Bananas", "Mangos", "Apples", "Cherries", "Grapes"] |
3. unshift()
Phương thức unshift() cho phép thêm mới 1 phần tử vào vị trí đầu tiên của mảng. Giá trị thêm vào có thể là chuỗi, số, array hoặc object. Sau khi push thành công nó sẽ trả về tổng số phần tử của mảng.
|
1 2 3 |
let fruits = ["Bananas", "Mangos", "Apples", "Cherries"] fruits.unshift("test"); Trả về: 5 //output |
Dữ liệu của mảng sau khi thêm mới phần tử
|
1 |
["test", "Bananas", "Mangos", "Apples", "Cherries"] |
4. shift()
Phương thức shift() cũng tương tự như pop() đều được dùng để xóa một phần từ trong mảng, tuy nhiên đối với shift() nó xóa phần tử đầu tiên còn pop() thì xóa phần tử cuối cùng
|
1 2 |
let fruits = ["Mangos", "Bananas", "Mangos", "Apples", "Cherries", "Pineapples"] fruits.shift() |
Dữ liệu của mảng sau khi xóa
|
1 |
["Bananas", "Mangos", "Apples", "Cherries"] |
5. slice()
Phương thức này cho phép tách các phần từ trong mảng thành một mảng mới. Các phần tử được tách từ vị trí bắt đầu và kết thúc mà mình truyền vào. Trong mảng thứ tự sẽ được đánh từ 0 đến N (Cái này gọi là index của mảng)
Chúng ta cùng tìm hiểu ví dụ sau để hiểu hơn về phương thức này
|
1 2 3 4 |
let fruits = ["Mangos", "Bananas", "Mangos", "Apples", "Cherries"] fruits.slice(2, 4) Kết quả ["Mangos", "Apples"] //output |
Nhìn vào kết quả trên các bạn thấy phần tử được tách nằm ở ví trí số 2 đến 4 tương đương với 2 giá trị là Mangos và Apples
6. splice()
Phương thức này tương tự phương thức thức slice(). Dùng để xóa phần tử trong mảng, phương thức này có 2 cách sử dụng
* Xóa và thay thế phần tử đã xóa
|
1 2 3 4 |
let fruits = ["Mangos", "Bananas", "Mangos", "Apples", "Cherries"] fruits.splice(2,1,"Oranges") Kết quả: ["Mangos", "Bananas", "Oranges", "Apples", "Cherries"] |
* Xóa luôn
|
1 2 3 4 |
let fruits = ["Mangos", "Bananas", "Mangos", "Apples", "Cherries"] fruits.splice(2,1) Kết quả: ["Mangos", "Bananas", "Apples", "Cherries"] |
7. reverse()
Phương thức này cho phép sắp xếp thứ tự các phần tử của mảng bằng cách đảo ngược vị trí hiện tại
|
1 2 3 4 |
let fruits = ["Mangos", "Bananas", "Mangos", "Apples", "Cherries"] fruits.reverse() //Kết quả: ["Cherries", "Apples", "Mangos", "Bananas", "Mangos"] |
8. sort()
Phương thức này cho phép bạn sắp xếp các giá trị trong mảng theo thứ tự alphabet
|
1 2 |
let fruits = ["Mangos", "Bananas", "Mangos", "Apples", "Cherries"] fruits.sort() |
Kết quả:
|
1 |
["Apples", "Bananas", "Cherries", "Mangos", "Mangos"] |
9. concat()
Phương thức concat() cho phép gộp phần tử của 2 hay nhiều mảng khác nhau
|
1 2 3 4 |
let a = ['HTML', 'CSS'] let b = ['Javascript'] let c = ['PHP'] a.concat(b, c) |
Kết quả:
|
1 |
["HTML", "CSS", "Javascript", "PHP"] |
10. join()
Nếu bạn nào đã làm việc với PHP sẽ thấy concept của phương thức này rất giống với hàm implode() trong PHP. Nó cho phép bạn chuyển một mảng thành chuỗi. Giá trị của chuỗi là các phần tử của mảng được cách nhau bởi ký tự mà bạn truyền vào. Để hiểu hơn chúng ta cùng tìm hiểu ví dụ sau.
|
1 2 |
let arr = ["HTML", "CSS", "Javascript", "PHP"] arr.join('-') |
Kết quả: “HTML-CSS-Javascript-PHP”
Kết luận
Trong bài viết này chúng ta đã tìm hiểu về cách xử lý mảng trong JavaScript. Ở bài viết tiếp theo chúng ta sẽ tìm hiểu về Object trong JavaScript nhé.
Tham khảo: https://www.w3schools.com/