آرایه گردی در جاوااسکریپت!

تو این مقاله سعی می کنم راه های پیمایش در آرایه ها رو از روش های کلاسیک تا سوسول بازی های نسل جدید (ES6) شرح بدم. ?

روش 1: حلقه های کلاسیک، ولی دوست داشتنی! ?

استفاده از حلقه while / for

این روش از قدیمی ترین روش هاست و اجازه پیمایش در تمام خانه های آرایه رو به ما میده. به قول معروف: " Old but Gold " ?

let i = 0; // index
const array = [1, 2, 3];
while (i < array.length) {
console.log(array[i]);
i++;
}

حلقه for (کلاسیک ترین راه ممکن و فکر میکنم پر استفاده ترین!) ?

const array = [1, 2, 3];
for (let i = 0; i < array.length; i++) {
  console.log(array[i]);
}

روش 2: یه دوری بزنیم! (Array.prototype.forEach)

این متد در ES6 به صورت رسمی معرفی شد و مثل روش های بالا از الگوریتم حلقه برای پیمایش استفاده می کنه (ولی در نظر داشته باشید که ES6 هست!)

برای دیدن Polyfill, Specifications و هر چیزی که مربوط به این متد هست میتونید به صفحه این متد در MDN مراجعه کنید.

const array = [1, 2, 3];

array.forEach(function(current_value, index, array) {
  console.log(`At index ${index} in array ${array} the value is ${current_value}`);
}); // undefiend

مشکلی که ممکنه در کار با این متد بهش برخورد کنید اینه که بعد از استفاده دیگه چیزی رو return نمیکنه و به همین دلیل دیگه نمیشه در ادامه دوباره از آرایه استفاده کرد.

برای حل این مشکل یه سر به روش بعدی بزنید. ?

روش 3: استفاده از نقشه! (Array.prototype.map)

روش قبلی، خوب و منطقی بود، ولی در یک سری استفاده خاص ممکنه جواب نده. ❌

این متد هم در ES6 متولد شده و کارش اینه که یک تابع رو روی تک تک اعضای یک آرایه اجرا (اعمال) کنه.

ساختار متد map به این شکله:

 array.prototype.map(current_value, index, array) 

در مثال زیر ما تابع func که یک تابع Arrow Anonymous هست رو با استفاده از map به آرایه array نسبت دادیم و میتونیم در یک متغیر جدید نتایج مورد نظرمون رو دریافت کنیم. ?

// example from MDN
var array = [1, 4, 9, 16];
// pass a function to map
const func = x => x * 2;
const map = array.map(func);
console.log(map);
// expected output: Array [2, 8, 18, 32]

روش 4: کَمِش کن! ? (Array.prototype.reduce)

این متد یک تابع رو بر یک نگه دارنده (Accumulator) و تک تک خانه های آرایه از چپ به راست اعمال می کنه تا به یک مقدار برسه! (Accumulator رو توی Google Translate ترجمه نکنید ? به واژه انباشتگر می رسید!)

? بهتره یه مثال بزنم:

const array = [1, 2, 3];
const sum = (x, y) => x + y;
const array_sum = array.reduce(sum, 0);
console.log(`The sum of array: ${array} is ${array_sum}`);
// expected output:  The sum of array: 1,2,3 is 6 

? روش 5: فیلتِرِش کُن! نه از اون فیلترا! (Array.prototype.filter)

خیلی ساده! یه شرط بده بهش؛ هر کدوم از خونه ها با شرط جور در اومد میاد بیرون... ?

const array = [1, 2, 3, 4];
const even = x => x % 2 === 0;
const even_array = array.filter(even);
console.log(`Even numbers in array ${array}: ${even_array}`);
// expected output:  Even numbers in array 1,2,3,4: 2,4

روش 6: ببین همشون تو یه شرط مُشترِکَن؟ (Array.prototype.every)

کاری که میکنه رو تو عنوان spoil کردم! ?

فقط مواظب باشید این متد رو روی آرایه خالی استفاده نکنید که تو هر شرایطی true برمیگردونه!

// example from MDN
function isBelowThreshold(currentValue) {
  return currentValue < 40;
}
var array1 = [1, 30, 39, 29, 10, 13];
console.log(array1.every(isBelowThreshold));
// expected output: true

روش 7: حداقل یکیشون که این شرطو دارن؟! نَه؟؟ (Array.prototype.some)

این متد هم مثل بالایی با آرایه های خالی مشکل داره. هر شرطی بدید false بر میگرده!

const array = [1, 2, 3, 9, 5, 6, 4];
const over_seven = x => x > 7;
if (array.some(over_seven)) {
  console.log('At least one element bigger than 7 was found'); // 9
} else console.log('No element bigger than 7 was found');

مرسی که تا آخر این مقاله همراهم بودید. (ایشالا تو شادیاتون جبران کنم! ?)

اگر خوشتون اومد لایک رو که میزنید قطعاً ?؛ ولی اگر واقعاً خوشتون اومد برای دوستاتون، همکاراتون یا هر بنده خدای دیگه ای که میشناسید (در صورتی که به جاوااسکریپت آلرژی نداشته باشه) به اشتراک بزارید... ? ?