تسلط بر اپراتورهای Spread و Rest در جاوا اسکریپت

Summarize this content to 400 words in Persian Lang

Spread and Rest Operators در جاوا اسکریپت

این گسترش و استراحت عملگرها که هر دو با سه نقطه نمایش داده می شوند (…)، ویژگی های همه کاره در جاوا اسکریپت هستند که در ES6 معرفی شده اند. اگرچه نحو یکسانی دارند، اما اهداف مشخصی را دنبال می کنند: اپراتور گسترش برای گسترش عناصر استفاده می شود، در حالی که اپراتور استراحت برای جمع آوری عناصر استفاده می شود.

1. اپراتور گسترش

عملگر spread برای گسترش عناصر یک آرایه، شی یا قابل تکرار به عناصر جداگانه استفاده می شود.

الف. گسترش در آرایه ها

عملگر spread را می توان برای کپی، الحاق یا انتقال عناصر آرایه استفاده کرد.

مثال: کپی کردن آرایه ها

const arr1 = [1, 2, 3];
const arr2 = […arr1]; // Creates a copy of arr1
console.log(arr2); // Output: [1, 2, 3]

وارد حالت تمام صفحه شوید

از حالت تمام صفحه خارج شوید

مثال: آرایه های پیوسته

const arr1 = [1, 2, 3];
const arr2 = [4, 5, 6];
const combined = […arr1, …arr2];
console.log(combined); // Output: [1, 2, 3, 4, 5, 6]

وارد حالت تمام صفحه شوید

از حالت تمام صفحه خارج شوید

مثال: انتقال عناصر به توابع

const numbers = [10, 20, 30];
console.log(Math.max(…numbers)); // Output: 30

وارد حالت تمام صفحه شوید

از حالت تمام صفحه خارج شوید

ب. گسترش در اشیاء

می توانید از عملگر spread برای کپی یا ادغام اشیا استفاده کنید.

مثال: کپی کردن اشیا

const obj1 = { a: 1, b: 2 };
const obj2 = { …obj1 };
console.log(obj2); // Output: { a: 1, b: 2 }

وارد حالت تمام صفحه شوید

از حالت تمام صفحه خارج شوید

مثال: ادغام اشیاء

const obj1 = { a: 1, b: 2 };
const obj2 = { b: 3, c: 4 };
const merged = { …obj1, …obj2 };
console.log(merged); // Output: { a: 1, b: 3, c: 4 }

وارد حالت تمام صفحه شوید

از حالت تمام صفحه خارج شوید

2. اپراتور استراحت

عملگر بقیه چندین عنصر را در یک آرایه یا شی جمع آوری می کند. معمولاً در پارامترهای تابع یا تخصیص تخریب ساختار استفاده می شود.

الف. استفاده از Rest in Function Parameters

عملگر بقیه می تواند تعداد نامحدودی آرگومان را در یک آرایه جمع آوری کند.

مثال: جمع آوری استدلال

function sum(…numbers) {
return numbers.reduce((total, num) => total + num, 0);
}
console.log(sum(1, 2, 3, 4)); // Output: 10

وارد حالت تمام صفحه شوید

از حالت تمام صفحه خارج شوید

ب. استفاده از حالت استراحت در ساختارشکنی آرایه ها

عملگر بقیه عناصر باقیمانده را در عملیات تخریب آرایه جمع آوری می کند.

مثال: تخریب آرایه

const [first, second, …rest] = [1, 2, 3, 4, 5];
console.log(first); // Output: 1
console.log(second); // Output: 2
console.log(rest); // Output: [3, 4, 5]

وارد حالت تمام صفحه شوید

از حالت تمام صفحه خارج شوید

ج. استفاده از حالت استراحت در تخریب اشیاء

عملگر بقیه خواص باقیمانده را در عملیات تخریب شی جمع آوری می کند.

مثال: تخریب شی

const person = { name: “Alice”, age: 25, country: “USA” };
const { name, …details } = person;
console.log(name); // Output: Alice
console.log(details); // Output: { age: 25, country: “USA” }

وارد حالت تمام صفحه شوید

از حالت تمام صفحه خارج شوید

3. تفاوت های کلیدی بین اپراتورهای Spread و Rest

جنبه
اپراتور گسترش
اپراتور استراحت

هدف
عناصر را به موارد جداگانه گسترش می دهد
موارد را در یک موجودیت واحد جمع آوری می کند

موارد استفاده
کپی کردن، ادغام، عبور عناصر
جمع آوری آرگومان های تابع، تخریب

انواع داده ها
آرایه ها، اشیا، تکرارپذیرها
آرایه ها، اشیاء

4. مثال های عملی

الف. تعویض عناصر آرایه

let a = 1, b = 2;
[a, b] = [b, a];
console.log(a, b); // Output: 2, 1

وارد حالت تمام صفحه شوید

از حالت تمام صفحه خارج شوید

ب. ترکیب استراحت با اسپرید

function multiply(multiplier, …numbers) {
return numbers.map(num => num * multiplier);
}
console.log(multiply(2, 1, 2, 3)); // Output: [2, 4, 6]

وارد حالت تمام صفحه شوید

از حالت تمام صفحه خارج شوید

5. خلاصه

اپراتور گسترش (…): آرایه ها، اشیاء یا تکرارپذیرها را به عناصر جداگانه گسترش می دهد.

اپراتور استراحت (…): چندین عنصر را در یک آرایه یا شی جمع آوری می کند.
هر دو عملگر کد جاوا اسکریپت را مختصرتر و منعطف تر می کنند، به خصوص هنگام کار با آرایه ها، اشیاء و پارامترهای تابع.

سلام، من Abhay Singh Kathayat هستم!من یک توسعه دهنده تمام پشته با تخصص در هر دو فن آوری جلو و عقب هستم. من با انواع زبان های برنامه نویسی و فریم ورک ها کار می کنم تا برنامه های کارآمد، مقیاس پذیر و کاربرپسند بسازم.با خیال راحت با ایمیل تجاری من تماس بگیرید: kaashshorts28@gmail.com.

const arr1 = [1, 2, 3];
const arr2 = [...arr1]; // Creates a copy of arr1
console.log(arr2); // Output: [1, 2, 3]

const arr1 = [1, 2, 3];
const arr2 = [4, 5, 6];
const combined = [...arr1, ...arr2];
console.log(combined); // Output: [1, 2, 3, 4, 5, 6]

const numbers = [10, 20, 30];
console.log(Math.max(...numbers)); // Output: 30

const obj1 = { a: 1, b: 2 };
const obj2 = { ...obj1 };
console.log(obj2); // Output: { a: 1, b: 2 }

const obj1 = { a: 1, b: 2 };
const obj2 = { b: 3, c: 4 };
const merged = { ...obj1, ...obj2 };
console.log(merged); // Output: { a: 1, b: 3, c: 4 }

function sum(...numbers) {
  return numbers.reduce((total, num) => total + num, 0);
}
console.log(sum(1, 2, 3, 4)); // Output: 10

const [first, second, ...rest] = [1, 2, 3, 4, 5];
console.log(first); // Output: 1
console.log(second); // Output: 2
console.log(rest); // Output: [3, 4, 5]

const person = { name: "Alice", age: 25, country: "USA" };
const { name, ...details } = person;
console.log(name); // Output: Alice
console.log(details); // Output: { age: 25, country: "USA" }

let a = 1, b = 2;
[a, b] = [b, a];
console.log(a, b); // Output: 2, 1

function multiply(multiplier, ...numbers) {
  return numbers.map(num => num * multiplier);
}
console.log(multiply(2, 1, 2, 3)); // Output: [2, 4, 6]