Hướng dẫn cách sử dụng phương thức concat() trong JavaScript. Bạn sẽ học được cách gộp mảng trong JavaScript, cũng như là cách copy mảng trong JavaScript bằng concat() sau bài học này.

concat() trong JavaScript

concat() trong JavaScript là một phương thức thành viên trong Array Object, có tác dụng gộp nhiều mảng chỉ định thành một mảng trong JavaScript mà không làm thay đổi các mảng ban đầu.

concat() trong JavaScript ngoài công dụng gộp các mảng với nhau, thì cũng có thể được sử dụng để thêm các giá trị vào cuối một mảng, hoặc là dùng để copy chính mảng đó và tạo ra một mảng mới.

Chúng ta sử dụng concat() trong JavaScript với 3 cú pháp cơ bản sau đây

Trong đó arr1 là mảng được sử dụng để gán các giá trị hoặc phần tử của các mảng khác vào nó, trước khi đem kết quả sau khi gộp này tạo ra một mảng mới.

Chúng ta có thể chỉ định một hoặc nhiều mảng, giá trị trong đối số của concat(). Chúng ta cũng có thể dùng cùng lúc cả mảng và giá trị đan xen, hoặc là lược bỏ toàn bộ chúng khi sử dụng concat() trong JavaScript.

Sử dụng concat để gộp mảng trong JavaScript

Trong trường hợp chỉ định một hoặc nhiều mảng trong đối số của phương thức concat, các mảng này sẽ được gộp lại và tạo ra mảng kết quả mới.

Ví dụ cụ thể:

let fruit1 = ['Apple', 'Melon'];
let fruit2 = ['Orange', 'Kiwi'];
let fruitAll = fruit1.concat( fruit2, ['Grapes', 'Strawberry']);

console.log(fruitAll);
//[ 'Apple', 'Melon', 'Orange', 'Kiwi', 'Grapes', 'Strawberry' ]

Chúng ta cũng có thể sử dụng đồng thời cả mảng lẫn giá trị khi cần gộp mảng trong bằng concat(). Ví dụ:

let fruit1 = ['Apple', 'Melon'];
let fruit2 = ['Orange', 'Kiwi'];
let fruitAll = fruit1.concat( 'Peach', fruit2);

console.log(fruitAll);
//[ 'Apple', 'Melon', 'Peach', 'Orange', 'Kiwi' ]

Sử dụng concat để thêm phần tử vào mảng trong JavaScript

Trong trường hợp chúng ta chỉ định các đối số trong concat là các giá trị, thì lúc này phương thức concat sẽ đơn giản thêm chúng như là phần tử vào cuối mảng ban đầu và tạo ra một mảng mới.

Ví dụ cụ thể:

let fruit1 = ['Apple', 'Melon'];

let fruitAll = fruit1.concat( 'Peach', 'Kiwi', 'Orange');

console.log(fruitAll);
//[ 'Apple', 'Melon', 'Peach', 'Kiwi', 'Orange' ]

Kết quả này khá giống với các phương thức khác như push() hoặc unshift() mà chúng ta đã học trong bài xử lý Thêm phần tử vào mảng trong JavaScript.

Sử dụng concat để copy mảng trong JavaScript

Trong trường hợp chúng ta lược bỏ toàn bộ các đối số khi sử dụng phương thức concat() trong JavaScript, lúc này concat() đơn giản sẽ copy mảng ban đầu và tạo ra một mảng mới trong JavaScript mà thôi.

Ví dụ cụ thể:

let fruit1 = ['Apple', 'Melon'];
let fruitAll = fruit1.concat();

console.log(fruitAll);
//[ 'Apple', 'Melon' ]

console.log(fruit1);
//[ 'Apple', 'Melon' ]

Lưu ý là nếu mảng ban đầu là một mảng 1 chiều, thì giữa mảng ban đầu và mảng kết quả không có mối quan hệ tham chiếu và hoàn toàn độc lập với nhau, nên việc thay đổi 1 trong 2 mảng cũng không ảnh hưởng đến mảng còn lại.

Tuy nhiên nếu sử dụng concat để copy một mảng 2 chiều trong JavaScript, giữa mảng kết quả và mảng ban đầu sẽ tồn tại mối quan hệ tham chiếu. Do đó khi thay đổi giá trị của một trong chúng thì mảng còn lại cũng sẽ thay đổi theo.

Do đó chúng ta chỉ nên dùng concat để copy mảng 1 chiều trong JavaScript mà thôi.

Tổng kết

Trên đây Kiyoshi đã hướng dẫn bạn về cách sử dụng concat trong JavaScript rồi. Để nắm rõ nội dung bài học hơn, bạn hãy thực hành viết lại các ví dụ của ngày hôm nay nhé.

Và hãy cùng tìm hiểu những kiến thức sâu hơn về JavaScript trong các bài học tiếp theo.

URL Link

https://laptrinhcanban.com/javascript/javascript-co-ban-den-nang-cao/mang-trong-javascript/concat-trong-javascript/