آموزش رایگان جاوا اسکریپت (JavaScript)

آموزش ایجاد، دسترسی و اصلاح آرایه‌ها در جاوا اسکریپت: راهنمای کامل

1403/07/04 17:11 محراب حسن زاده
آموزش ایجاد، دسترسی و اصلاح آرایه‌ها در جاوا اسکریپت: راهنمای کامل

آرایه‌ها (Arrays) یکی از ساختارهای داده‌ای مهم در جاوا اسکریپت هستند که به ما امکان ذخیره و مدیریت مجموعه‌ای از داده‌ها را به صورت منظم و ساختار یافته می‌دهند. این مقاله به شما نحوه‌ی ایجاد، دسترسی، و اصلاح آرایه‌ها را در جاوا اسکریپت آموزش می‌دهد.

 

تعریف آرایه‌ها در جاوا اسکریپت

آرایه‌ها ساختارهای داده‌ای هستند که می‌توانند مقادیر متعددی را در یک متغیر ذخیره کنند. این مقادیر که به آن‌ها عناصر (Elements) می‌گوییم، می‌توانند از هر نوع داده‌ای باشند، از جمله اعداد، رشته‌ها، اشیاء و حتی توابع.

 

ایجاد آرایه‌ها

آرایه‌ها در جاوا اسکریپت را می‌توان به دو روش اصلی ایجاد کرد:

استفاده از براکت‌های مربع []


const fruits = ['apple', 'banana', 'cherry'];

 

استفاده از سازنده Array


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']

 

متدهای متداول برای اصلاح آرایه‌ها

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

push()

این متد یک یا چند عنصر را به انتهای آرایه اضافه می‌کند و طول جدید آرایه را برمی‌گرداند.


const fruits = ['apple', 'banana'];
fruits.push('cherry');
console.log(fruits); // Output: ['apple', 'banana', 'cherry']

 

pop()

این متد آخرین عنصر را از آرایه حذف می‌کند و آن عنصر را برمی‌گرداند.


const fruits = ['apple', 'banana', 'cherry'];
const lastFruit = fruits.pop();
console.log(lastFruit); // Output: cherry
console.log(fruits); // Output: ['apple', 'banana']

 

unshift()

این متد یک یا چند عنصر را به ابتدای آرایه اضافه می‌کند و طول جدید آرایه را برمی‌گرداند.


const fruits = ['banana', 'cherry'];
fruits.unshift('apple');
console.log(fruits); // Output: ['apple', 'banana', 'cherry']

 

shift()

این متد اولین عنصر را از آرایه حذف می‌کند و آن عنصر را برمی‌گرداند.


const fruits = ['apple', 'banana', 'cherry'];
const firstFruit = fruits.shift();
console.log(firstFruit); // Output: apple
console.log(fruits); // Output: ['banana', 'cherry']

 

splice()

این متد می‌تواند برای اضافه کردن یا حذف عناصر از هر نقطه‌ای در آرایه استفاده شود.

نحوه استفاده از 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()

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

نحوه استفاده از slice():


const fruits = ['apple', 'banana', 'cherry', 'date'];
const citrus = fruits.slice(1, 3);
console.log(citrus); // Output: ['banana', 'cherry']

 

در این مثال، slice() عناصر از اندیس 1 تا (3-1) را برمی‌گرداند.

 

پیمایش آرایه‌ها

پیمایش آرایه‌ها به معنای اجرای یک تابع یا عملیات برای هر عنصر آرایه است.

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


const fruits = ['apple', 'banana', 'cherry'];
for (let i = 0; i < fruits.length; i++) {
  console.log(fruits[i]);
}
// Output:
// apple
// banana
// cherry

 

استفاده از حلقه forEach()

forEach() یک تابع را برای هر عنصر آرایه اجرا می‌کند.


const fruits = ['apple', 'banana', 'cherry'];
fruits.forEach(fruit => console.log(fruit));
// Output:
// apple
// banana
// cherry

 

توابع متداول دیگر برای آرایه‌ها

map()

این متد یک تابع را برای هر عنصر آرایه اجرا می‌کند و یک آرایه جدید با نتایج برمی‌گرداند.


const numbers = [1, 2, 3, 4];
const doubled = numbers.map(number => number * 2);
console.log(doubled); // Output: [2, 4, 6, 8]

 

