אובייקט מערך מייצג אוסף של אלמנטים. זה עוזר בשמירה על סט גדול של נתונים כדי למנוע בלבול של משתנים מרובים, ובכך למיין אותם. אם המשתמש רוצה להחיל כל שיטה ומאפיין נוספים על אובייקט המערך, הוא לא צריך להחיל את המאפיין/שיטה החדשים בזה אחר זה על כל אלמנט. במקום זאת, ניתן לעשות זאת ביעילות על ידי שימוש במערך JavaScript ' אב טיפוס 'קונסטרוקטור. בנאי זה עוזר ביישום השיטות והמאפיינים החדשים על אובייקט המערך הרצוי.
מדריך זה מסביר את השימוש בבנאי 'אב-טיפוס' של מערך ב-JavaScript.
כיצד להשתמש בבנאי 'אב-טיפוס' של מערך ב-JavaScript?
המערך' אב טיפוס הקונסטרוקטור משמש להוספת שיטות ומאפיינים חדשים לאובייקט Array בעזרת פונקציית JavaScript. הוא מחיל את המאפיין שנבנה עבור כל ערכי המערך, כשמו והערך שלו כברירת מחדל.
תחביר
Array.prototype.name = ערך
בתחביר לעיל, ' שֵׁם ' מציין את המאפיין החדש שנוסף עם ' ערך ' שחל על כל אובייקט המערך.
בואו נשתמש במאפיין שהוגדר לעיל באופן מעשי בעזרת התחביר שלו.
קוד HTML
ראשית, עיין בקוד ה-HTML המוצהר:
< ע > ה 'אב טיפוס' הקונסטרוקטור עוזר ב הוספת השיטות החדשות / מאפיינים למערך הנתון ( ) לְהִתְנַגֵד. ע >< לַחְצָן בלחיצה = 'jsFunc()' > קבל כל אורך מיתר לַחְצָן >
< ע תְעוּדַת זֶהוּת = 'לִטעוֹם' > ע >
< ע תְעוּדַת זֶהוּת = 'ל' > ע >
בשורות הקוד לעיל:
- ה ' ' תג מציין את הצהרת הפסקה.
- ה ' <כפתור> ' תג מטמיע כפתור עם אירוע 'onclick' כדי להפעיל את הפונקציה שצוינה 'jsFunc()' בלחיצת כפתור.
- השניים האחרונים ' תגיות ' מוסיפות פסקאות ריקות עם המזהים שהוקצו להן 'דוגמא' ו-'para', בהתאמה.
הערה: קוד HTML זה מלווה בכל הדוגמאות המפורטות במדריך זה.
דוגמה 1: החלת קונסטרוקטור 'אב הטיפוס' לספירת אורך אובייקט המערך על ידי הוספת שיטה חדשה
דוגמה זו משתמשת בבנאי 'אב הטיפוס' כדי לספור את אורך כל מחרוזת בתוך אובייקט Array בעזרת שיטה חדשה שנוספה.
קוד JavaScript
עקוב אחר קוד ה-JavaScript הנתון:
< תַסרִיט >Array.prototype.stringLength = פוּנקצִיָה ( ) {
ל ( כאשר t = 0 ; ט < this.length; t++ ) {
זֶה [ ט ] = זה [ ט ] .אורך;
}
} ;
פוּנקצִיָה jsFunc ( ) {
var str = [ 'HTML' , 'CSS' , 'JavaScript' ] ;
document.getElementById ( 'לִטעוֹם' ) .innerHTML = str;
str.stringLength ( ) ;
document.getElementById ( 'ל' ) .innerHTML = str;
}
תַסרִיט >
בשורות הקוד לעיל:
- החל את התחביר הבסיסי של המערך ' אב טיפוס 'קונסטרוקטור שמוסיף שיטה חדשה' אורך המחרוזת ' הגדרת פונקציה.
- לאחר מכן, בהגדרת הפונקציה, ' ל לולאה חוזרת על כל המדדים של אובייקט מערך כדי למצוא את אורכם באמצעות המאפיין 'אורך'.
- לאחר מכן, ה' jsFunc() ' מגדיר אובייקט Array המאוחסן במשתנה 'str'.
- אז ה ' document.getElementById () שיטת ' ניגשת לפסקה הריקה הראשונה דרך המזהה שלה 'דגימה' כדי להציג את אובייקט המערך 'str'.
- לבסוף, שייך את אובייקט מערך 'str' ל-' אורך המחרוזת() ' שיטה לספור את אורך המחרוזת של כל אינדקס מערך ולאחר מכן לצרף אותו לפסקה הריקה הבאה שהמזהה שלה הוא 'para'.
תְפוּקָה
כאן, הפלט מציג את האורך של כל מחרוזת של אובייקט המערך של המטרה בעזרת שיטת 'stringLength()' החדשה שנוספה באמצעות בנאי 'אב-טיפוס' של מערך.
דוגמה 2: החלת קונסטרוקטור 'אב הטיפוס' ליצירת שיטה חדשה 'myUcase' והחלתה על אובייקט מערך
דוגמה זו משתמשת בבנאי 'אב-טיפוס' כדי ליצור שיטה חדשה של 'myUcase' ומחילה אותה על אובייקט המערך של המטרה.
קוד JavaScript
בוא נעבור על קוד ה-JavaScript שצוין להלן:
< תַסרִיט >Array.prototype.myUcase = פוּנקצִיָה ( ) {
ל ( לתת t = 0 ; ט < this.length; t++ ) {
זֶה [ ט ] = זה [ ט ] .toUpperCase ( ) ;
}
} ;
פוּנקצִיָה jsFunc ( ) {
const arrObj = [ 'html' , 'CSS' , 'JavaScript' , 'לְהָגִיב' ] ;
arrObj.myUcase ( ) ;
document.getElementById ( 'לִטעוֹם' ) .innerHTML = arrObj;
}
תַסרִיט >
כאן, בנאי 'אב הטיפוס' יוצר שיטה חדשה בשם ' myUcase 'שמשתמש ב-' אותיות גדולות ' שיטה בהגדרת הפונקציה כדי להמיר כל מחרוזת של אובייקט המערך ל- 'UpperCase'. בפונקציה האחרונה, השיטה המותאמת אישית מופעלת גם על המערך.
תְפוּקָה
כפי שניתן לראות, כל מחרוזת של אובייקט Array מנצלת לחיצת כפתור עקב שיטת 'myUcase()' המיושמת.
סיכום
כדי להשתמש במערך ' אב טיפוס 'קונסטרוקטור ב-JavaScript, שייך אליו את השיטה/המאפיין החדשים. הוא מציין פונקציה המגדירה את הפונקציונליות עבור פונקציה אחרת באופן מותאם אישית לפי הדרישות. מדריך זה הסביר בקצרה את השימוש בבנאי 'אב-טיפוס' של Array ב-JavaScript.