Menu
Coddy logo textTech

ייבוא באמצעות import

חלק מהיחידה תכנות מונחה עצמים במסלול ה-JavaScript של Coddy. שיעור 9 מתוך 56.

לאחר ייצוא של פונקציונליות ממודול, עלינו לייבא אותה כדי להשתמש בה בקובץ אחר. פקודת import מאפשרת לנו לייבא ערכים שיוצאו ממודולים אחרים.

ייבוא של ייצוא בעל שם:

// ייבוא פונקציה מסוימת ממודול
import { greet } from './greeting.js';

// כעת אפשר להשתמש בפונקציה greet
greet('John'); // פלט: Hello, John!

אפשר לייבא כמה ייצואים בעלי שם בבת אחת:

// ייבוא של כמה פריטים מיוצאים
import { greet, farewell } from './greeting.js';

greet('John');      // פלט: Hello, John!
farewell('John');   // פלט: Goodbye, John!

ייבוא של ייצוא ברירת מחדל:

// ייבוא של ייצוא ברירת מחדל (אין צורך בסוגריים מסולסלים)
// השתמשו בזה כאשר בקובץ האחר מופיע: export default functionName
import Person from './person.js';

// צרו Person חדש
const john = new Person('John');
challenge icon

אתגר

קל

אתה בונה טופס הרשמה. יש לך קובץ validation-utils.js שמכיל פונקציות שימושיות לאימות כתובות דוא״ל.

המשימה שלך:

  1. ייבא את הפונקציה validateEmail בקובץ main.js (זהו ייצוא בשם, לא ייצוא ברירת המחדל)
  2. קרא לפונקציה והעבר לה את כתובת הדוא״ל user@example.com
  3. הדפס את התוצאות באמצעות console.log

נסו בעצמכם

// TODO: ייבאו כאן את הפונקציה validateEmail (זהו ייצוא בשם)

// TODO: קראו לפונקציה, העבירו לה את כתובת האימייל user@example.com והדפיסו את התוצאות באמצעות console.log
quiz iconבחנו את עצמכם

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

כל השיעורים ביחידה תכנות מונחה עצמים

תרגלו בעצמכם: קומפיילר JavaScript אונליין