پرکاربرد ترین متدهای آرایه در جاوا اسکریپت

جاوا اسکریپت چیست ؟

جاوااسکریپت (JavaScript) که به JS نیز معروف می باشد ، از زبان های برنامه نویسی شی گرا ، محبوب و سطح بالا است که در سمت فرانت (به همراه HTML و CSS ) و بک اند (با استفاده از node js) سایت ها مورد استفاده قرار می گیرد.

تعریف آرایه :

آرایه ها در جاوا اسکریپت نوعی متغییر می باشند که می توانند بیش از یک مقدار را در خود نگهداری کنند و باتوجه شماره ایندکس هر کدام از ایتم ها در آرایه می توان به مقدار آن دسترسی پیدا کرد.

چگونه می توان یک آرایه در جاوا اسکریپت ساخت؟

دو روش برای ساخته آرایه وجود دارد که باهم بررسی می کنیم :

let myArray = new Array();
let myArray = [];
let myArray = ['mohammad', 'ali'];

همانطور که در قطعه کد بالا مشاهده میکنید شما می توانید از کلمه کلیدی new Array استفاده کرده و یا با استفاده از [ ] آرایه خود را ایجاد کنید ، در اکثر موارد برنامه نویسان به دلیل راحتی و سرعت بیشتر در کد نویسی از روش دوم استفاده می کنند

متد ها در جاوا اسکریپت

متد ()map :

برای کار با این متد شما باید یک تابع در متد map قرار دهید تا تک تک مقادیر آرایه را به اصطلاح گرفته و تغییرات لازم را روی آن ها انجام دهد برای مثال در کد زیر هر کدوم از ارایه ها را در عدد 2 ضرب کردیم و با استفاده از مقادیر بدست آمده یک آرایه جدید ایجاد می کنیم.

const myArray = [1, 2, 3, 4];

const myMap = myArray.map(x => x * 2);

console.log(myMap);

متد ()concat :

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

const myArray1 = ['a', 'b', 'c'];
const myArray2 = ['d', 'e', 'f'];
const myArray3 = myArray1.concat(myArray2);

console.log(myArray3);

متد ()every :

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

const condition = (currentValue) => currentValue < 50;

const myArray = [1, 25, 10, 12, 22, 17];

console.log(myArray.every(condition));

در مثال بالا شرط ما مقدار currentValue < 50 است و شرط را بر روی آرایه خود (myArray) پیاده سازی کرده ایم که می توانید نتیجه آن را در کنسول مشاهده کنید.

متد fill(value, start, end)

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

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

const myArray= [2, 4, 5, 6];

console.log(myArray.fill(0, 2, 4));

console.log(myArray.fill(5, 1));

console.log(array1.fill(6));

متد ()filter :

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

const words = ['mohammad', 'ali', 'hosein', 'erfan', 'zahra', 'bahram'];

const result = words.filter(word => word.length > 6);

console.log(result);

متد ()find :

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

const myArray = [21, 3, 2, 1, 15];

const found = myArray.find(element => element > 10);

console.log(found);

متد ()findIndex :

در متد find شما با قرار دادن شرط می توانستید به مقداری از آرایه که با شرط ما برقرار بود را دسترسی داشته باشید ، در صورتی که شما نیاز به ایندکس عنصر جستجو شده داشته باشید میتوانید از متد findIndex استفاده کنید.

const array1 = [21, 3, 2, 1, 15];

const isLargeNumber = (element) => element > 13;

console.log(array1.findIndex(isLargeNumber));

این متد مانند متد find است باین تفاوت که ایندکس عنصر پیداشده را برمیگرداند و درصورتی که هیچ عنصری پیدانکرد مقدار 1- را برای ما برمیگرداند.

متد ()indexOf :

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

const beasts = ['mohamamd', 'ali', 'hosein', 'bahram', 'erfan'];

console.log(beasts.indexOf('mohamamd'));

console.log(beasts.indexOf('mohamamd', 2));

console.log(beasts.indexOf('ali'));

متد ()includes :

متد includes به ما این قابلیت را می دهد که داخل آرایه یک مقدار را جستجو کنیم و درصورتی که مقدار جستجو شده داخل آرایه موجود باشد مقدار true و در غیر این صورت مقدار false برگردانده می شود.

const myArray = [2, 3, 1];

console.log(myArray.includes(2));

const names = ['mohammad', 'ali', 'hosein'];

console.log(names.includes('mohammad'));

console.log(names.includes('maryam'));

متد ()shift :

برای حذف یک عنصر از ابتدای آرایه می توانید از متد shift استفاده کنید که با فراخوانی این متد طول آرایه جدید برای ما برگردانده می شود ، مانند مثال زیر :

const myArray = [22, 12, 1];

const shiftArray = myArray.shift();

console.log(myArray);

console.log(shiftArray);

متد ()Unshift :

برخلاف متد shift با استفاده از متد Unshift می توانید یک عنصر را به ابتدای آرایه اضافه کنید و طول آرایه جدید را دریافت کنید.

const myArray = [12, 22, 6];

console.log(myArray.unshift(4, 5));

متد ()slice :

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

const names = ['mohammad', 'ali', 'zahra', 'hesam', 'maryam'];

console.log(names.slice(3));

console.log(names.slice(1, 3));

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

متد ()sort :

برای اینکه بتوانیم عنصر های یک آرایه را مرتب سازی کنیم از sort استفاده می کنیم که به صورت پیشفرض به صورت صعودی این مرتب سازی انجام می شود و آرایه مرتب سازی شده برای ما برگردانده می شود.

برای مرتب سازی عنصر های یک آرایه همچنین می توانیم از یک متد داخل sort هم استفاده کنیم و به صورت دلخواه مرتب سازی را انجام دهیم.

const names = ['mohammad', 'ali', 'hosein', 'bahram'];
months.sort();
console.log(names);

const myArray = [21, 22, 4, 1, 3000];
array1.sort();
console.log(myArray);

متد ()forEach :

این متد یک تابع را دریافت می کند و روی همه ی عناصر آرایه این تابع را اجرا می کند در مثال زیر می توانید عملکرد این تابع را ببینید.

arr.forEach(function(item, index, array) {
  // ... do something with item
});

["mohammad", "ali", "iran"].forEach((item, index, array) => {
  alert(`${item} is at index ${index} in ${array}`);
});

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