آرایه چند بعدی در جاوا اسکریپت – توضیح به زبان ساده + مثال و کد

آرایه چند بعدی در جاوا اسکریپت نوعی ساختار داده‌ محسوب می‌شود که امکان سازمان‌دهی داده‌ها را به شکل ماتریس مانند فراهم می‌کند. برخلاف آرایه‌های تک‌بعدی که از یک «شاخص» (اندیس | Index) برای دسترسی به عناصر خود استفاده می‌کنند، آرایه‌های چند بعدی از چندین اندیس برای دسترسی به عناصر خود بهره می‌برند. این نوع آرایه‌ها در جاوا اسکریپت نمایش الگوهای داده پیچیده را ممکن ساخته و آن‌ها را برای کارهایی مانند ذخیره‌سازی داده‌های جدولی، ماتریس‌ها و سایر اطلاعات ساختاریافته ارزشمند می‌سازند.

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

آرایه چند بعدی در جاوا اسکریپت چیست؟

آرایه چند بعدی در جاوا اسکریپت به آرایه‌ای اطلاق می‌شود که شامل یک یا چند آرایه تودرتو است. برخلاف آرایه معمولی که تک‌بعدی بوده و با استفاده از اندیسی واحد مانند arr[i]عناصر آن قابل‌ دسترسی هستند، آرایه چند بعدی از چندین اندیس برای دسترسی به عناصر استفاده می‌کند. به عنوان مثال، آرایه‌ای دوبعدی با استفاده از دو اندیس قابل‌دسترسی است: arr[i][j]. این الگو به ابعاد بالاتر نیز گسترش می‌یابد، مانند آرایه سه‌بعدی که با arr[i][j][k]نشان داده می‌شود.

فیلم آموزش جاوا اسکریپت JavaScript – جامع و کاربردی در فرادرس

کلیک کنید

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

در تصویر فوق «Row» به معنی سطر، «Column» به معنی ستون و «Array» به معنی آرایه است.

کاربرد آرایه چند بعدی در Javascript چیست؟

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

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

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

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

فیلم آموزش JavaScript ES6 جاوا اسکریپت در فرادرس

کلیک کنید

١. ساخت آرایه چند بعدی با Array Literal

ساده‌ترین رویکرد برای ایجاد آرایه چند بعدی در Javascript استفاده از «نمادگذاری تحت‌اللفظی آرایه» (Array Literal) است. این رویکرد مستلزم تعریف آرایه‌ای خواهد بود در آن عناصر این آرایه خودشان نوعی آرایه هستند. مثال زیر به درک این مفهوم بسیار کمک می‌کند.

1var employee = [
2    [20, 'Pranshu', 'Lucknow'],
3    [21, 'Sameer', 'Varanasi'],
4    [22, 'Kartikey', 'Lakhimpur']
5];

٢. استفاده از سازنده آرایه

نوعی روش جایگزین دیگر برای ساخت آرایه چند بعدی در زبان برنامه نویسی جاوا اسکریپت شامل استفاده از سازنده آرایه است. این رویکرد ساخت آرایه با فراخوانی متد Array()و ارائه آرایه‌های تودرتو به عنوان آرگومان قادر به ساخت آرایه‌های چند بعدی است که مثال زیر این مفهوم را بیان می‌کند:

1var employee = Array(
2    [20, 'Pranshu', 'Lucknow'],
3    [21, 'Sameer', 'Varanasi'],
4    [22, 'Kartikey', 'Lakhimpur']
5);

هر دو رویکرد منجر به ساختار آرایه‌ای چند بعدی می‌شوند و امکان ذخیره و دست‌کاری داده‌ها را به شکل ماتریس مانند فراهم می‌کنند.

نحوه بازیابی عناصر آرایه چند بعدی چگونه است؟

برای بازیابی عناصر از آرایه چند بعدی، از نماد دو براکت مربعی «[]» طی فرایندی ساده استفاده می‌شود. براکت‌های مربعی اولیه ردیف یا سطر خاصی در آرایه بیرونی هدف قرار می‌دهند و جفت براکت‌های بعدی به عنصر موردنظر در آرایه داخلی واقع در آن اندیس خاص، برای بازیابی عنصر اشاره دارند. توجه به مثال زیر به درک این مفهوم بسیار کمک می‌کند:

