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

حلقه While در جاوا اسکریپت
آنچه در این مطلب می‌خوانید

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

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

درک حلقه While در جاوا اسکریپت

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

console.log("پیام شماره ۱");

console.log("پیام شماره ۲");

// و غیره تا پیام شماره ۱۰

این روش برای تکرارهای کم کارآمد است اما برای تکرارهای زیاد خسته‌کننده و مستعد خطا می‌شود. حلقه While راه‌حلی برای این مشکل است.

ساختار کلی یک حلقه While به صورت زیر است:

while (شرط) {

  // بلاک کد که باید تکرار شود

}

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

مثالی از حلقه وایل در جاوا اسکریپت: چاپ ۱۰ پیام با حلقه While

بیایید ببینیم چگونه می‌توانیم از حلقه While در جاوا اسکریپت برای چاپ ۱۰ پیام روی صفحه نمایش استفاده کنیم:

JavaScript

let counter = 0;

while (counter < 10) {

  console.log("پیام شماره", counter + 1);

  counter++;

} 

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

حلقه‌های تو در تو در جاوا اسکریپت

حلقه‌های While جاوا اسکریپت را می‌توان درون همدیگر قرار داد (حلقه‌های تو در تو) تا الگوهای تکرار پیچیده‌تری ایجاد کنیم. برای مثال، فرض کنید می‌خواهیم ۵ بار یک پیام را چاپ و در هر بار چاپ، آن را ۳ بار تکرار کنیم. می‌توانیم از دو حلقه While تو در تو برای دستیابی به این هدف استفاده کنیم:

let outerCounter = 0;

while (outerCounter < 5) {
  let innerCounter = 0;
  while (innerCounter < 3) {
    console.log("پیام");
    innerCounter++;
  }
  outerCounter++;
}

حلقه خارجی ۵ بار اجرا می‌شود و در هر بار اجرا، حلقه داخلی ۳ بار اجرا می‌شود.

انواع حلقه‌ ها در جاوا اسکریپت

علاوه بر حلقه While، جاوا اسکریپت از حلقه‌های کنترلی دیگری مانند حلقه For و حلقه For-Of نیز پشتیبانی می‌کند.

  • حلقه For: حلقه For شبیه حلقه While است، اما ساختار سینتکسی مختصری دارد که اغلب برای پیمایش با شمارنده مناسب‌تر است.
  • حلقه For-Of: حلقه For-Of برای پیمایش روی عناصر قابل شمارش (Iterable) مانند آرایه‌ها و رشته‌ها استفاده می‌شود.

خروج زودهنگام از حلقه While در جاوا اسکریپت

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

  • دستور Break: دستور Break باعث می‌شود اجرای حلقه به طور کامل متوقف شود، حتی اگر شرط حلقه همچنان درست باشد.
  • دستور Continue: دستور Continue باعث می‌شود اجرای فعلی حلقه نادیده گرفته شود و به سراغ اجرای بعدی برویم.

مثال: خروج از حلقه While با Break

فرض کنید می‌خواهیم ۱۰ بار یک عدد تصادفی بین ۱ و ۱۰ تولید کنیم و اگر عدد تولید شده برابر با ۵ بود، از حلقه خارج شویم. می‌توانیم از دستور Break برای این کار استفاده کنیم:

while (true) {
  let randomNumber = Math.floor(Math.random() * 10) + 1;
  console.log(randomNumber);

  if (randomNumber === 5) {
    break;
  }
}

در این مثال، حلقه While در جاوا اسکریپت تا زمانی که عدد تصادفی برابر با ۵ نباشد، اجرا می‌شود. در غیر این صورت، با استفاده از دستور Break از حلقه خارج می‌شویم.

دستور Continue در حلقه While

دستور Continue باعث می‌شود اجرای فعلی حلقه نادیده گرفته شود و به سراغ اجرای بعدی برویم. برای مثال، فرض کنید می‌خواهیم اعداد ۱ تا ۱۰ را چاپ کنیم، به جز عدد ۵. می‌توانیم از دستور Continue برای این کار استفاده کنیم:

let counter = 0;

while (counter < 10) {
  counter++;

  if (counter === 5) {
    continue;
  }

  console.log(counter);
}

در این مثال، اگر counter برابر با ۵ باشد، دستور Continue اجرا می‌شود و به سراغ اجرای بعدی حلقه می‌رویم. در نتیجه، عدد ۵ چاپ نمی‌شود.

