Hàm concat() trong JavaScript

Hàm concat() trong JavaScript
Hàm concat() trong JavaScript

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

Hàm concat() trong JavaScript dùng để nối nhiều mảng lại với nhau hoặc nối nhiều chuỗi lại với nhau để tạo nên một mảng mới hoặc một chuỗi mới.

Cú pháp của Hàm concat() trong JavaScript

Nối Mảng

var mangmoi = mangmot.concat(manghai,mangba,.....);

mangmot: Mảng một

manghai,mangba,.....: Mảng hai, mảng ba,.....

mangmoi: Trả về mảng mới

Thứ tự nối từ mảng 1 tới mảng 2, mảng 3,......

Nối Mảng

var chuoimoi = chuoimot.concat(chuoihai,chuoiba,.....);

chuoimot: Chuỗi một

chuoihai,chuoiba,.....: Chuỗi hai, chuỗi ba,.....

chuoimoi: Trả về chuỗi mới

Thứ tự nối từ chuỗi 1 tới chuỗi 2, chuỗi 3,......

Code Hàm concat() trong JavaScript

<script>
// Nối nhiều mảng lại với nhau
document.write("<b>Nối nhiều mảng lại với nhau</b><br>"); 
var mangmot  = new Array("Vân","Lực","Quỳnh");
var manghai  = new Array("Dung","Hạ");
var mangba  = new Array("Nhím","Cherry");
var mangmoi = mangmot.concat(manghai,mangba);
// Vòng lặp xem các phần tử trong mảng
mangmoi.forEach((value, key) => {
document.write("Vị trí "+key+": "+value+"<br>"); 
});

// Nối nhiều chuỗi lại với nhau
document.write("<b>Nối nhiều chuỗi lại với nhau</b><br>"); 
var chuoimot = "Xin ";
var chuoihai =  "chào ";
var chuoiba = "bạn ";
var chuoimoi = chuoimot.concat(chuoihai,chuoiba);
document.write(chuoimoi+"<br>"); 
</script>

Kết quả:

Nối nhiều mảng lại với nhau
Vị trí 0: Vân
Vị trí 1: Lực
Vị trí 2: Quỳnh
Vị trí 3: Dung
Vị trí 4: Hạ
Vị trí 5: Nhím
Vị trí 6: Cherry
Nối nhiều chuỗi lại với nhau
Xin chào bạn

Chạy Thử

Khi nào nên dùng hàm concat() trong JavaScript?

concat() phù hợp khi cần ghép một hoặc nhiều mảng, giá trị thành một mảng mới mà vẫn muốn giữ nguyên dữ liệu ban đầu. Cách dùng này đặc biệt hữu ích khi xử lý dữ liệu theo hướng không làm thay đổi trực tiếp mảng đang có.

Nối mảng mà không làm thay đổi mảng ban đầu

Một ưu điểm đáng chú ý của concat() là phương thức này không chèn phần tử trực tiếp vào mảng ban đầu. Thay vào đó, JavaScript tạo ra một mảng mới chứa dữ liệu sau khi nối.

const first = ["HTML", "CSS"];
const second = ["JavaScript"];

const result = first.concat(second);

console.log(result);
console.log(first);

Trong ví dụ trên, result chứa dữ liệu của cả hai mảng, còn first vẫn giữ nguyên. Điều này giúp hạn chế những thay đổi ngoài ý muốn khi cùng một mảng được sử dụng ở nhiều vị trí trong chương trình.

Nối nhiều mảng hoặc giá trị trong một lần

Không chỉ nối hai mảng, concat() còn có thể nhận nhiều đối số trong cùng một lần gọi. Các giá trị được truyền vào sẽ lần lượt được thêm vào mảng kết quả.

const numbers = [1, 2];

const result = numbers.concat([3, 4], 5, 6);

console.log(result);

Cách này giúp mã nguồn ngắn gọn hơn khi cần kết hợp dữ liệu từ nhiều nguồn. Tuy nhiên, nên sử dụng có chủ đích để cấu trúc xử lý vẫn dễ đọc, đặc biệt khi danh sách đối số trở nên dài.

Những lưu ý khi sử dụng concat()

  • Không thay đổi mảng ban đầu: kết quả của concat() được trả về dưới dạng một mảng mới.
  • Có thể truyền nhiều đối số: mỗi mảng hoặc giá trị được xử lý theo thứ tự xuất hiện trong lời gọi phương thức.
  • Không nên nhầm với push(): push() thêm dữ liệu trực tiếp vào mảng hiện tại, trong khi concat() tạo ra kết quả mới.
  • Lưu ý với dữ liệu phức tạp: việc tạo mảng mới không đồng nghĩa mọi đối tượng bên trong đều được sao chép độc lập. Các phần tử là object vẫn có thể tham chiếu đến cùng dữ liệu.

Lời kết

Cảm ơn các bạn đã tham khảo bài viết Hàm concat() 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ề Hàm concat() 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) !