سیده آمین ارمان
کاربر نگاه دانلود
Loop (لوپ یا حلقه) به دستوراتی گفته می شود که یک تکه کد را به دفعات متعدد، تکرار می کنند و کد ما را داخل یک حلقه که مدام تکرار می شود، می اندازند. در زبان جاوا اسکریپت چندین نوع لوپ وجود دارد که عبارتند از:
for
for … in
do … while
while
که در ادامه ی این آموزش و آموزش های آتی، هر یک از این لوپ ها را جداگانه بررسی خواهیم کرد. دستور for برای ساخت یک لوپ از سه اکسپرشن جداگانه استفاده می کند:
دستور شروع: مقدار اولیه ی یک متغیر که معمولاً یک Counter (کانتر یا شمارنده) است.
شرط: یک اکسپرشن بولین (true یا false) که در هر مرحله از تکرار لوپ، می بایست وضعیت آن بررسی شود.
اکسپرشن نهایی: یک اکسپرشن که در هر مرحله از لوپ، کد آن اجرا می شود.
با آن که استفاده از هر سه بخش بالا برای لوپ for اجباری نیست، اما در اکثر موارد این سه مورد را در کنار همدیگر خواهیم دید. کاربرد لوپ for بدین شکل است که یک تکه کد را به تعداد دفعات از قبل تعیین شده، تکرار می کند. مثال زیر، یک نمونه ی ساده از لوپ for است که هر سه اکسپرشن گفته شده را دارد:
for (var x = 1; x < 10; x++) {
console.log(x);
};
در نمونه ی بالا، ابتدا لوپ for نوشته شده و سپس در داخل پرانتز آن، برخی عبارات قرار گرفته اند: در ابتدا یک متغیر به نام x تعریف شده که دارای مقدار اولیه ی 1 هست. پس از آن، شرط لوپ آورده شده که در اینجا x < 10 است و بیان می کند که تا زمانی که متغیر x دارای مقداری کوچک تر از 10 است، دستورات داخل براکت های for اجرا شوند. سپس اپراتور افزایش پسوندی ++ قرار دارد که پس از هر بار بررسی عبارت شرط (x < 10)، یک واحد به مقدار متغیر x می افزاید. در داخل براکت ها نیز اکسپرشن نهایی قرار دارد که کدهای اصلی لوپ را تشکیل می دهد و به تعداد دفعات مشخص شده، اجرا خواهند شد که در اینجا، تنها مقدار متغیر x در کنسول چاپ می شود (توجه داشته باشیم که عبارات داخل پرانتز می بایست با علامت ; از یکدیگر جدا شوند.) تصویر زیر، نتیجه ی اجرای کد بالا در کنسول جاوا اسکریپت مرورگر کروم را نشان می دهد:
حال اگر بخواهیم به صورت مرحله به مرحله، طرز کار لوپ for را بررسی کنیم، بدین شرح خواهد بود:
1- یک متغیر جدید به نام x و با مقدار اولیه ی 1 ساخته می شود.
2- یک بررسی انجام می شود که آیا x از 10 کوچک تر است یا خیر. اگر کوچک تر باشد، دستورات داخل لوپ اجرا می شوند.
3- اگر x کوچک تر از 10 بود، مقدار x به کمک اپراتور افزایش پسوندی، یک واحد افزایش پیدا می کند.
4- باری دیگر بررسی می شود که آیا x کوچک تر از 10 هست یا خیر.
اگر شرط برقرار بود، دستورات داخل لوپ اجرا می شوند.
5- پروسه ی بررسی شرط تا زمانی ادامه می یابد که x کوچک تر از ۱۰ باشد سپس جاوا اسکریپت به طور کلی از داخل لوپ خارج می شود.
اگر دقت کنیم، متوجه خواهیم شد که این اعداد تا شماره 9 چاپ شده اند و خود شماره ی 10 در خروجی نمایش داده نمی شود. دلیل این موضوع آن است که در شرط لوپ for مشخص کردیم که مقدار متغیر x می بایست کوچکتر از 10 باشد و بدین ترتیب خود 10 در آن جای نخواهد گرفت. اگر بخواهیم اعداد 1 تا 10 را در خروجی ببینیم، می توانیم به جای شرط x < 10، از اپراتور کوچک تر یا مساوی => استفاده کنیم که در نهایت، شرط لوپ ما برابر با x <= 10 خواهد بود.
همچنین، با استفاده از دستور لوپ for می توانیم تمامی اعضای یک آرایه را به صورت لیست، مشاهده کنیم. کد زیر را در نظر بگیریم:
var areaCode = ["021", "026", "061", "083", "031"];
for (x = 0; x <= areaCode.length - 1; x++) {
console.log("Your city’s area code is: "+ areaCode[x] + '\n');
};
در نمونه ی بالا، آرایه ای به نام areaCode وجود دارد که دارای 5 عضو جداگانه است. از آنجایی که برای استفاده از لوپ for به یک متغیر شمارنده نیاز داریم و تمامی اعضای آرایه نیز همواره به ترتیب پشت سر هم قرار می گیرند، می بایست راهی برای ادغام این دو موضوع پیدا کنیم.
در اینجا باید به خاطر بیاوریم که اندازه ی این آرایه یا همان پراپرتی areaCode.length به ما تعداد اعضای آرایه را نمایش می دهد. از آنجایی که برای شرط لوپ for می بایست یک متغیر شمارنده داشته باشیم، تعداد اعضای آرایه می تواند منطقی ترین گزینه باشد چرا که لوپ ما دقیقاً به همان تعداد اعضای آرایه تکرار می شود و می تواند در هر بار تکرار، یکی از اعضا را چاپ کند تا در نهایت لیستی از همه ی اعضا داشته باشیم.
اما مسأله ی دیگری که وجود دارد، تفاوت بین «تعداد اعضا» و «شماره ی ایندکس اعضا» است که اولی همچون اعداد طبیعی از 1 شروع می شود اما ایندکس ها از 0 شروع می گردند. برای آن که اختلاف میان این دو را برطرف کنیم، اندازه ی آرایه را منهای 1 می کنیم (areaCode.length – 1) تا به همان شماره ی ایندکس اعضا دست پیدا کنیم و بدین ترتیب شرط دستور لوپ ساخته می شود.
در داخل دستور console.log نیز از کد [areaCode[x استفاده کرده ایم. دلیل این کار آن است که مقدار متغیر x در ابتدا از صفر شروع می شود و تا شماره ی ایندکس آخرین عضو، یکی یکی افزایش پیدا می کند تا در نهایت از لوپ خارج شویم. به همین دلیل، در هر مرحله از اجرای لوپ for، مقدار متغیر x دقیقاً با شماره ی ایندکس یکی از اعضای آرایه برابر است و به همین دلیل می توانیم در هر شماره دفعه ی تکرار از لوپ، دقیقاً همان عضوی از آرایه که دارای شماره ی ایندکس مشابه است را نمایش دهیم. در نهایت، خروجی ما به شکل زیر خواهد بود:
for
for … in
do … while
while
که در ادامه ی این آموزش و آموزش های آتی، هر یک از این لوپ ها را جداگانه بررسی خواهیم کرد. دستور for برای ساخت یک لوپ از سه اکسپرشن جداگانه استفاده می کند:
دستور شروع: مقدار اولیه ی یک متغیر که معمولاً یک Counter (کانتر یا شمارنده) است.
شرط: یک اکسپرشن بولین (true یا false) که در هر مرحله از تکرار لوپ، می بایست وضعیت آن بررسی شود.
اکسپرشن نهایی: یک اکسپرشن که در هر مرحله از لوپ، کد آن اجرا می شود.
با آن که استفاده از هر سه بخش بالا برای لوپ for اجباری نیست، اما در اکثر موارد این سه مورد را در کنار همدیگر خواهیم دید. کاربرد لوپ for بدین شکل است که یک تکه کد را به تعداد دفعات از قبل تعیین شده، تکرار می کند. مثال زیر، یک نمونه ی ساده از لوپ for است که هر سه اکسپرشن گفته شده را دارد:
for (var x = 1; x < 10; x++) {
console.log(x);
};
در نمونه ی بالا، ابتدا لوپ for نوشته شده و سپس در داخل پرانتز آن، برخی عبارات قرار گرفته اند: در ابتدا یک متغیر به نام x تعریف شده که دارای مقدار اولیه ی 1 هست. پس از آن، شرط لوپ آورده شده که در اینجا x < 10 است و بیان می کند که تا زمانی که متغیر x دارای مقداری کوچک تر از 10 است، دستورات داخل براکت های for اجرا شوند. سپس اپراتور افزایش پسوندی ++ قرار دارد که پس از هر بار بررسی عبارت شرط (x < 10)، یک واحد به مقدار متغیر x می افزاید. در داخل براکت ها نیز اکسپرشن نهایی قرار دارد که کدهای اصلی لوپ را تشکیل می دهد و به تعداد دفعات مشخص شده، اجرا خواهند شد که در اینجا، تنها مقدار متغیر x در کنسول چاپ می شود (توجه داشته باشیم که عبارات داخل پرانتز می بایست با علامت ; از یکدیگر جدا شوند.) تصویر زیر، نتیجه ی اجرای کد بالا در کنسول جاوا اسکریپت مرورگر کروم را نشان می دهد:
حال اگر بخواهیم به صورت مرحله به مرحله، طرز کار لوپ for را بررسی کنیم، بدین شرح خواهد بود:
1- یک متغیر جدید به نام x و با مقدار اولیه ی 1 ساخته می شود.
2- یک بررسی انجام می شود که آیا x از 10 کوچک تر است یا خیر. اگر کوچک تر باشد، دستورات داخل لوپ اجرا می شوند.
3- اگر x کوچک تر از 10 بود، مقدار x به کمک اپراتور افزایش پسوندی، یک واحد افزایش پیدا می کند.
4- باری دیگر بررسی می شود که آیا x کوچک تر از 10 هست یا خیر.
اگر شرط برقرار بود، دستورات داخل لوپ اجرا می شوند.
5- پروسه ی بررسی شرط تا زمانی ادامه می یابد که x کوچک تر از ۱۰ باشد سپس جاوا اسکریپت به طور کلی از داخل لوپ خارج می شود.
اگر دقت کنیم، متوجه خواهیم شد که این اعداد تا شماره 9 چاپ شده اند و خود شماره ی 10 در خروجی نمایش داده نمی شود. دلیل این موضوع آن است که در شرط لوپ for مشخص کردیم که مقدار متغیر x می بایست کوچکتر از 10 باشد و بدین ترتیب خود 10 در آن جای نخواهد گرفت. اگر بخواهیم اعداد 1 تا 10 را در خروجی ببینیم، می توانیم به جای شرط x < 10، از اپراتور کوچک تر یا مساوی => استفاده کنیم که در نهایت، شرط لوپ ما برابر با x <= 10 خواهد بود.
همچنین، با استفاده از دستور لوپ for می توانیم تمامی اعضای یک آرایه را به صورت لیست، مشاهده کنیم. کد زیر را در نظر بگیریم:
var areaCode = ["021", "026", "061", "083", "031"];
for (x = 0; x <= areaCode.length - 1; x++) {
console.log("Your city’s area code is: "+ areaCode[x] + '\n');
};
در نمونه ی بالا، آرایه ای به نام areaCode وجود دارد که دارای 5 عضو جداگانه است. از آنجایی که برای استفاده از لوپ for به یک متغیر شمارنده نیاز داریم و تمامی اعضای آرایه نیز همواره به ترتیب پشت سر هم قرار می گیرند، می بایست راهی برای ادغام این دو موضوع پیدا کنیم.
در اینجا باید به خاطر بیاوریم که اندازه ی این آرایه یا همان پراپرتی areaCode.length به ما تعداد اعضای آرایه را نمایش می دهد. از آنجایی که برای شرط لوپ for می بایست یک متغیر شمارنده داشته باشیم، تعداد اعضای آرایه می تواند منطقی ترین گزینه باشد چرا که لوپ ما دقیقاً به همان تعداد اعضای آرایه تکرار می شود و می تواند در هر بار تکرار، یکی از اعضا را چاپ کند تا در نهایت لیستی از همه ی اعضا داشته باشیم.
اما مسأله ی دیگری که وجود دارد، تفاوت بین «تعداد اعضا» و «شماره ی ایندکس اعضا» است که اولی همچون اعداد طبیعی از 1 شروع می شود اما ایندکس ها از 0 شروع می گردند. برای آن که اختلاف میان این دو را برطرف کنیم، اندازه ی آرایه را منهای 1 می کنیم (areaCode.length – 1) تا به همان شماره ی ایندکس اعضا دست پیدا کنیم و بدین ترتیب شرط دستور لوپ ساخته می شود.
در داخل دستور console.log نیز از کد [areaCode[x استفاده کرده ایم. دلیل این کار آن است که مقدار متغیر x در ابتدا از صفر شروع می شود و تا شماره ی ایندکس آخرین عضو، یکی یکی افزایش پیدا می کند تا در نهایت از لوپ خارج شویم. به همین دلیل، در هر مرحله از اجرای لوپ for، مقدار متغیر x دقیقاً با شماره ی ایندکس یکی از اعضای آرایه برابر است و به همین دلیل می توانیم در هر شماره دفعه ی تکرار از لوپ، دقیقاً همان عضوی از آرایه که دارای شماره ی ایندکس مشابه است را نمایش دهیم. در نهایت، خروجی ما به شکل زیر خواهد بود:
