כיצד להשתמש בלולאות ב- JavaScript

Looping מאפשר לך לחזור על כל פריט במערך כך שתוכל להתאים אישית ולפלט כל אחד מהם כרצונך. כמו כל שפת תכנות, לולאות הן כלי חיוני לעיבוד מערכים ב- JavaScript.

בעזרת כמה דוגמאות מעשיות, בואו נצלול לעומק הדרכים השונות בהן תוכל להשתמש בלולאות ב- JavaScript.

ה- Incremental and Decremental for Loop ב- JavaScript

המצטבר ל לולאה היא הבסיס לאיטרציה ב- JavaScript.

הוא מניח ערך ראשוני המוקצה למשתנה ומריץ בדיקת אורך מותנה פשוטה. לאחר מכן הוא מגדיל או מפחית ערך זה באמצעות ++ אוֹ -- מפעילים.

כך נראה התחביר הכללי שלה:

עבור (var i = ערך התחלתי; i מערך [i]}

כעת בואו נחזור על מערך באמצעות תחביר הבסיס לעיל:

anArray = [1, 3, 5, 6];
עבור (תן i = 0; i console.log (anArray [i])
}
תְפוּקָה:
1
3
5
6 

כעת נפעיל על כל פריט במערך לעיל באמצעות ה- JavaScript ל לוּלָאָה:

anArray = [1, 3, 5, 6];
עבור (תן i = 0; i console.log ("5", "x", anArray [i], "=", anArray [i] * 5)
}
תְפוּקָה:
5 x 1 = 5
5 x 3 = 15
5 x 5 = 25
5 x 6 = 30 

הלולאה חוזרת במערך בהדרגה עם ++ מפעיל, מייצר תפוקה מסודרת.

אבל באמצעות השלילי (--) אופרטור, אתה יכול להפוך את הפלט.

התחביר זהה, אך ההיגיון שונה במקצת מלולאת ההגדלה לעיל.

כך פועלת השיטה ההדרגתית:

anArray = [1, 3, 5, 6];
for (let i = anArray.length-1; i> = 0; אני--) {
console.log ("5", "x", anArray [i], "=", anArray [i]*5)
}
תְפוּקָה:
5 x 6 = 30
5 x 5 = 25
5 x 3 = 15
5 x 1 = 5

ההיגיון מאחורי הקוד למעלה אינו מופרך. אינדקס מערכים מתחיל מאפס. אז מתקשרת anArray [i] בדרך כלל חוזר על עצמו ממדד אפס לשלושה מכיוון שהמערך לעיל מכיל ארבעה פריטים.

לפיכך, הסרת אחד מאורך המערך והגדרת התנאי לאפס גדול או שווה כפי שעשינו הוא די שימושי - במיוחד כאשר משתמשים במערך כבסיס לאיטרציה שלך.

הוא שומר על מדד המערך באחד פחות מאורכו. המצב i> = 0 ואז מאלץ את הספירה לעצור את הפריט האחרון במערך.

קָשׁוּר: שיטות מערך JavaScript שאתה צריך לשלוט בהן היום

JavaScript עבור כל

למרות שאי אפשר להקטין את השימוש ב- JavaScript לכל אחד, זה בדרך כלל פחות מילולי מאשר הגולמי ל לוּלָאָה. זה עובד על ידי בחירת פריט אחד אחרי השני מבלי לשנן את הקודם.

להלן התחביר הכללי של JavaScript לכל אחד:

array.forEach (element => {
פעולה
})

תסתכל איך זה עובד בפועל:

תן anArray = [1, 3, 5, 6];
anArray.forEach (x => {
console.log (x)
});
תְפוּקָה:
1
3
5
6 

כעת השתמש בזה כדי להפעיל פעולה מתמטית פשוטה על כל פריט כפי שעשית בסעיף הקודם:

תן anArray = [1, 3, 5, 6];
anArray.forEach (x => {
console.log ("5", "x", x, "=", x * 5)
});
תְפוּקָה:
5 x 1 = 5
5 x 3 = 15
5 x 5 = 25
5 x 6 = 30 

כיצד להשתמש ב- for... בלולאה של JavaScript

ה ב לולאה ב- JavaScript חוזרת דרך מערך ומחזירה את האינדקס שלה.

תמצא את זה קל לשימוש ב אם אתה מכיר Python's for loop כפי שהם דומים ביחס לפשטות ולהגיון.

תסתכל על התחביר הכללי שלה:

עבור (תן רכיב במערך) {
פעולה 
}

אז ה ב loop מקצה כל פריט במערך למשתנה (אלמנט) המוצהר בתוך הסוגריים.

לפיכך, רישום האלמנט ישירות בתוך הלולאה מחזיר אינדקס מערך ולא את הפריטים עצמם:

