Hàm map() trong JavaScript

• Trần Thị Vân
• 1030
• 28/08/2025

Chức năng của Hàm map() trong JavaScript

Hàm map() trong JavaScript dùng để lấy tất cả phần tử trong một mảng rối áp dụng các phép tính cho ra các kết quả về một mảng mới.

Code Hàm map() trong JavaScript

var mang  = [3,5,7];
var mangmoi = mang.map(function(phantu) {
  return phantu* 2; // Phép tính đối với từng phần tử
});

<script>
// Nhân mỗi phần tử trong mảng cho 2
document.write("<b>Nhân mỗi phần tử trong mảng cho 2</b><br>"); 
var mang  = [3,5,7];
var mangmoi = mang.map(function(phantu) {
  return phantu* 2;
});
// Vòng lặp xem các phần tử trong mảng
mangmoi.forEach((value, key) => {
document.write("Vị trí "+key+": "+value+"<br>"); 
});

// Cộng mỗi phần tử trong mảng lên 2
document.write("<b>Cộng mỗi phần tử trong mảng lên 2</b><br>"); 
var mang  = [3,5,7];
var mangmoi2 = mang.map(function(phantu) {
  return phantu + 2;
});
// Vòng lặp xem các phần tử trong mảng
mangmoi2.forEach((value, key) => {
document.write("Vị trí "+key+": "+value+"<br>"); 
});
</script>

Kết quả:

Nhân mỗi phần tử trong mảng cho 2
Vị trí 0: 6
Vị trí 1: 10
Vị trí 2: 14
Cộng mỗi phần tử trong mảng lên 2
Vị trí 0: 5
Vị trí 1: 7
Vị trí 2: 9

Chạy Thử

Khi nào nên sử dụng map() trong JavaScript?

map() phù hợp khi bạn cần đi qua từng phần tử của một mảng, xử lý dữ liệu theo cùng một quy tắc và tạo ra một mảng mới từ kết quả đó. Điểm quan trọng là phương thức này không nhằm thay đổi trực tiếp mảng ban đầu, mà tập trung vào việc tạo dữ liệu đầu ra mới.

Biến đổi từng phần tử trong mảng

Đây là trường hợp phổ biến nhất khi sử dụng map(). Mỗi phần tử được đưa vào hàm callback, sau đó kết quả trả về từ callback sẽ trở thành một phần tử tương ứng trong mảng mới.

Chẳng hạn, khi có danh sách giá sản phẩm và muốn cộng thêm thuế cho từng giá, bạn có thể dùng map() thay vì viết vòng lặp thủ công. Cách này giúp thể hiện rõ mục đích: lấy dữ liệu hiện có và tạo ra một phiên bản đã được biến đổi.

Tạo mảng mới mà không làm thay đổi mảng ban đầu

map() đặc biệt hữu ích khi cần giữ nguyên dữ liệu gốc để tiếp tục sử dụng ở những bước khác. Phương thức này trả về một mảng mới nên các thao tác biến đổi giá trị trong callback không trực tiếp thay đổi cấu trúc của mảng ban đầu.

Điều này phù hợp với các tình huống như định dạng danh sách dữ liệu trước khi hiển thị, chuyển đổi dữ liệu từ API hoặc tạo một danh sách chỉ chứa những thuộc tính cần thiết. Tuy nhiên, nếu phần tử là object thì cần lưu ý rằng map() không tự động sao chép sâu object đó.

Khi nào không nên dùng map()?

Không nên chọn map() chỉ vì cần duyệt qua một mảng. Nếu mục tiêu là thực hiện một hành động trên từng phần tử mà không cần tạo mảng kết quả mới, forEach() thường phù hợp hơn.

Tương tự, nếu cần loại bỏ một số phần tử thì filter() thể hiện đúng mục đích hơn, còn khi cần tổng hợp nhiều giá trị thành một kết quả duy nhất thì reduce() sẽ phù hợp hơn. Chọn đúng phương thức giúp code dễ đọc và thể hiện rõ ý định xử lý dữ liệu.

Lời kết

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