اپراتورهای تخریب و گسترش: چرا و چه زمانی استفاده کنیم؟

تصور کنید کارآگاهی هستید که در تلاش برای حل یک جنایت هستید. شما به تازگی فهرستی از مظنونان و حقایق مربوط به آنها را از مخبر خود دریافت کرده اید. با این حال، فهرست به هم ریخته است و پیدا کردن اطلاعات مورد نیاز دشوار است.

اینجاست که اپراتورهای تخریب و گسترش وارد می شوند. با این ابزارها، ما می توانیم به سرعت اطلاعات مربوطه را از لیست استخراج کنیم و به روشی سازمان یافته و کارآمدتر با آن کار کنیم.

⭐ تخریب

ساختارشکنی به ما این امکان را می دهد که مقادیر را از آرایه ها و اشیاء استخراج کنیم و آنها را به متغیرها در یک نحو مختصر نسبت دهیم.

تخریب یک آرایه:

const suspects = ['Alice', 'Bob', 'Mallory'];
const [firstSuspect, secondSuspect] = suspects;
console.log(firstSuspect); // 'Alice'
console.log(secondSuspect); // 'Bob'

همانطور که می بینید، ما توانستیم عناصر اول و دوم آرایه مشکوک را استخراج کرده و با استفاده از ساختارشکنی به متغیرها اختصاص دهیم.

تخریب یک شی:

const suspects = {
 'Alice': 'at the library',
 'Bob': 'at the gym',
 'Eve': 'at home',
 'Mallory': 'at the park'
};
const { Alice, Bob, Eve } = suspects;
console.log(Alice); // 'at the library'
console.log(Bob); // 'at the gym'
console.log(Eve); // 'at home'

⭐ اپراتور Spread

عملگر spread به ما اجازه می دهد تا عناصر را اضافه یا پخش کنیم.

افزودن عناصر به آرایه:

const suspects = ['Alice', 'Bob', 'Eve', 'Mallory'];
const newSuspects = ['Frank', 'Gina', ...suspects];
console.log(newSuspects); // ['Frank', 'Gina', 'Alice', 'Bob', 'Eve', 'Mallory']

همانطور که می بینیم، از عملگر spread برای اضافه کردن عناصر از آرایه suspects به آرایه newSuspects استفاده کردیم.

عناصر را در یک آرایه پخش کنید:

const suspects = ['Alice', 'Bob', 'Eve', 'Mallory'];
console.log(...suspects); // 'Alice', 'Bob', 'Eve', 'Mallory'

⭐ زمان استفاده

1️⃣ وقتی می‌خواهیم چندین ویژگی را از یک شی استخراج کنیم: به جای انتخاب دستی هر ویژگی، می‌توانیم آن‌ها را در متغیرهای جداگانه تخریب کنیم.

2️⃣ وقتی می‌خواهیم مقادیر پیش‌فرض را تنظیم کنیم: اگر مقداری در شی وجود نداشته باشد، destructuring به ما اجازه می‌دهد یک مقدار پیش‌فرض را تنظیم کنیم.

const { Alice, Bob = "No evidence, but doubtful" } = suspects;

3️⃣ وقتی می خواهیم ویژگی های شی را به عنوان پارامترهای تابع ارسال کنیم: از Destructuring می توان برای بازکردن ویژگی های شی به طور مستقیم در پارامترهای تابع استفاده کرد.

4️⃣ وقتی می خواهیم یک شی یا آرایه را کلون کنیم: عملگر spread به ما این امکان را می دهد که به راحتی یک کپی از یک شی یا آرایه ایجاد کنیم.

5️⃣ وقتی می خواهیم اشیاء یا آرایه ها را ادغام کنیم: می توانیم از عملگر spread برای ترکیب چندین شی یا آرایه در یکی استفاده کنیم.

⭐ چرا باید استفاده کرد

1️⃣ هنگام برخورد با داده های ذخیره شده در اشیاء و آرایه ها، نحو را ساده می کند.

2️⃣ تخریب، مقدار کد مورد نیاز برای استخراج داده ها از اشیا و آرایه ها را کاهش می دهد.

3️⃣ عملگر Spread به خوانایی و نگهداری بیشتر کد ما کمک می کند.

4️⃣ عملگر Spread یک نحو ساده برای ترکیب و کپی ساختارهای داده ارائه می دهد.

5️⃣ عملگر Spread یک راه آسان برای گسترش عناصر در اشیاء تکرارپذیر ارائه می دهد.