متدها و خواص آرایه ها - بخش دوم
متدهای slice و splice
با استفاده از متد slice میتوان بخشی از یک آرایه را استخراج کرد. این متد دو ورودی دریافت میکند. ورودی اول اندیس محل شروع و ورودی دوم اندیس محل پایان را مشخص میکند. به قطعه کد زیر توجه کنید.
let fruits = ['Apple' , 'Orange' , 'Banana' , 'Berry'];
let a = fruits.slice(1 , 3);
a;
← ["Orange" , "Banana"]
توجه کنید که متد slice هیچ تغییری در آرایهی اولیه (fruits) ایجاد نمیکند. بلکه یک آرایهی جدید با توجه به ورودیهای مشخص شده بازمیگرداند. همچنین دقت کنید که عنصری که اندیس ۳ دارد (یعنی 'Berry') انتخاب نشده است. یعنی استخراج عناصر از اندیس ۱ شروع شده و تا اندیس ۳ ادامه پیدا کرده است. ولی عنصری که اندیس ۳ دارد انتخاب و استخراج نمیشود. همچنین در صورت حذف ورودی دوم و ارسال تنها یک ورودی، از اندیس مشخص شده در ورودی اول تا پایان آرایه انتخاب میشود.
با استفاده از متد splice نیز میتوانیم تعدادی از عناصر یک آرایه را حذف کنیم. پیش از این دیدیم که با استفاده از عملگر delete میتوان عناصر آرایه را حذف کرد. اما این عملگر عناصر را به طور کامل از آرایه حذف نمیکرد و فقط مقدار آن عنصر را برابر با undefined قرار میداد. اما متد splice میتواند برخی عناصر آرایه را به طور کامل حذف کند.
ابتدا حالت سادهی این متد را در نظر میگیریم. در این حالت دو ورودی عددی را باید برای این متد مشخص کنیم. ورودی اول محل شروع و ورودی دوم تعداد عناصری که باید حذف شوند را مشخص میکند. به قطعه کد زیر توجه کنید.
let fruits = ['Apple' , 'Orange' , 'Banana' , 'Berry'];
let a = fruits.splice(1 , 2);
fruits;
← ["Apple" , "Berry"]
a;
← ["Orange" , "Banana"]
در مثال فوق، تعداد ۲ عنصر از آرایهی fruits با شروع از اندیس ۱ حذف میشوند. توجه کنید که این متد بر خلاف متد slice، آرایهی اولیه را تغییر میدهد. به همین دلیل میتوان دید که پس از اجرای این متد، تعداد عناصر آرایهی fruits به ۲ کاهش یافته و ۲ مورد از عناصر آن حذف شدهاند. همچنین توجه کنید که این متد عناصر حذف شده از آرایه را به صورت یک آرایهی جدید برمیگرداند که در صورت نیاز میتوان آن را در یک متغیر ذخیره کرد. در مثال فوق عناصر حذف شده در متغیر a ذخیره شدهاند که در انتهای مثال فوق، آرایهی ذخیره شده در این متغیر را مشاهده میکنید.
متد splice را میتوان برای درج عناصر جدید در یک آرایه نیز به کار برد. برای این کار باید عناصر جدید را پس از دو ورودی اول، به تعداد دلخواه به عنوان ورودی به این متد ارسال کنیم. در این صورت عناصر جدید با شروع از مکانی که در ورودی اول این متد مشخص شده است در آرایه درج میشوند. به قطعه کد زیر توجه کنید.
let fruits = ['Apple' , 'Orange' , 'Banana' , 'Berry'];
let a = fruits.splice(1 , 2 , 'Cherry' , 'Lemon');
fruits;
← ["Apple" , "Cherry" , "Lemon" , "Berry"]
a;
← ["Orange" , "Banana"]
در مثال فوق دو مقدار جدید 'Cherry' و 'Lemon' با شروع از اندیس ۱ در این آرایه درج میشوند. همچنین با توجه به اینکه مقدار ورودی دوم این متد را برابر با ۲ قرار دادهایم. تعداد ۲ عنصر نیز با شروع از اندیس ۱ از این آرایه حذف میشوند و در متغیر a ذخیره میشوند.
در صورتی که هدفمان فقط درج عناصر جدید باشد و نخواهیم که عناصر موجود در آرایه را حذف کنیم. باید مقدار ورودی دوم این متد را برابر با صفر قرار دهیم. در این صورت مقدار بازگشتی از این متد یک آرایهی تهی است.
متد reverse
با استفاده از متد reverse میتوان ترتیب عناصر یک آرایه را معکوس کرد. به قطعه کد زیر توجه کنید.
let fruits = ['Apple' , 'Orange' , 'Banana' , 'Berry'];
let a = fruits.reverse();
fruits;
← ["Berry", "Banana", "Orange", "Apple"]
a;
← ["Berry", "Banana", "Orange", "Apple"]
توجه کنید که این متد ترتیب عناصر را در آرایهی اولیه تغییر میدهد. همچنین مقدار بازگشتی از این متد نیز یک اشارهگر به همان آرایه است. در نتیجه در مثال فوق میبینید که مقدار متغیرهای a و fruits کاملاً یکسان است.
متد sort
با استفاده از متد sort میتوان عناصر یک آرایه را مرتب کرد. به قطعه کد زیر توجه کنید.
let fruits = ['Apple' , 'Orange' , 'Banana' , 'Berry'];
let a = fruits.sort();
fruits;
← ["Apple", "Banana", "Berry", "Orange"]
a;
← ["Apple", "Banana", "Berry", "Orange"]
این متد نیز مانند متد reverse ترتیب عناصر آرایهی اولیه را تغییر میدهد. همچنین دقیقاً مانند متد reverse مقدار بازگشتی این متد نیز یک اشارهگر به همان آرایه است. در نتیجه در کد فوق، میبینید که مقدار متغیرهای a و fruits یکسان است.
این متد در حالت پیشفرض مرتبسازی را بر مبنای حروف الفبا انجام میدهد. یعنی اگر شما آرایهای با دادههای عددی را با این متد مرتبسازی کنید. این دادهها به صورت رشتهای با هم مقایسه میشوند. در نتیجه به عنوان مثال مقدار ۵ از مقدار ۲۳ بزرگتر خواهد بود. به قطعه کد زیر توجه کنید.
let numbers = [5 , 9 , 15 , 23];
numbers.sort();
← [15 , 23 , 5 , 9]
همانطور که مشاهده میکنید، ترتیب عناصر آرایه بعد از مرتبسازی مطابق انتظار ما نیست. زیرا این اعداد به صورت رشته در نظر گرفته میشوند و ارزش عددی آنها مهم نیست و به صورت الفبایی مرتب میشوند. این مشکل را میتوان با استفاده از توابعی موسوم به Callback حل کرد و میتوان نحوهی مرتبسازی این متد را به شکل دلخواه و مطابق با منطق دلخواه تغییر داد. اما با توجه به اینکه فعلاً با توابع در جاوا اسکریپت آشنا نشدهایم، این موضوع را به فصل بعد موکول میکنیم.
متدهای indexOf و includes
با متدهای indexOf و includes پیش از این نیز آشنا شدهایم. در فصل قبلی دیدیم که با استفاده از متد indexOf میتوان موقعیت یک کاراکتر (یا زیر رشته) را در یک رشته پیدا کرد. همچنین دیدیم که با متد includes میتوان بررسی کرد که آیا یک کاراکتر خاص (یا زیر رشتهی خاص) در یک رشته وجود دارد یا خیر؟
این متدها را به شکل نسبتاً مشابهی میتوان در مورد آرایهها نیز به کار برد. با استفاده از متد indexOf میتوان موقعیت (اندیس) یک عنصر خاص را در یک آرایه (در صورت وجود) به دست آورد. به قطعه کد زیر توجه کنید.
let fruits = ['Apple' , 'Orange' , 'Banana' , 'Berry'];
fruits.indexOf('Orange');
← 1
fruits.indexOf('Lemon');
← -1
fruits.indexOf(331);
← -1
همانطور که مشاهده میکنید این متد در صورت یافتن عنصر مورد نظر اندیس آن عنصر، و در غیر این صورت مقدار 1- را برمیگرداند.
با استفاده از متد includes نیز میتوان بررسی کرد که آیا یک مقدار خاص در عناصر یک آرایه وجود دارد یا خیر؟
let fruits = ['Apple' , 'Orange' , 'Banana' , 'Berry'];
fruits.includes('Orange');
← true
fruits.includes('Lemon');
← false
همچنین در هر دو متد indexOf و includes میتوان یک عدد را به عنوان ورودی دوم مشخص کرد تا جستجو از آن محل شروع شود.
آرایههای چند بُعدی
همانطور که پیشتر اشاره شد، عناصر یک آرایه میتوانند از هر نوع دادهای باشند. در نتیجه میتوان آرایههایی تعریف کرد که عناصر آن خود آرایه باشند. به آرایههایی که آرایههای دیگری را به عنوان عناصر خود نگهداری میکنند آرایههای چند بُعدی گفته میشود. برای دسترسی به عناصر آرایههای داخلی باید از چند اندیس استفاده کرد. به قطعه کد زیر توجه کنید.
let coordinates = [ [10 , 30] , [40 , 20] ];
coordinates[0][0];
← 10
coordinates[0][1];
← 30
coordinates[1][0];
← 40
در مثال فوق با توجه به اینکه آرایهی coordinates دو بعدی است، برای دسترسی به عناصر باید از ۲ اندیس استفاده کرد. اما اگر آرایههای داخلی خود شامل آرایههای دیگری باشند، به همان اندازه باید از اندیسهای بیشتر استفاده کرد. در جاوا اسکریپت محدودیتی برای تعداد بُعدهای یک آرایه وجود ندارد. اما در عمل از آرایههای با بیش از ۲ بعد به ندرت استفاده میشود.