Mảng (Array) trong JavaScript

Mảng (Array) trong JavaScript
Mảng (Array) trong JavaScript

Chức năng của Mảng (Array) trong JavaScript

Mảng (Array) trong JavaScript dùng để lưu nhiều phần tử ở trong một biến, những phần tử đó có thể chứa giá trị là chữ, số, mảng,... mỗi phần tử và có 1 vị trí riêng ở trong mảng.

Cú pháp của Mảng (Array) trong JavaScript

Mảng new Array()

var mang = new Array("phantu1","phantu2","phantu3","phantu4");

mang: Biến của Mảng.

"phantu1","phantu2","phantu3","phantu4": Thêm nhiều phần tử

Mảng []

var mang = ["phantu1","phantu2","phantu3","phantu4"];

mang: Biến của Mảng.

"phantu1","phantu2","phantu3","phantu4": Thêm nhiều phần tử

Khai báo Mảng (Array) trong JavaScript

<script>
// Mảng new Array();
var mangmot = new Array("Vân","Lực","Quỳnh","Dung");
document.write(mangmot[0]+"<br>"); // Kết quả: Vân

// Mảng [];
var manghai = ["Vân","Lực","Quỳnh","Dung"];
document.write(manghai[1]+"<br>"); // Kết quả: Lực
</script>

Kết quả:

Vân
Lực

Chạy Thử

Dùng vòng lặp duyệt Mảng (Array) trong JavaScript

Dùng để lặp qua các phần tử trong mảng và lấy ra giá cột giá trị, khóa(key),... của từng phần tử:

<script>
var mang = new Array("Vân","Lực","Quỳnh","Dung");

// Vòng lặp for
for (var i = 0; i < mang.length; i++){ 
document.write(mang [i]+"<br>"); 
}

// Vòng lặp while
var i = 0;
while (i < mang.length){
    document.write(mang[i]+", ");
    i++;
}
</script>

Kết quả:

Vân
Lực
Quỳnh
Dung
Vân, Lực, Quỳnh, Dung,

Chạy Thử

Các thao tác thường dùng với Mảng (Array) trong JavaScript

Sau khi tạo và duyệt Mảng (Array), bước tiếp theo là biết cách thay đổi, tìm kiếm và sắp xếp dữ liệu bên trong mảng. JavaScript cung cấp nhiều phương thức giúp thực hiện các thao tác này nhanh gọn mà không cần tự xử lý từng phần tử.

Thêm và xóa phần tử trong Mảng (Array)

Để thêm hoặc xóa phần tử, có thể sử dụng push(), unshift(), pop()shift(). Trong đó, push() thêm phần tử vào cuối mảng, còn unshift() thêm vào đầu mảng.

let fruits = ["Táo", "Cam"];

fruits.push("Xoài");
fruits.unshift("Chuối");

console.log(fruits);

Ngược lại, pop() xóa phần tử cuối và shift() xóa phần tử đầu. Các phương thức này phù hợp khi cần thao tác trực tiếp với cấu trúc dữ liệu hiện có.

Truy cập và thay đổi phần tử trong Mảng (Array)

Mỗi phần tử trong mảng được xác định bằng một chỉ mục (index), bắt đầu từ 0. Có thể đọc giá trị thông qua chỉ mục và gán giá trị mới để thay đổi phần tử.

let products = ["Laptop", "Điện thoại", "Máy tính bảng"];

console.log(products[1]);

products[1] = "Tai nghe";

console.log(products);

Cách này hữu ích khi đã biết chính xác vị trí cần xử lý. Nếu chưa biết phần tử nằm ở đâu, nên kết hợp với các phương thức tìm kiếm thay vì truy cập trực tiếp bằng chỉ mục.

Tìm kiếm phần tử trong Mảng (Array)

Các phương thức như includes(), indexOf()find() giúp xác định dữ liệu có tồn tại hoặc tìm phần tử phù hợp với một điều kiện.

let numbers = [10, 20, 30, 40];

console.log(numbers.includes(30));
console.log(numbers.indexOf(40));

let result = numbers.find(function(number) {
    return number > 25;
});

console.log(result);

includes() thích hợp khi chỉ cần kiểm tra có chứa giá trị hay không. indexOf() trả về vị trí của phần tử, còn find() phù hợp với trường hợp cần tìm theo điều kiện.

Sắp xếp và đảo ngược Mảng (Array)

Phương thức sort() dùng để sắp xếp các phần tử, trong khi reverse() đảo ngược thứ tự hiện tại của mảng.

let numbers = [30, 5, 20, 10];

numbers.sort(function(a, b) {
    return a - b;
});

console.log(numbers);

numbers.reverse();

console.log(numbers);

Khi sắp xếp số, nên cung cấp hàm so sánh cho sort(). Nếu bỏ qua hàm này, JavaScript có thể xử lý các giá trị theo thứ tự chuỗi, dẫn đến kết quả không phù hợp với cách sắp xếp số thông thường.

Kiểm tra số lượng phần tử trong Mảng (Array)

Thuộc tính length cho biết số lượng phần tử hiện có trong mảng. Đây là cách đơn giản để kiểm tra kích thước dữ liệu hoặc làm điều kiện cho vòng lặp.

let students = ["An", "Bình", "Chi", "Dũng"];

console.log(students.length);

Giá trị length cũng thay đổi khi mảng được thêm hoặc xóa phần tử. Vì vậy, khi duyệt mảng bằng vòng lặp, sử dụng length giúp giới hạn phạm vi xử lý theo số phần tử thực tế.

Lời kết

Cảm ơn các bạn đã tham khảo bài viết Mảng (Array) trong JavaScript.

  • 0 Bình luận
Trần Thị Vân | Content Creator Web Mới
Trần Thị Vân
Trần Thị Vân là Content Creator tại Web Mới, phụ trách nghiên cứu, biên soạn nội dung và chia sẻ kiến thức về website, SEO, lập trình cùng các xu hướng công nghệ
Đánh giá
Chia sẻ nội dung đánh giá của bạn về Mảng (Array) trong JavaScript
Email, Điện thoại của bạn sẽ không được hiển thị công khai. Các trường bắt buộc được đánh dấu *
Đánh giá của bạn
Tên *
Email
Số điện thoại *
Bình luận, Hỏi đáp
Yêu Cầu Báo Giá
Gửi trang web mẫu cần làm theo, chúng tôi sẽ báo giá đến bạn từ Email (tanlucit09@gmail.com - Bùi Tấn Lực) hoặc Zalo (Lực IT - 0398259259) !