با روش صحیح، مهارت خود در آرایه های JS را تقویت کنید

foreach

چه موقع باید استفاده کرد؟

شما نیازی به استفاده بیش از حد از forEach ندارید . در برخی موارد forEach روش بسیار خوبی است.

اگر برای انجام یک عمل خاص نیاز به تکرار یک آرایه دارید (مثلاً ثبت هر مورد از کنسول).

شما نباید هر بار که نیاز به پر کردن یک آرایه جدید دارید از forEach استفاده کنید (قبل از انجام این کار، بررسی کنید که آیا می توانید از روش های دیگری استفاده کنید)

const items = [1, 2, 3, 4, 5]

items.forEach(item => console.log(item))

forEach هیچ مقداری را بر نمی گرداند!!

// 
// ...
const toto = items.forEach(item => console.log(item))
toto // undefined

filter

چه موقع باید استفاده کرد؟

همانطور که نامش ذکر شد، به ما اجازه می دهد تا مقداری را در آرایه بسته به شرایط فیلتر کنیم.

مثال

به عنوان مثال اگر می خواهید اعداد فرد را حذف کنید

با forEach

const items = [1, 2, 3, 4]
const evenValue = []
items.forEach(item => {
   if (item % 2 == 0) {
      evenValue.push(item)
   }
})

با filter

const items = [1, 2, 3, 4]

const evenValue = items.filter(currentValue => {
   return currentValue % 2 == 0
})

هنگامی که از filter استفاده می کنید، باید در هر تکرار یک Boolean (شرایط فیلتر) برگردانید . (در غیر این صورت JS Engine مقدار برگشتی را به بولین تبدیل می کند!)

map

چه موقع باید استفاده کرد؟

زمانی که نیاز دارید آیتم ها را از آرایه به آرایه دیگر تبدیل کنید!

مثال

به عنوان مثال اگر می خواهید تمام مقادیر یک آرایه را در 2 ضرب کنید.

با forEach

const items = [1, 2, 3, 4]
const result = []
items.forEach(item => {
   result.push(item * 2)
})

با map

const items = [1, 2, 3, 4]
const result = items.map(item => {
   return item * 2
})

هنگامی که از map استفاده می کنید، باید در هر تکرار یک آیتم (مورد تبدیل شده) را برگردانید .

reduce

چه موقع باید استفاده کرد؟

زمانی که باید یک مقدار واحد را از یک آرایه دریافت کنید. این “مقدار واحد” می تواند یک آرایه باشد.

مثال

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

با forEach

const items = [1, 2, 3, 4]
const result = 0
items.forEach(item => {
   accumulator += item
})

با reduce

const items = [1, 2, 3, 4]

const sum = items.reduce((accumulator, currentValue) => {
   return accumulator += currentValue
}, 0)

هنگامی که از reduce استفاده می کنید باید در هر تکرار اککومولاتور (مقداری که با روش افزایش برگردانده می شود) را برگردانید و همچنین باید این جمع کننده را مقدار دهی اولیه کنید، در مثال بالا ما متغیر را با 0 مقداردهی کرده ایم!

find

چه موقع باید استفاده کرد؟

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

const items = [1, 2, 3, 4]

const item = items.find(item => item === 3)

// ...

// Use item afterwards

some

چه موقع باید استفاده کرد؟

اگر باید بررسی کنید که آیا یکی از موارد شما با شرایطی مطابقت دارد یا خیر (مانند find) اما نیازی نیست بعد از آن از آن مورد استفاده کنید.

مثال

به عنوان مثال اگر می خواهید بررسی کنید که آیا آرایه شما عدد 2 را دارد یا خیر.

با find

const items = [1, 2, 3, 4]
const item = items.find(item => item === 2)
if (item !== undefined) {
   // ...
}

با some

const items = [1, 2, 3, 4]
const hasNumber2 = items.some(item => item === 2)
if (hasNumber2) {
   ...
}

someاگر حداقل یک مورد با شرایط شما مطابقت داشت، Boolean را برگردانید

every

چه موقع باید استفاده کرد؟

everyمشابه some است، بررسی می کند که آیا همه موارد شما با شرایط شما مطابقت دارند یا خیر . به جای some، اگر فقط یک مورد با شرط مطابقت داشته باشد، true برمی‌گردد، every فقط در صورتی که همه موارد با شرط مطابقت داشته باشند، true برمی‌گرداند!

TLDR;

همانطور که می بینید، بسته به زمینه می توانید از روش های آرایه زیادی استفاده کنید.

همچنین برای توسعه‌دهندگان دیگری که کد شما را می‌خوانند، نکته خوبی است (به عنوان مثال اگر فیلتر را ببینم، می‌دانم که باید مقداری از این آرایه را فیلتر کنیم)

یک نکته خوب که در بالا نشان ندادم، این است که می توانید متدهای آرایه را ترکیب کنید (به جز forEach چون مقداری را بر نمی گرداند).

پس میتونی اینو درست کنی

شما باید مقدار فرد را از آرایه فیلتر کنید و عدد رویداد را در 2 ضرب کنید.

const items = [1, 2, 3, 4]

const result = items.filter(item => item % 2 == 0 ).map(item => item * 2)

امیدوارم مفید بوده باشه!