כיצד פועל היקף ב-JavaScript

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

ב-JavaScript, משתנים, אובייקטים ופונקציות יכולים להיות בעלי היקף גלובלי, היקף מודול, היקף בלוק או היקף פונקציות.

היקף גלובלי ב-JavaScript

לכל ערך שהוכרז מחוץ לפונקציה או בלוק בסקריפט יש היקף גלובלי וכל קובץ סקריפט אחר בתוכנית שלך יכול לגשת אליו.

לדוגמה, הכרזה על משתנה גלובלי בקובץ אחד:

// index.js
תן globalVariable = "ערך כלשהו"

פירוש הדבר שכל סקריפט אחר בתוכנית שלך יכול לגשת אליו:

// otherScript.js
לְנַחֵם‎.log (globalVariable) // ערך כלשהו

הצהרת משתני JavaScript בהיקף הגלובלי הוא נוהג רע מכיוון שהוא יכול להוביל לזיהום מרחב השמות. מרחב השמות הגלובלי הוא המרחב העליון של Javascript המכיל את המשתנים, האובייקטים והפונקציות. בדפדפן, הוא מתחבר ל- חַלוֹן אובייקט, בעוד ש-NodeJS משתמש באובייקט בשם גלוֹבָּלִי.

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

היקף מודול

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

מודולי ES פורמליים דפוס מודול JavaScript ב-JavaScript ב-2015.

משתנים שאתה מצהיר במודול מתמקדים במודול זה, כלומר אף חלק אחר של התוכנית לא יכול לגשת אליהם.

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

הנה דוגמה שמראה ייצוא של מחלקה:

// index.js
יְצוּאמעמדפו{
בַּנַאִי(נכס_1, נכס_2) {
זֶה‎.property_1 = property_1
זֶה.property_2 = property_2
 }
}

וכך תוכל לייבא את המודול הזה ולהשתמש בנכס שהוא מייצא:

// someModule.js
יְבוּא { פו } מ './index.js'
const bar = new Foo('פו', 'בָּר')
לְנַחֵם‎.log (bar.property_1) // פו

קבצים אינם מוכרזים כמודולים כברירת מחדל ב-JavaScript.

ב-JavaScript בצד הלקוח, אתה יכול להכריז על סקריפט כמודול על ידי הגדרת ה- סוּג מייחס ל מודול על תַסרִיט תָג:

<סוג סקריפט="מודול" src="index.js"></script>

ב-NodeJS, אתה יכול להכריז על סקריפט כמודול על ידי הגדרת ה סוּג רכוש ל מודול אצלך package.json קוֹבֶץ:

{
"סוּג": "מודול"
}

בלוק סקופ

בלוק ב-JavaScript הוא המקום שבו מתחילים ומסיימים זוג פלטה מתולתלת.

משתנים המוצהרים בתוך בלוק עם ה- תן, ו const מילות המפתח הן בהיקף של הבלוק הזה, כלומר אינך יכול לגשת אליהן מחוץ לו. היקף זה אינו חל על משתנים המוצהרים באמצעות ה- var מילת מפתח:

{ // תחילת הבלוק
 const one = '1'
 תן שני = '2'
 var three = '3'
} // סוף בלוק
לְנַחֵם.log (אחד) // זורק שגיאה
לְנַחֵם.log (שלושה) // "3"

המשתנים הכלולים בבלוק למעלה ומוצהרים כ-const או let נגישים רק בתוך הבלוק. עם זאת, אתה יכול לגשת למשתנה המוצהר באמצעות ה- var מילת מפתח מחוץ לבלוק.

היקף פונקציה

משתנים המוצהרים בתוך פונקציה מכונים בדרך כלל משתנים מקומיים והם בהיקף של הפונקציה. אתה לא יכול לגשת אליהם מחוץ לפונקציה. היקף זה חל על משתנים המוצהרים עם ה- var, תן, ו const מילות מפתח.

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

לדוגמה:

פוּנקצִיָהלְהַכפִּיל() {
תן אחד = 1
var שני = 2
const שלוש = 3
לַחֲזוֹר אחת שתיים שלוש
}
// הצללה משתנה
const שלוש = 'שלוש' // לא זורק שגיאה

הבנה של כללי היקף היא חיונית

הבנה של ההיקפים הזמינים ב-JavaScript מקלה עליך להימנע משגיאות. ניסיון לגשת למשתנה שאינו זמין בהיקף מסוים הוא מקור בשל לבאגים.

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