שאלה של מתחיל (js)

[גמליאל]

בפרוייקט שלי אני משתמש בפונקציות בנאי כדי ליצור כמה סוגים של אלמנטים בדף html (באמצעות innerHTML).
בכל אחד מהבנאים אני משתמש מספר פעמים בדף.
כיצד אני יכול לקבוע id ייחודי לכל אחד מהאלמנטים, גם עבור אלמנטים שנוצרו מאותו בנאי?

[dovid]

אתה יכול לעשות משתנה בסוג במקום במופע, למשל myClass.idCounter ולעלות את ערכו כל פעם באחד:

 el.id  = myClass.cidCounter++;

אם לא אכפת לך כללי ספר תוכל גם לשים במשתנה גלובלי סתם.

אבל בדרך כלל שמים id מתאים לסיבת יצירת האלמנט, למשל אם זה יצירה בשביל אוסף מוצרים שמים בכל אלמנט בid את שם המוצר או משהו כזה.

[dovid]

יש לציין שבד"כ אין צורך לשים id למטרות תכנות (אבל כן למטרות סגנון) כי אפשר לאגד את האירועים לאלמנט מייד אחרי יצירתו.

[גמליאל]

@dovid אמר בשאלה של מתחיל (js):

אתה יכול לעשות משתנה בסוג במקום במופע, למשל myClass.idCounter ולעלות את ערכו כל פעם באחד

אם הבנתי אותך נכון, אתה מתכוון שאפעיל מונה על כל שימוש בבנאי, ואשלב את המונה בId.
חשבתי על זה, אבל הסתבכתי עם התחביר.
בבנאי הוספתי:

this.count++;

אבל בפועל הוא מחזיר לי undefined.
אשמח שתסביר לי את התחביר המדוייק.
(הדגשתי בכותרת שאני מתחיל כדי שלא תופתעו מאי הבנות מינימליות).

@dovid אמר בשאלה של מתחיל (js):

יש לציין שבד"כ אין צורך לשים id למטרות תכנות (אבל כן למטרות סגנון) כי אפשר לאגד את האירועים לאלמנט מייד אחרי יצירתו.

אשמח להסבר/לינק להסבר

ובהזדמנות זו תודה על הפורום

[dovid]

@גמליאל לא, לא בthis (כי כל פעם זה מופע חדש). אלא בשם המחלקה/הפונקציה (שזה לא פר מופע אלא גלובלי לאפליקציה).
למשל

elementCreator.idCounter = 0;
function elementCreator(){ 
    ...
    el.id = elementCreator.idCounter++;
    ...
    
}

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

el.addEventListener('click', funcName);

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

el.addEventListener('click', function() { funcName(currData); } );