Định nghĩa
Spread syntax ... "trải" iterable (array, string, object...) thành các phần tử riêng lẻ.
Ví dụ với Array
<script>
var a = [10, 20];
var b = "rank";
var c = [30, "points"];
var d = "run";
// concat method (cũ)
var e = a.concat(b, c, d);
// spread (ES6) – ngắn gọn, rõ ràng
var f = [...a, b, ...c, d];
document.write("concat: " + e + "<br>"); // 10,20,rank,30,points,run
document.write("spread: " + f); // 10,20,rank,30,points,run
</script>
Ứng dụng phổ biến
- Copy array:
const copy = [...arr](shallow copy). - Merge array:
const merged = [...arr1, ...arr2]. - Chuyển iterable thành array:
[...new Set(arr)](unique),[...arguments],[...document.querySelectorAll('div')]. - Rest parameters:
function fn(...args). - Object spread (ES2018):
{...obj, key: val}– merge, override property.
Object Spread
const user = { name: "An", age: 25 };
const updated = { ...user, age: 26, city: "Hanoi" };
// { name: "An", age: 26, city: "Hanoi" }
Lưu ý
- Shallow copy – object lồng nhau vẫn tham chiếu chung.
- Chỉ dùng ở vị trí argument, array literal, object literal.
- Không dùng được trên plain object trước ES2018 (cần Babel/transpile).