فصل ۲-۲: تعریف متغیر‌هایی از نوع آرایه‌ در جاوا اسکریپت (JavaScript)

09 اردیبهشت 1396
JavaScript-main-arrays

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

آرایه‌ها

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

ساختار ظاهری آرایه‌ها

برای ایجاد یک متغییر از نوع آرایه به صورت زیر عمل می‌کنیم:

var colors;
colors = ['white', 'black', 'custom'];

همانطور که در نمونه‌ی بالا مشاهده می‌کنید شما یک آرایه به نام colors ایجاد کردید همچنین برای تعریف متغییر از کلمه‌ی کلیدی var بهره برده‌اید. مقادیر درون این آرایه در خط ۲ با نام‌های white و black و custom ایجاد شده‌اند. همانطور که در جریان هستید این آرایه مقادیر رشته‌ای را درون خود ذخیره کرده است. به همین دلیل هر مقدار رشته‌ای درون یک جفت ' ' قرار گرفته است. از طرفی برای بسته‌بندی یک آرایه از علامت براکت [ ] استفاده و هر مقدار را با یک کامای انگلیسی , از هم جدا می‌کنیم. همچنین باید به این نکته توجه کرد که مقادیر درون یک ارایه الزاما نوع یکسان ندارند. یعنی شما مختار هستید که انواع داده‌ها را درون یک آرایه قرار دهید.

به این شیوه و تکنیک ساخت یک آرایه array literal (آرایه‌ی تحت‌الفظی) گفته می‌شود. این روش معمول‌ترین روش برای تعریف یک متغییر از نوع آرایه‌ای است.

var colors = ['white', 'red', 'blue'];

تکنیک دیگری برای تعریف آرایه وجود دارد که به array constructor (آرایه همراه با سازنده) معروف است. نمونه‌ی زیر را مشاهده کنید:

var colors = new Array('white ', 'black', 'custom ');

در این روش از کلمه‌ی کلیدی Array استفاده کرده و یک شیء آرایه‌ای با مقادیر پیشفرض white و black و custom‌ ایجاد کرده‌ایم.

مقادیر درون آرایه‌ها

مقادیر درون یک آرایه را می‌توان با شماره‌ای که به هر یک از آنها انتساب می‌گردد، بازیابی کرد.

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

هر مقدار درون یک آرایه، یک شماره بخصوص خود را دارد که به آن ایندکس index گفته می‌شود. با استفاده از شماره ایندکس می‌توان به مقادیر یک آرایه دسترسی پیدا کرد. مثال بالا را مجددا در ذهن مرور کنید. در این مثال آرایه‌ی colors دارای ۳ مقدار می‌باشد که شمارش آنها به صورت ۰ و ۱ و ۲ می‌باشد. بنابراین به صورت زیر می‌توان شماره‌گذاری را انجام داد:

INDEX           VALUE
  0             'white'
  1             'black'
  2             'custom'

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

var itemThree;
itemThree = colors[2];

در مثال فوق متوجه شدید که با قرار دادن شماره ایندکس درون یک جفت براکت، سومین مقدار آرایه که برابر custom می‌باشد را درون متغییر itemThree ذخیره کرده‌ایم.

برای حرفه‌ای‌تر شدن این مبحث باید خدمت شما عزیزان عرض کنیم که جهت دستیابی به طول یک آرایه یا به عبارت دیگر تعداد مقادیر درون آن می‌توان از property یا ویژگی length استفاده کرد. در نتیجه برای مثال فوق داریم:

var numColors;
numColors = colors.length;

در نتیجه حاصل عبارت فوق برابر مقدار عددی ۳ می‌باشد که نمایانگر طول آرایه یا تعداد مقادیر درون آن است.

تغییر مقادیر درون یک آرایه

برای تغییر مقادیر درون یک ارایه می‌توان شماره ایندکس آن را انتخاب کرد و در نهایت مقدار آن را برابر با مقدار جدید درنظر گرفت.

var colors = ['white', 'red', 'blue'];
colors[2] = 'pink';

با اجرای این کد مقدار سوم آرایه‌ی colors به عبارت pink تغییر پیدا می‌کند و آرایه‌ی جدید شما به صورت زیر خواهد بود:

['white', 'red', 'pink'];

اتصال رشته‌ها به یکدیگر

پس از بررسی مباحث مربوط به آرایه‌ها لازم به ذکر دانستیم که مطلبی را برای اتصال رشته‌ها به یکدیگر در زبان برنامه‌نویسی جاوا اسکریپت خدمت شما عزیزان ارائه دهیم. فرض کنید دو متغییر به نامهای firstName و lastName در اختیار داریم که مقادیر Masoud و Salehi را به ترتیب درون خود ذخیره می‌کنند:

var firstName = 'Masoud';
var lastName = 'Salehi';

حال می‌خواهیم این دو متغییر را به یکدیگر اتصال داده و یک متغییر با مقدار واحد Masoud Salehi در اختیار داشته باشیم. آنگاه باید به صورت زیر عمل کنیم:

var firstName = 'Masoud';
var lastName = 'Salehi';
var fullName = firstName + lastName;

با بررسی مثال فوق متوجه خواهید شد که یک عبارت با عنوان Masoud Salehi با استفاده از اتصال دو متغییر firstName و lastName که حاوی مقادیر Masoud و Salehi‌ بودند ایجاد شد. این اتصال در زبان برنامه نویسی جاوا اسکریپت با استفاده از سمبل یا علامت + صورت می‌گیرد.

اتصال اعداد و رشته‌ها

همچنین می‌توان از همین عملگر + برای ترکیب و اتصال دو متغییر عددی و رشته‌ای یا عددی با عددی استفاده کرد:

var cost1 = '7';
var cost2 = '9';

var total = cost1 + cost2

در مثال فوق دو مقدار عددی را با یکدیگر ادغام و ترکیب کردیم.

var number = 12;
var street = 'Pastor Roxo';
var address = number + street;

در این مثال نیز یک مقدار عددی را با یک مقدار رشته‌ای ادغام کردیم. در نتیجه برای متغییر address خواهیم داشت: 12Pastor Roxo.

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

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

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

فصل ۱: جاوا اسکریپت (JavaScript) چیست؟

فصل ۲

نویسنده شوید
دیدگاه‌های شما (1 دیدگاه)

در این قسمت، به پرسش‌های تخصصی شما درباره‌ی محتوای مقاله پاسخ داده نمی‌شود. سوالات خود را اینجا بپرسید.

reza
04 آذر 1397
سلام ببخشید برای من موقع فراخوانی یک تابع جاوا اسکریپت یک مشکل ایجاد می شود تابع را با alert فراخوانی میکنم مقدار undefined برگردانده می شود درحالی که مطمئنم که سینتکس تابع را درست نوشته ام ممنون میشم راهنماییم کنید با تشکر از سایت عالیتون

در این قسمت، به پرسش‌های تخصصی شما درباره‌ی محتوای مقاله پاسخ داده نمی‌شود. سوالات خود را اینجا بپرسید.