Hàm copyWithin() trong JavaScript

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

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

Hàm copyWithin() trong JavaScript dùng để copy giá trị của các phần tử trong mảng rồi đè vào giá trị của các phần tử khác cũng trong mảng đó.

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

mang.copyWithin(vitridan,batdau,ketthuc)

mang: Mảng.

vitridan: điểm bắt đầu dán.

batdau: điểm bắt đầu copy.

ketthuc: điểm kết thúc copy, tới vị trí đó sẽ không copy nữa mà chỉ copy vị trí đứng trước nó, nếu để trống thì điểm kết thúc copy là cuối mảng(lấy luôn vị trí cuối mảng).

mang.copyWithin(vitridan,batdau)

mang: Mảng.

vitridan: điểm bắt đầu dán.

batdau: điểm bắt đầu copy đến cuối mảng.

Code Hàm copyWithin() trong JavaScript

<script>
var mang  = [1,2,3,4,5,6,7,8,9];
// lấy phần tử từ vị trí 6 đến vị trí 7 đè vô vị trí bắt đầu là 0
document.write("<b>lấy phần tử từ vị trí 6 đến vị trí 7 đè vô vị trí bắt đầu là 1</b><br>"); 
mang.copyWithin(1,6,8);
// Vòng lặp xem các phần tử trong mảng
mang.forEach((value, key) => {
document.write("Vị trí "+key+": "+value+"<br>"); 
});

var manghai  = [1,2,3,4,5,6,7,8,9];
// lấy phần tử từ vị trí 7 đến cuối mảng đè vô vị trí bắt đầu là 0
document.write("<b>lấy phần tử từ vị trí 7 đến cuối mảng đè vô vị trí bắt đầu là 0</b><br>"); 
manghai.copyWithin(0,7);
// Vòng lặp xem các phần tử trong mảng
manghai.forEach((value, key) => {
document.write("Vị trí "+key+": "+value+"<br>"); 
});
</script>

Kết quả:

lấy phần tử từ vị trí 6 đến vị trí 7 đè vô vị trí bắt đầu là 1
Vị trí 0: 1
Vị trí 1: 7
Vị trí 2: 8
Vị trí 3: 4
Vị trí 4: 5
Vị trí 5: 6
Vị trí 6: 7
Vị trí 7: 8
Vị trí 8: 9
lấy phần tử từ vị trí 7 đến cuối mảng đè vô vị trí bắt đầu là 0
Vị trí 0: 8
Vị trí 1: 9
Vị trí 2: 3
Vị trí 3: 4
Vị trí 4: 5
Vị trí 5: 6
Vị trí 6: 7
Vị trí 7: 8
Vị trí 8: 9

Chạy Thử

Những lưu ý khi sử dụng copyWithin() trong JavaScript

copyWithin() có cách hoạt động khác với nhiều phương thức xử lý mảng quen thuộc. Phương thức này sao chép các phần tử ngay bên trong mảng hiện tại, vì vậy cần hiểu rõ một số đặc điểm trước khi sử dụng để tránh làm thay đổi dữ liệu ngoài dự kiến.

copyWithin() thay đổi trực tiếp mảng ban đầu

copyWithin() không tạo ra một mảng mới. Khi thực thi, các phần tử trong mảng gốc sẽ được thay thế tại vị trí đích. Vì vậy, nếu mảng vẫn được sử dụng ở những đoạn xử lý tiếp theo, kết quả ban đầu sẽ không còn nguyên vẹn.

const numbers = [1, 2, 3, 4, 5];

numbers.copyWithin(0, 3);

console.log(numbers);

Kết quả là [4, 5, 3, 4, 5]. Hai phần tử bắt đầu từ vị trí 3 được sao chép vào vị trí 0, đồng thời dữ liệu cũ tại hai vị trí này bị ghi đè.

Nếu cần giữ nguyên mảng ban đầu, nên tạo bản sao trước khi gọi phương thức thay vì thao tác trực tiếp trên mảng gốc.

copyWithin() không làm thay đổi độ dài của mảng

Mục đích của copyWithin() là thay thế các phần tử hiện có chứ không thêm hoặc xóa phần tử. Do đó, sau khi thực hiện, thuộc tính length của mảng vẫn giữ nguyên.

const items = ['a', 'b', 'c', 'd'];

items.copyWithin(1, 2);

console.log(items);
console.log(items.length);

Trong trường hợp này, mảng vẫn có 4 phần tử. Giá trị tại vị trí đích được thay thế bằng dữ liệu được sao chép từ vị trí nguồn, thay vì tạo thêm phần tử mới.

Đặc điểm này giúp copyWithin() phù hợp khi cần di chuyển hoặc sao chép dữ liệu trong phạm vi kích thước cố định của một mảng.

Cẩn thận khi vùng sao chép bị chồng lấn

Vùng nguồn và vùng đích của copyWithin() có thể nằm chồng lên nhau. JavaScript vẫn xử lý việc sao chép theo cách bảo toàn dữ liệu nguồn cần thiết, nhưng kết quả có thể khó đoán nếu chỉ nhìn vào vị trí các phần tử.

const values = [1, 2, 3, 4, 5];

values.copyWithin(1, 0, 4);

console.log(values);

Kết quả là [1, 1, 2, 3, 4]. Phạm vi từ vị trí 0 đến trước vị trí 4 được sao chép vào vị trí 1, khiến các giá trị cũ trong phạm vi đích bị ghi đè.

Vì vậy, khi sử dụng copyWithin() với các phạm vi có thể giao nhau, nên xác định rõ vị trí bắt đầu đích, vị trí bắt đầu nguồn và giới hạn kết thúc trước khi thực hiện. Điều này giúp tránh ghi đè nhầm dữ liệu quan trọng trong mảng.

Lời kết

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