1let data = [
2    [20, 'Pranshu', 'Lucknow'],
3    [21, 'Sameer', 'Varanasi'],
4    [22, 'Kartikeya', 'Lakhimpur']
5];
6
7// Retrieving the entire first inner array
8console.log(data[0]);
9// Output: [20, 'Pranshu', 'Lucknow']
10
11// Accessing the second item of the first inner array
12console.log(data[0][1]);
13// Output: 'Pranshu'
14
15// Accessing the second item of the third inner array
16console.log(data[2][1]);
17// Output: 'Kartikeya'

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

• در مثال فوق data[0]اولین آرایه داخلی را در آرایه داده بازیابی می‌کند. در نتیجه، خروجی [20، 'Pranshu'، 'Lucknow']خواهد بود که عناصر موجود در اولین آرایه داخلی هستند.
• data[0][1]به عنصر دوم در اولین آرایه داخلی دسترسی دارد. اولین اندیس 0اولین آرایه داخلی را نشان می‌دهد و اندیس دوم 1مورد دوم را در آن آرایه انتخاب می‌کند که خروجی آن مقدار Pranshuخواهد بود.
• در مثال فوق همچنین data[2][1]عنصر دوم را از آرایه داخلی سوم بازیابی می‌کند. اندیس 2به آرایه داخلی سوم اشاره کرده و اندیس 1مورد یا عنصر دوم را در آن آرایه انتخاب می‌کند که خروجی Kartikeyaخواهد بود.

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

ویژگی های آرایه چند بعدی در جاوا اسکریپت

درک ویژگی‌های آرایه چند بعدی در جاوا اسکریپت بینش ارزشمندی را در مورد نحوه کار این آرایه‌ها به کاربر می‌دهد و بر همین اساس در زیر سه تا از مهم‌ترین ویژگی‌های این نوع آرایه در جاوا اسکریپت مورد بررسی قرار گرفته‌اند.

فیلم آموزش JavaScript ES6 جاوا اسکریپت در فرادرس

کلیک کنید

١. ویژگی طول یا اندازه آرایه: lengthبرای بازیابی طول آرایه مدنظر به کار می‌رود که مثال زیر نحوه استفاده از این ویژگی را بیان می‌کند:

1var d = [5, 6, 7, 8];
2d.length;
3
4// output: 4

٢. ویژگی typeof: عملگر typeofنوع داده آرایه داده شده را بازمی‌گرداند که مثال مربوط به آن به صورت زیر است:

1var d = [5, 6, 7, 8];
2typeof d;
3
4// output: object

٣. ویژگیisArray(): تابع isArray()نوع بازگشتی بولی را ارائه می‌دهد و تعیین می‌کند که آیا متغیر ارائه شده نوعی آرایه است یا خیر. مثال زیر برای درک این مفهوم است:

1var d = [5, 6, 7, 8];
2Array.isArray(d); 
3
4// output: true

در اصل، این ویژگی‌ها بررسی و دست‌کاری آرایه‌های چند بعدی در جاوا اسکریپت را تسهیل کرده و امکان مدیریت مؤثر داده‌ها و تعیین نوع را فراهم می‌کنند.

افزودن عنصر به آرایه داخلی چند بعدی

برای افزودن عناصر به آرایه چند بعدی در جاوا اسکریپت، از دو روش استفاده می‌شود. روش اول استفاده از متد push()و روش دوم استفاده از نماد اندیس است. متد push()عنصر را به انتهای آرایه اضافه می‌کند و نماد اندیس اجازه می‌دهد عناصر در اندیس‌های خاصی اضافه شوند. در ادامه این دو رویکرد به همراه مثال مورد بررسی واقع خواهند شود.
برای افزودن عناصر به آرایه بیرونی باید به صورت زیر عمل کرد:

1let students = [
2    [20, 'Pranshu', 'Lucknow'],
3    [22, 'Kartikeya', 'Lakhimpur']
4];
5
6students.push([18, 'Pranav', 'Mathura']);
7console.log(students);

خروجی مثال بالا به صورت زیر است:

[
    [20, 'Pranshu', 'Lucknow'],
    [22, 'Kartikeya', 'Lakhimpur'],
    [18, 'Pranav', 'Mathura']
]