درود دوستان! می‌خوایم با عملگر Spread آشنا بشیم که از ES6 به جاوااسکریپت اضافه شده و کاربردهای جالب و زیادی داره.

موارد زیر رو توی این قسمت یاد می‌گیریم:

 

عملگر Spread چیه؟

معنی تحت‌اللفظی این Spread یعنی پخش کردن. این عملگر که به صورت سه‌نقطه ... هست، قبل از یک مقدار قابل پیمایش (Iterable) مثل یک آرایه قرار می‌گیره و اعضای اون رو پخش می‌کنه توی یک چیز دیگه مثل ورودی‌های یک تابع یا یک آرایه.

توی این مثال می‌خوایم اعضای یک آرایه رو پخش کنیم توی ورودی‌های یک تابع:

function add(a, b, c) {
  alert(a); // 1
  alert(b); // 2
  alert(c); // 3
}
const numbers = [1, 2, 3];

add(<<...numbers>>);

توی این کد و توی خط ۸ ما اعضای آرایه numbers رو پخش کردیم توی ورودی‌های تابع add. انگار چنین کاری انجام دادیم:

add(1, 2, 3);

همونطور که می‌بینیم بجای اینکه به صورت دستی ورودی‌ها رو پاس بدیم، این کار رو به صورت خودکار با عملگر Spread انجام دادیم 👌 ارزش این ویژگی توی این مثال زمانی پر رنگ‌تر میشه که آرایه‌هامون اعضای بیشتری داشته باشن و یا تعداد ورودی‌های تابع معین نباشه.

 

به غیر از ورودی‌های توابع، ما می‌تونیم اعضای یک آرایه رو پخش کنیم توی یک آرایه دیگه:

const arr1 = [1, 2, 3];
const arr2 = [4, 5, 6];

const merged = [<<...arr1>>,<<...arr2>>];

alert(merged); // 1,2,3,4,5,6

توی این کد، اعضای آرایه‌های arr1 و arr2 توی یک آرایه جدید به اسم merged پخش شدن. به کاری که انجام دادیم به اصطلاح گفته میشه ادغام کردن (Merge) دو آرایه. در واقع انگار چنین آرایه‌ای ساختیم:

[1, 2, 3, 4, 5, 6];

 

عملگر Spread و مقادیر قابل پیمایش

ما تا الان این پارامتر رو فقط برای آرایه‌ها استفاده کردیم. اما بالاتر گفتیم که این عملگر برای پخش کردن یک یا Iterable توی یک چیز دیگه استفاده میشه.