Try-Catch در حلقه While

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

let counter = 0;

while (counter < 10) {
  try {
    let number = parseInt(prompt("یک عدد وارد کنید:"));
    let result = number * number;
    console.log(result);
  } catch (error) {
    console.error("ورودی نامعتبر");
  }

  counter++;
}

در این مثال، اگر کاربر عددی غیرعددی وارد کند، بلوک Catch اجرا می‌شود و پیام “ورودی نامعتبر” چاپ می‌شود.

نکات مهم در مورد حلقه While در جاوا اسکریپت

در استفاده از حلقه وایل در جاوا اسکریپت نکات زیر را مد نظر داشته باشید:

  • از حلقه While برای تکرار بلاک‌های کد تا زمانی که یک شرط خاص برقرار است، استفاده کنید.
  • ساختار کلی حلقه While شامل شرط و بلاک کد است.
  • حلقه‌های While را می‌توان درون همدیگر قرار داد (حلقه‌های تو در تو) تا الگوهای تکرار پیچیده‌تری ایجاد کنید.
  • از دستور Break برای خروج زودهنگام از حلقه While استفاده کنید.
  • از دستور Continue برای نادیده گرفتن اجرای فعلی حلقه While و رفتن به سراغ اجرای بعدی استفاده کنید.
  • از بلوک Try-Catch برای مدیریت خطاها در داخل حلقه While استفاده کنید.

 چه زمانی از حلقه While استفاده کنیم؟

از حلقه While زمانی استفاده می‌کنیم که بخواهیم یک بلاک کد را تا زمانی که یک شرط خاص برقرار است، تکرار کنیم.

 تفاوت حلقه While و حلقه For چیست؟

حلقه For شبیه حلقه While است، اما ساختار سینتکسی مختصری دارد که اغلب برای تکرار با شمارنده مناسب‌تر است.

 چگونه می‌توانیم از حلقه While برای تکرار روی آرایه‌ها یا رشته‌ها استفاده کنیم؟

برای تکرار روی آرایه‌ها یا رشته‌ها می‌توانیم از حلقه For-Of استفاده کنیم.

 چگونه می‌توانیم از دستور Break در حلقه While استفاده کنیم؟

از دستور Break برای خروج زودهنگام از حلقه While استفاده می‌کنیم.

 چگونه می‌توانیم از دستور Continue در حلقه While استفاده کنیم؟

از دستور Continue برای نادیده گرفتن اجرای فعلی حلقه While و رفتن به سراغ اجرای بعدی استفاده می‌کنیم.

کلام پایانی

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

آموزش طراحی وب سایت (Front-End)
آموزش طراحی وب سایت (Front-End)
۹۹۹,۰۰۰ ۳۹۹,۶۰۰ تومان
۶۰%

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

https://maktabkhooneh.org/mag/while-loop-in-javascript/
تصویر کامل بهرامی

کامل بهرامی

کامل بهرامی دانش‌آموخته کارشناسی ارشد رشته مهندسی کامپیوتر گرایش نرم‌افزار از دانشگاه ارومیه است. به تولید محتوا در حوزه کامپیوتر، برنامه‌نویسی و هوش مصنوعی علاقه‌مند‌ است و هم اکنون به عنوان عضو تیم سئو و مدیر تیم نویسنده‌های مکتب خونه در این مجموعه فعالیت می‌کند.
0 0 امتیازها
امتیاز دهی به محتوا
مشترک شوید
اطلاع از
guest
0 دیدگاه
قدیمی ترین
جدید ترین دیدگاه با تعداد رای زیاد
بازخورد (Feedback) های اینلاین
نمایش تمام دیدگاه ها
مقالات بیشتر
بهترین قالب‌های وردپرس رایگان

بهترین قالب های وردپرس رایگان؛ راهنمای انتخاب

بهترین قالب‌های وردپرس

بهترین قالب‌های وردپرس؛ راهنمای انتخاب حرفه‌ای‌ترین پوسته‌های فارسی

آموزش نصب درگاه پرداخت در وردپرس

راهنمای کامل نصب و اتصال درگاه پرداخت در وردپرس و ووکامرس

آموزش افزونه رنک مث برای سئو

آموزش جامع و گام‌به‌گام افزونه رنک مث (Rank Math)

