Cách nối hai mảng trong JavaScript – js nối hai mảng

Việc kết hợp hai mảng thường được gọi là hợp nhất mảng.

Vì bạn có hai mảng:

  
 const 
 
 hoa quả 
 
 = 
 
 [
 
 '
 
 chuối 
 
'  
, 
 
 '
 
 apple 
 
' 
 
] 
 const 
 
 rau 
 
 = 
 
 [ 
 '
 
 ngô 
 
' 
 
, 
 
 '
 
 bí đỏ 
 
' 
 
] 
 

Nối các mảng bằng cú pháp Spread

cú pháp spread (hoặc toán tử spread) được sử dụng khi các mục từ và có thể lặp lại cần được mở rộng, ví dụ: trong mảng.

Vì vậy, để nối các mảng trái cây và rau, chúng tôi sẽ tạo một biến mới và gán cho nó một mảng mới:

  
 const 
 
 thực phẩm 
 
 = 
 
 [... 
 
 hoa quả 
 
, 
 
 ... 
 
 rau 
 
] 
 thực phẩm 
 
 // ['chuối', 'táo', 'ngô', 'bí ngô'] 
 

Sử dụng phương pháp này, bạn thực sự có thể nối nhiều mảng:

  
 const 
 
 thực phẩm 
 
 = 
 
 [... 
 
 hoa quả 
 
, 
 
 ... 
 
 rau 
 
, 
 
 ... 
 
 sữa 
 
, 
 
 ... 
 
 ngũ cốc  
] 
 

Hỗ trợ của trình duyệt cho cú pháp Spread: được hỗ trợ trong tất cả các trình duyệt chính ngoại trừ IE.

Nối các mảng bằng phương thức .concat ()

Phương thức concat () được sử dụng để hợp nhất hai hoặc nhiều mảng.

Bạn có thể sử dụng nó theo cách tương tự như ví dụ trên, tạo một biến mới và gán cho nó một mảng đã hợp nhất:

  
 const 
 
 thực phẩm 
 
 = 
 
 hoa quả 
 
. 
 
 concat 
 
 ( 
 rau 
 
) 
 thực phẩm 
 
 // ['chuối', 'táo', 'ngô', 'bí ngô'] 
 

LƯU Ý: Phương thức concat () không thay đổi các mảng hiện có mà trả về một mảng mới .

Để nối nhiều mảng, chỉ cần chỉ định mỗi mảng làm đối số bổ sung cho phương thức concat () :

  
 // một cách khác để sử dụng phương thức concat 
 const 
 
 thực phẩm 
 
 = 
 
 []. 
 
 concat 
 
 (
 
 hoa quả 
 
, 
 
 rau 
 
, 
 
 bơ sữa 
 
, 
 
 ngũ cốc 
 
) 
 

Hỗ trợ trình duyệt cho phương thức concat () : được hỗ trợ tất cả các trình duyệt chính .

Nối các mảng bằng phương thức .push ()

Trong trường hợp bạn muốn nối các mảng và cập nhật giá trị của mảng ban đầu (thay đổi nó), bạn có thể sử dụng phương thức push () .

Phương thức push () thêm một hoặc nhiều phần tử vào cuối mảng. Để đẩy toàn bộ mảng, bạn cần sử dụng cú pháp Spread:

  
 hoa quả 
 
. 
 
 push 
 
 (... 
 
 rau 
 
) 
 hoa quả 
 
 // ['chuối', 'táo', 'ngô', 'bí ngô'] 
 

Phương thức push () chấp nhận nhiều đối số, vì vậy bạn có thể nối nhiều mảng thành một:

 
 hoa quả 
 
. 
 
 đẩy 
 
 (.. . 
 
 rau 
 
, 
 
 ... 
 
 sữa 
 
, 
 
 ... 
 
 ngũ cốc 
 
) 
 

Phương thức push () là một phương pháp hữu ích bên trong các vòng lặp khi bạn cần cập nhật mảng hiện có. < / p>

Hỗ trợ trình duyệt cho phương thức push () : được hỗ trợ trong tất cả các trình duyệt chính . < / p>

Xử lý các bản sao

Trong trường hợp các mục mảng bạn đang tham gia là chuỗi hoặc số, có thể có trường hợp bạn cần hợp nhất các giá trị trùng lặp. Sao cho mỗi mục là duy nhất và xuất hiện một lần trong mảng.

Để đối phó với các bản sao, bạn có thể sử dụng đối tượng Set và gán nó cho một biến mới:

  
 const 
 
 hoa quả 
 
 = 
 
 [
 
 '
 
 chuối 
 
'  
, 
 
 '
 
 apple 
 
' 
 
, 
 
 '
 
 cà chua 
 
 '
 
] 
 const 
 
 rau 
 
 = 
 
 [ 
 '
 
 ngô 
 
' 
 
, 
 
 '
 
 bí đỏ 
 
' 
 
, 
 
 '
 
 cà chua 
 
' 
 
] 

 const 
 
 thức ăn 
 
 = 
 
 [.. . 
 
 new 
 
 Đặt 
 
 ([... 
 
 hoa quả 
 
, 
 
 ... 
 
 rau  
])] 
 thực phẩm 
 
 // ['chuối', 'táo', 'cà chua', 'ngô', 'bí ngô'] 
 

Trong trường hợp bạn đang tham gia các mảng chứa các đối tượng hoặc các mục có giá trị hỗn hợp, tôi khuyên bạn nên sử dụng thư viện lodash để kiểm tra các bản sao và hợp nhất chúng.

Ví dụ từ lodash sử dụng phương thức unionWith để nối hai mảng có một mục trùng lặp:

  
 var 
 
 đối tượng 
 
 = 
 
 [{
 
 '
 
 x 
 
' < / p> 
: 
 
 1 
 
, 
 
 '
 
 y 
 
' 
 
: 
 
 2 
 
}, 
 
 {
 
 '
 
 x 
 
 '
 
: 
 
 2 
 < p class = "p">, 
 
 '
 
 y 
 
'  
: 
 
 1 
 
}] 
 var 
 
 những người khác 
 
 = 
 
 [{< / p> 
 '
 
 x 
 
' 
 
 : 
 
 1 
 
, 
 
 '
 
 y 
 
 '
 
: 
 
 1 
 
}, 
 
 {
 
 '
 
 x 
 < p class = "dl"> '
 
: 
 
 1 
 
,  
 '
 
 y 
 
' 
 
: < / p> 
 2 
 
}] 

 _ 
 
. 
 
 unionVới 
 
 ( 
 đối tượng 
 
, 
 
 đối tượng khác 
 
, 
 
 _ 
 
. 
 
 isEqual 
 
) 

 // = & gt; [{'x': 1, 'y': 2}, {'x': 2, 'y': 1}, {'x': 1, 'y': 1}]