آرایهها (Arrays) یکی از ساختارهای دادهای مهم در جاوا اسکریپت هستند که به ما امکان ذخیره و مدیریت مجموعهای از دادهها را به صورت منظم و ساختار یافته میدهند. این مقاله به شما نحوهی ایجاد، دسترسی، و اصلاح آرایهها را در جاوا اسکریپت آموزش میدهد.
آرایهها ساختارهای دادهای هستند که میتوانند مقادیر متعددی را در یک متغیر ذخیره کنند. این مقادیر که به آنها عناصر (Elements) میگوییم، میتوانند از هر نوع دادهای باشند، از جمله اعداد، رشتهها، اشیاء و حتی توابع.
ایجاد آرایهها
آرایهها در جاوا اسکریپت را میتوان به دو روش اصلی ایجاد کرد:
const fruits = ['apple', 'banana', 'cherry'];
const fruits = new Array('apple', 'banana', 'cherry');
در اکثر موارد، استفاده از براکتهای مربع روشی مرسومتر و متداولتر است.
عناصر یک آرایه به وسیله اندیس (Index) قابل دسترسی هستند. اندیسها در جاوا اسکریپت از صفر شروع میشوند، به این معنی که اولین عنصر آرایه اندیس 0 دارد، دومین عنصر اندیس 1، و به همین ترتیب ادامه مییابد.
دسترسی به عناصر با استفاده از اندیسها
const fruits = ['apple', 'banana', 'cherry'];
console.log(fruits[0]); // Output: apple
console.log(fruits[2]); // Output: cherry
برای تغییر مقدار یک عنصر در آرایه، میتوانید از اندیس آن استفاده کنید:
const fruits = ['apple', 'banana', 'cherry'];
fruits[1] = 'blueberry';
console.log(fruits); // Output: ['apple', 'blueberry', 'cherry']
جاوا اسکریپت مجموعهای از متدهای داخلی را فراهم میکند که به شما اجازه میدهند تا به راحتی آرایهها را اصلاح و مدیریت کنید.
این متد یک یا چند عنصر را به انتهای آرایه اضافه میکند و طول جدید آرایه را برمیگرداند.
const fruits = ['apple', 'banana'];
fruits.push('cherry');
console.log(fruits); // Output: ['apple', 'banana', 'cherry']
این متد آخرین عنصر را از آرایه حذف میکند و آن عنصر را برمیگرداند.
const fruits = ['apple', 'banana', 'cherry'];
const lastFruit = fruits.pop();
console.log(lastFruit); // Output: cherry
console.log(fruits); // Output: ['apple', 'banana']
این متد یک یا چند عنصر را به ابتدای آرایه اضافه میکند و طول جدید آرایه را برمیگرداند.
const fruits = ['banana', 'cherry'];
fruits.unshift('apple');
console.log(fruits); // Output: ['apple', 'banana', 'cherry']
این متد اولین عنصر را از آرایه حذف میکند و آن عنصر را برمیگرداند.
const fruits = ['apple', 'banana', 'cherry'];
const firstFruit = fruits.shift();
console.log(firstFruit); // Output: apple
console.log(fruits); // Output: ['banana', 'cherry']
این متد میتواند برای اضافه کردن یا حذف عناصر از هر نقطهای در آرایه استفاده شود.
نحوه استفاده از splice():
const fruits = ['apple', 'banana', 'cherry', 'date'];
// حذف دو عنصر از اندیس 1 و اضافه کردن 'blueberry'
fruits.splice(1, 2, 'blueberry');
console.log(fruits); // Output: ['apple', 'blueberry', 'date']
در این مثال، splice() دو عنصر را از اندیس 1 حذف میکند (banana و cherry) و عنصر 'blueberry' را اضافه میکند.
این متد یک زیرمجموعه از آرایه اصلی بر اساس اندیسهای مشخص شده برمیگرداند.
نحوه استفاده از slice():
const fruits = ['apple', 'banana', 'cherry', 'date'];
const citrus = fruits.slice(1, 3);
console.log(citrus); // Output: ['banana', 'cherry']
در این مثال، slice() عناصر از اندیس 1 تا (3-1) را برمیگرداند.
پیمایش آرایهها به معنای اجرای یک تابع یا عملیات برای هر عنصر آرایه است.
const fruits = ['apple', 'banana', 'cherry'];
for (let i = 0; i < fruits.length; i++) {
console.log(fruits[i]);
}
// Output:
// apple
// banana
// cherry
forEach() یک تابع را برای هر عنصر آرایه اجرا میکند.
const fruits = ['apple', 'banana', 'cherry'];
fruits.forEach(fruit => console.log(fruit));
// Output:
// apple
// banana
// cherry
این متد یک تابع را برای هر عنصر آرایه اجرا میکند و یک آرایه جدید با نتایج برمیگرداند.
const numbers = [1, 2, 3, 4];
const doubled = numbers.map(number => number * 2);
console.log(doubled); // Output: [2, 4, 6, 8]
این متد آرایهای از عناصری را که با شرط خاصی مطابقت دارند، برمیگرداند.
const numbers = [1, 2, 3, 4, 5];
const evenNumbers = numbers.filter(number => number % 2 === 0);
console.log(evenNumbers); // Output: [2, 4]
این متد برای کاهش (تجمیع) آرایه به یک مقدار واحد استفاده میشود.
const numbers = [1, 2, 3, 4];
const sum = numbers.reduce((total, number) => total + number, 0);
console.log(sum); // Output: 10
آرایهها یکی از مهمترین و پرکاربردترین ساختارهای دادهای در جاوا اسکریپت هستند که ابزارهای قدرتمندی برای ذخیره، دسترسی و اصلاح دادهها فراهم میکنند. با یادگیری و تمرین متدهای مختلف آرایهها، میتوانید به راحتی دادهها را مدیریت کرده و کدهای کارآمد و قابل نگهداریتری بنویسید. از متدهای مختلف آرایهها استفاده کنید تا به بهترین شکل ممکن با دادههای خود کار کنید.
نظری یافت نشد
آموزش تغییر المانهای DOM: ویرایش متن، سبکها و کلاسها در جاوا اسکریپت - راهنمای کامل با مثالها
2م آبان 1403
مطالعه بیشتر
استفاده از setTimeout و setInterval در جاوا اسکریپت: آموزش کامل و مثالها
29م مهر 1403
مطالعه بیشتر
آموزش کار با Local Storage و Session Storage در جاوا اسکریپت: ذخیرهسازی دادهها در مرورگر
3م آبان 1403
مطالعه بیشتر
آموزش ساخت یک برنامه ساده با Fetch API در جاوا اسکریپت: راهنمای گام به گام
1م آبان 1403
مطالعه بیشتر
آموزش استفاده از object-fit و object-position در CSS: تنظیم و قرارگیری تصاویر بهصورت دقیق
12م آبان 1403
مطالعه بیشتر
آموزش قالببندی متن در HTML: استفاده از تگها و CSS برای استایلدهی
23م مرداد 1402
مطالعه بیشتر
استفاده از font face در CSS برای اضافه کردن فونتهای سفارشی: راهنمای کامل
16م آبان 1403
مطالعه بیشتر
آموزش کامل توابع سازنده (Constructors) و پروتوتایپها (Prototypes) در جاوا اسکریپت: راهنمای جامع
28م مهر 1403
مطالعه بیشتر
الگوهای رایج برنامهنویسی ناهمگام در جاوا اسکریپت: Promise.race، Promise.all، و Promise.any کامل و مثالها
1م آبان 1403
مطالعه بیشتر
Async/Await: نوشتن کدهای خواناتر و ناهمزمان در جاوا اسکریپت - آموزش کامل با مثالها
30م مهر 1403
مطالعه بیشتر
آموزش CSS Blend Modes: ادغام رنگها و تصاویر برای طراحی وب جذاب
9م آبان 1403
مطالعه بیشتر
آموزش ساخت یک گالری تصویر با استفاده از جاوا اسکریپت: راهنمای گام به گام
3م آبان 1403
مطالعه بیشتر
تمامی حقوق معتلق به ناشر سایت است و کپی از آن پیگرد قانونی دارد