راهنمای جامع انتخاب بهترین افزونه افزایش سرعت سایت وردپرس تصویر 1: بهترین افزونه افزایش سرعت وردپرس وقتی یک سایت وردپرسی دیر باز می‌شود، کاربر منتظر نمی‌ماند و همین چند ثانیه تاخیر می‌تواند تجربه کاربری و مسیر خرید را تحت تاثیر قرار دهد. انتخاب افزونه مناسب هم به نوع سایت، میزان ترافیک و زیرساخت آن بستگی دارد؛ ابزاری که برای یک فروشگاه پرترافیک مناسب است، لزوما بهترین گزینه برای یک وبلاگ سبک یا سایت شرکتی نیست. از طرفی، نصب چند افزونه قدرتمند بدون تنظیمات درست می‌تواند باعث تداخل شود. در این راهنما، بهترین افزونه‌های افزایش سرعت وردپرس را از نظر قابلیت‌ها، امکانات رایگان و پولی و کاربرد بررسی می‌کنیم تا بتوانید گزینه مناسب سایت خود را انتخاب و یک Stack بهینه برای افزایش سرعت بسازید. چرا سرعت لود سایت برای سئو و فروش شما حیاتی است؟ سرعت سایت، اولین تجربه کاربر از کیفیت یک وب‌سایت است. وقتی صفحه سریع و روان نمایش داده می‌شود، کاربر راحت‌تر به محتوا می‌رسد، صفحات بیشتری را بررسی می‌کند و مسیر خرید را با تمرکز بیشتری ادامه می‌دهد. در مقابل، تاخیر در بارگذاری می‌تواند باعث خروج زودهنگام کاربر و کاهش فرصت‌های تبدیل شود. از نگاه گوگل نیز سرعت بخشی از تجربه صفحه است و Core Web Vitals در سیستم‌های رتبه‌بندی مورد توجه قرار می‌گیرد؛ البته امتیاز خوب به‌تنهایی جایگاه برتر را تضمین نمی‌کند. بنابراین، بهینه‌سازی سرعت را باید هم‌زمان برای سئو، تجربه کاربر و افزایش فروش دنبال کرد. دسته‌بندی افزونه‌های سرعت؛ از سرویس‌های ابری تا ابزارهای تخصصی همه ابزارهای افزایش سرعت، یک کار را با یک روش انجام نمی‌دهند. بعضی راهکارها بخش عمده پردازش را به زیرساخت ابری منتقل می‌کنند و بعضی دیگر مستقیما داخل وردپرس، کش، فایل‌ها، تصاویر و کدهای سایت را بهینه می‌کنند. NitroPack نمونه‌ای از راهکارهای ابری و یکپارچه است؛ کش، بهینه‌سازی تصاویر، فشرده‌سازی کد و CDN را در زیرساخت خود مدیریت می‌کند و بخشی از بار پردازشی را از سرور سایت برمی‌دارد. در مقابل، WP Rocket یک افزونه تخصصی بهینه‌سازی وردپرس است که امکاناتی مانند Page Cache، کش مرورگر، بهینه‌سازی CSS و JavaScript، Lazy Load و Preload را مستقیما برای سایت فراهم می‌کند. دسته سوم، ابزارهای Utility هستند؛ ابزارهایی که روی یک بخش مشخص تمرکز دارند، مثل بهینه‌سازی تصاویر، CDN، کش آبجکت یا مدیریت فایل‌های CSS و JavaScript. این ابزارها زمانی ارزش بیشتری پیدا می‌کنند که بخواهید Stack سرعت سایت را دقیقا بر اساس نیاز و زیرساخت خودتان طراحی کنید. معرفی و مقایسه برترین افزونه‌های افزایش سرعت وردپرس در سال 2026 بازار افزونه‌های سرعت وردپرس چند گزینه شناخته‌شده با رویکردهای متفاوت دارد. NitroPack یک راهکار ابری و یکپارچه است که کش، بهینه‌سازی منابع و CDN را در یک سرویس ترکیب می‌کند؛ WP Rocket بیشتر بر کش و بهینه‌سازی فایل‌ها در سطح وردپرس تمرکز دارد؛ و LiteSpeed Cache زمانی بیشترین ظرفیت خود را نشان می‌دهد که سایت روی LiteSpeed یا زیرساخت سازگار با QUIC.cloud اجرا شود. NitroPack؛ راهکار یکپارچه برای کمترین درگیری فنی NitroPack بخش مهمی از فرایند بهینه‌سازی را در زیرساخت ابری خود مدیریت می‌کند و امکاناتی مانند کش، بهینه‌سازی تصاویر، بهینه‌سازی کد و CDN را کنار هم قرار می‌دهد. این رویکرد برای صاحبان سایت‌هایی جذاب است که سرعت مناسب را با تنظیمات دستی کمتر دنبال می‌کنند. WP Rocket؛ کنترل بیشتر روی بهینه‌سازی وردپرس WP Rocket مجموعه‌ای از قابلیت‌های کش، بهینه‌سازی CSS و JavaScript، Lazy Load، Preload و بهینه‌سازی Core Web Vitals را ارائه می‌دهد. ساختار آن برای کاربرانی مناسب است که یک افزونه تخصصی وردپرس می‌خواهند و ترجیح می‌دهند تنظیمات عملکرد سایت را با کنترل بیشتری مدیریت کنند. LiteSpeed Cache؛ انتخاب قدرتمند برای زیرساخت LiteSpeed LiteSpeed Cache فقط یک افزونه کش ساده نیست؛ مجموعه‌ای از قابلیت‌های کش و بهینه‌سازی را در اختیار سایت‌های وردپرسی قرار می‌دهد. قابلیت‌های کش در سطح سرور به LiteSpeed یا زیرساخت سازگار مانند QUIC.cloud وابسته‌اند، در حالی که ابزارهایی مثل بهینه‌سازی CSS و JavaScript، تصاویر و دیتابیس دامنه استفاده گسترده‌تری دارند. تصویر 2: ترکیب افزونه‌های افزایش سرعت وردپرس مقایسه سریع افزونه‌های برتر افزایش سرعت وردپرس برای مقایسه عملکرد واقعی، نرخ قبولی Core Web Vitals را بر اساس داده منتشرشده در ژانویه 2026 توسط NitroPack و مبتنی بر داده‌های بیش از 2 میلیون سایت در نظر گرفته‌ایم. این اعداد نشان‌دهنده عملکرد کل سایت‌ها در آن مجموعه داده هستند و به‌تنهایی تضمین‌کننده نتیجه یک سایت مشخص نیستند. افزونه نرخ قبولی Core Web Vitals در داده ۲۰۲۶ بهترین کاربرد مدل قیمت‌گذاری سطح تنظیمات NitroPack 54% بهینه‌سازی خودکار و سایت‌هایی که تنظیمات فنی کمتری می‌خواهند رایگان/ اشتراکی آسان WP Rocket 50% سایت‌های وردپرسی با نیاز به کنترل مناسب و تنظیمات ساده اشتراکی آسان تا متوسط LiteSpeed Cache 48% سایت‌های روی LiteSpeed و زیرساخت سازگار با QUIC.cloud رایگان متوسط تا پیشرفته Perfmatters 51% کنترل اسکریپت‌ها و بهینه‌سازی جزئیات فرانت‌اند اشتراکی متوسط WP-Optimize 46% ترکیب کش، بهینه‌سازی دیتابیس و تصاویر رایگان/ اشتراکی متوسط چگونه یک Stack مطمئن بسازیم؟ پشته افزونه‌ها زمانی کاربردی است که هر ابزار یک وظیفه مشخص داشته باشد. برای ساخت چنین ترکیبی، این سه اصل را در نظر بگیرید: • یک افزونه اصلی برای کش انتخاب کنید. دو سیستم Page Cache را هم‌زمان فعال نکنید؛ چرا که مدیریت چند لایه کش می‌تواند باعث تداخل و رفتارهای غیر قابل‌پیش‌بینی شود. • هر قابلیت را به یک ابزار بسپارید. اگر افزونه اصلی شما Minify، Lazy Load یا بهینه‌سازی CSS را انجام می‌دهد، همان قابلیت را در ابزار دوم خاموش کنید. این روش از پردازش تکراری و تداخل تنظیمات جلوگیری می‌کند. • بعد از هر تغییر، سایت را تست کنید. صفحات مهم، فرم‌ها، سبد خرید و فرایند پرداخت را بررسی کنید و سپس Core Web Vitals را دوباره بسنجید. این مرحله در سایت‌های فروشگاهی اهمیت بیشتری دارد؛ چرا که تنظیمات کش می‌تواند با محتوای پویا و شخصی‌سازی‌شده تعامل داشته باشد. در عمل، یک Stack خوب معمولا از یک ابزار اصلی کش و بهینه‌سازی + ابزارهای تخصصی برای نیازهای مشخص تشکیل می‌شود. ترکیب دقیق نیز بر اساس هاست، قالب و معماری سایت انتخاب می‌شود. نقش هاستینگ در کارایی افزونه‌های سرعت؛ آیا افزونه به‌تنهایی کافی است؟ حتی بهترین افزونه سرعت، روی یک زیرساخت ضعیف به نتیجه ایده‌آل نمی‌رسد. نوع وب‌سرور، منابع CPU و RAM، نسخه PHP، موقعیت سرور و قابلیت‌هایی مثل Server-side Cache و Object Cache مستقیما روی زمان پاسخ‌گویی سایت اثر می‌گذارند. مستندات وردپرس نیز کش سمت سرور و Object Cache را از اجزای مهم معماری بهینه‌سازی معرفی می‌کند. برای مثال، WP Rocket می‌تواند با Page Cache پردازش PHP و درخواست‌های پایگاه داده را کاهش دهد؛ اما اگر زمان پاسخ سرور همچنان بالا باشد، باید منابع و تنظیمات هاست را هم بررسی کرد. خود WP Rocket نیز تاکید می‌کند که عملکرد نهایی سایت به ظرفیت هاست و وضعیت سرور وابسته است. بنابراین قبل از نصب افزونه، زیرساخت را بشناسید: هاست مناسب + کش در سطح سرور + افزونه بهینه‌سازی متناسب با محیط اجرا، ترکیب منطقی‌تری از تکیه بر یک افزونه به‌تنهایی است. سوالات متداول درباره انتخاب بهترین افزونه بهترین افزونه افزایش سرعت وردپرس برای کاربران مبتدی کدام است؟ اگر به دنبال راهکاری هستید که بدون دانش فنی و تنها با چند کلیک بیشترین تاثیر را بگذارد، افزونه‌های NitroPack و WP Rocket بهترین‌ها هستند. این ابزارها اکثر تنظیمات بهینه‌سازی را به صورت خودکار انجام می‌دهند. آیا می‌توان چندین افزونه افزایش سرعت را همزمان نصب کرد؟ خیر؛ نصب همزمان چندین افزونه که وظایف مشابهی دارند (مانند دو افزونه کش) باعث ایجاد تداخل و خرابی در ظاهر سایت می‌شود. پیشنهاد می‌شود یک افزونه اصلی برای کش انتخاب کرده و در صورت نیاز، آن را با ابزارهای تخصصی کوچک‌تر (مانند Perfmatters برای مدیریت اسکریپت‌ها) ترکیب کنید. چرا با وجود نصب بهترین افزونه، سایت من همچنان کند است؟ افزونه‌ها نمی‌توانند مشکلات ریشه‌ای مانند هاست ضعیف، قالب‌های سنگین و غیراستاندارد یا طراحی نامناسب صفحه را به طور کامل جبران کنند. بهینه‌سازی سرعت باید از زیرساخت و هاستینگ شروع شود و افزونه‌ها به عنوان مکمل عمل کنند. تفاوت اصلی افزونه‌های رایگان و پرمیوم در چیست؟ افزونه‌های رایگان مانند WP Super Cache معمولا فقط عمل کش‌کردن را انجام می‌دهند؛ اما نسخه‌های پرمیوم قابلیت‌هایی مانند بهینه‌سازی کد و تصاویر، CSS بحرانی و اتصال به CDN را نیز در اختیار شما می‌گذارند که تاثیر مستقیم و بیشتری بر امتیاز Core Web Vitals دارند. تصویر 3: افزایش سرعت سایت وردپرس سخن پایانی؛ سرعت بیشتر، شروع یک مسیر حرفه‌ای بهترین افزونه افزایش سرعت وردپرس

راهنمای جامع انتخاب بهترین افزونه افزایش سرعت سایت وردپرس

بهترین افزونه‌های امنیت وردپرس در سال ۲۰۲۶

بهترین افزونه امنیت وردپرس؛ راهنمای جامع انتخاب و مقایسه پلاگین‌های برتر