filter()

این متد آرایه‌ای از عناصری را که با شرط خاصی مطابقت دارند، برمی‌گرداند.


const numbers = [1, 2, 3, 4, 5];
const evenNumbers = numbers.filter(number => number % 2 === 0);
console.log(evenNumbers); // Output: [2, 4]

 

reduce()

این متد برای کاهش (تجمیع) آرایه به یک مقدار واحد استفاده می‌شود.


const numbers = [1, 2, 3, 4];
const sum = numbers.reduce((total, number) => total + number, 0);
console.log(sum); // Output: 10

 

نتیجه‌گیری

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

پرسش و پاسخ

نظری یافت نشد

مطالب مشابه

آموزش جامع اتصال به دیتابیس با PDO در PHP
1405/05/04 23:42

آموزش جامع اتصال به دیتابیس با PDO در PHP

مطالعه بیشتر
مفهوم متغیرها و انواع داده در جاوا اسکریپت: راهنمای جامع برای مبتدیان
1402/06/28 00:07

مفهوم متغیرها و انواع داده در جاوا اسکریپت: راهنمای جامع برای مبتدیان

مطالعه بیشتر
تفاوت PHP با HTML، CSS و JavaScript؛ راهنمای جامع و ساده برای مبتدیان
1405/03/21 01:06

تفاوت PHP با HTML، CSS و JavaScript؛ راهنمای جامع و ساده برای مبتدیان

مطالعه بیشتر
آموزش mix-blend-mode و background-blend-mode در CSS: ترکیب رنگ‌ها و ایجاد افکت‌های جذاب
1403/08/12 20:18

آموزش mix-blend-mode و background-blend-mode در CSS: ترکیب رنگ‌ها و ایجاد افکت‌های جذاب

مطالعه بیشتر
آموزش کار با Webpack و Bundlers برای مدیریت پروژه‌ها: راهنمای جامع و کاربردی
1403/08/05 20:43

آموزش کار با Webpack و Bundlers برای مدیریت پروژه‌ها: راهنمای جامع و کاربردی

مطالعه بیشتر
تفاوت آرایه عددی، انجمنی و چندبعدی در PHP: راهنمای جامع و کاربردی
1405/03/24 01:07

تفاوت آرایه عددی، انجمنی و چندبعدی در PHP: راهنمای جامع و کاربردی

مطالعه بیشتر
معرفی MySQL و phpMyAdmin: راهنمای جامع مدیریت پایگاه داده برای توسعه‌دهندگان وب
1405/05/04 23:32

معرفی MySQL و phpMyAdmin: راهنمای جامع مدیریت پایگاه داده برای توسعه‌دهندگان وب

مطالعه بیشتر
آموزش استفاده از position در CSS: نحوه موقعیت‌دهی عناصر در صفحات وب
1403/08/09 20:59

آموزش استفاده از position در CSS: نحوه موقعیت‌دهی عناصر در صفحات وب

مطالعه بیشتر
آموزش استفاده از ماژول‌ها (Modules) در جاوا اسکریپت: آشنایی با ES6 Modules - راهنمای کامل
1403/08/05 20:24

آموزش استفاده از ماژول‌ها (Modules) در جاوا اسکریپت: آشنایی با ES6 Modules - راهنمای کامل

مطالعه بیشتر
آموزش مفاهیم اولیه CSS Grid Layout: طراحی شبکه‌های پیچیده و واکنش‌گرا راهنمای کامل
1402/06/06 23:24

آموزش مفاهیم اولیه CSS Grid Layout: طراحی شبکه‌های پیچیده و واکنش‌گرا راهنمای کامل

مطالعه بیشتر
آموزش ساخت یک برنامه ساده با Fetch API در جاوا اسکریپت: راهنمای گام به گام
1403/08/01 20:16

آموزش ساخت یک برنامه ساده با Fetch API در جاوا اسکریپت: راهنمای گام به گام

مطالعه بیشتر
مدیریت خطاها و استفاده از try...catch در جاوا اسکریپت: راهنمای کامل و مثال‌ها
1403/07/28 21:58

مدیریت خطاها و استفاده از try...catch در جاوا اسکریپت: راهنمای کامل و مثال‌ها

مطالعه بیشتر

تمامی حقوق معتلق به ناشر سایت است و کپی از آن پیگرد قانونی دارد