תן anArray = [1, 3, 5, 6];
עבור (תן לי ב- anArray) {
console.log (i)
}
תְפוּקָה:
0
1
2
3 

כדי להוציא כל פריט במקום זאת:

תן anArray = [1, 3, 5, 6];
עבור (תן לי ב- anArray) {
console.log (anArray [i])
}
תְפוּקָה:
1
3
5
6 

כמו שעשית בעת שימוש בלולאה ההדרגתית, קל גם להפוך את הפלט באמצעות ב:

תן anArray = [1, 3, 5, 6];
// הסר אחד מאורך המערך והקצה אותו למשתנה:
תן v = anArray.length - 1; 
// השתמש במשתנה לעיל כבסיס אינדקס תוך איטרציה במערך:
עבור (תן לי ב- anArray) {
console.log (anArray [v])
v -= 1;
}
תְפוּקָה:
6
5
3
1 

הקוד לעיל דומה לוגית למה שעשית בעת השימוש בלולאה ההדרגתית. זה יותר קריא ומתואר במפורש.

JavaScript עבור... של לולאה

ה בשביל לולאה דומה ל ב לוּלָאָה.

עם זאת, שלא כמו ב, הוא אינו חוזר על מדד המערך אלא על הפריטים עצמם.

התחביר הכללי שלה נראה כך:

עבור (תן לי של מערך) {
פעולה 
}

בואו נשתמש בשיטת לולאה זו כדי לחזור על מערך בהדרגה כדי לראות כיצד היא פועלת:

תן anArray = [1, 3, 5, 6];
עבור (תן לי של anArray) {
console.log (i)
}
תְפוּקָה:
1
3
5
6 

אתה יכול גם להשתמש בשיטה זו כדי לחזור על המערך ולהפוך את הפלט. זה דומה לאופן שבו אתה עושה את זה באמצעות ב:

תן anArray = [1, 3, 5, 6];
תן v = anArray.length - 1;
עבור (תן x של anArray) {
console.log (anArray [v])
v -= 1;
}
תְפוּקָה:
6
5
3
1

כדי לפעול בתוך הלולאה:

תן anArray = [1, 3, 5, 6];
תן v = anArray.length - 1;
עבור (תן x של anArray) {
console.log ("5", "x", anArray [v], "=", anArray [v] * 5)
v -= 1;
}
תְפוּקָה:
5 x 6 = 30
5 x 5 = 25
5 x 3 = 15
5 x 1 = 5 

לולאת ה- While

ה בזמן לולאה פועלת ברציפות כל עוד תנאי שצוין נשאר נכון. הוא משמש לעתים קרובות כלולאה אינסופית.

לדוגמה, מכיוון שאפס הוא תמיד פחות מעשרה, הקוד שלהלן פועל ברציפות:

תן i = 0;
בעוד (i <10) {
console.log (4)
}

הקוד הנ"ל רושם "4" אינסופית.

בואו לחזור על מערך באמצעות בזמן לוּלָאָה:

תן i = 0;
while (i console.log (anArray [i])
i += 1
}
תְפוּקָה:
1
3
5
6 

JavaScript עושה... בעוד לולאה

ה עושה תוך כדי לולאה מקבלת ומבצעת קבוצת פעולות במפורש בתוך א לַעֲשׂוֹת תחביר. לאחר מכן הוא מציין את התנאי לפעולה זו בתוך בזמן לוּלָאָה.

כך זה נראה:

לַעֲשׂוֹת{
פעולות
}
בזמן (
הסכמה
)

עכשיו בואו נחזור על מערך בשיטת לולאה זו:

לַעֲשׂוֹת{
console.log (anArray [i])
i += 1
}
בזמן (
i )
תְפוּקָה:
1
3
5
6 

הכירו את עצמכם עם לולאות JavaScript

למרות שהדגשנו כאן את שיטות הלולאה השונות של JavaScript, שליטה ביסודות האיטרציה בתכנות מאפשרת לך להשתמש בהן בגמישות ובביטחון בתוכניות שלך. עם זאת, רוב לולאות ה- JavaScript האלה פועלות באותה הדרך, עם הבדלים ספורים במתאר הכללי ובתחביר שלהן.

לולאות, לעומת זאת, הן הבסיס לרוב העיבוד של מערך צד הלקוח. אז אל תהסס לשנות את שיטות הלולאה האלה כרצונך. השימוש בהם עם מערכים מורכבים יותר, למשל, נותן לך הבנה טובה יותר של לולאות JavaScript.

כיצד להשתמש בהצהרת ה- if-else של JavaScript

הצהרת if-else היא הצעד הראשון שלך לקראת התכנות של ההיגיון ביישומים שלך.

קרא הבא

על הסופר