Ένα αντικείμενο Array αντιπροσωπεύει μια συλλογή στοιχείων. Βοηθά στη διατήρηση ενός μεγάλου συνόλου δεδομένων για να αποφευχθεί η σύγχυση πολλών μεταβλητών, ταξινομώντας τες. Εάν ο χρήστης θέλει να εφαρμόσει οποιαδήποτε πρόσθετη μέθοδο και ιδιότητα στο αντικείμενο Array, δεν χρειάζεται να εφαρμόσει αυτήν τη νέα ιδιότητα/μέθοδο μία προς μία σε κάθε στοιχείο. Αντίθετα, μπορεί να γίνει αποτελεσματικά χρησιμοποιώντας τον πίνακα JavaScript ' πρωτότυπο ” κατασκευαστής. Αυτός ο κατασκευαστής βοηθά στην εφαρμογή των νέων μεθόδων και ιδιοτήτων στο επιθυμητό αντικείμενο Array.
Αυτός ο οδηγός εξηγεί τη χρήση του κατασκευαστή «πρωτότυπου» Array σε JavaScript.
Πώς να χρησιμοποιήσετε τον Κατασκευαστή «πρωτότυπου» πίνακα σε JavaScript;
Η Συστοιχία' πρωτότυπο Ο κατασκευαστής χρησιμοποιείται για την προσθήκη νέων μεθόδων και ιδιοτήτων σε ένα αντικείμενο Array με τη βοήθεια της συνάρτησης JavaScript. Εφαρμόζει την κατασκευασμένη ιδιότητα για όλες τις τιμές πίνακα, ως όνομα και τιμή από προεπιλογή.
Σύνταξη
Array.prototype.name = τιμή
Στην παραπάνω σύνταξη, ' όνομα ' καθορίζει την ιδιότητα που προστέθηκε πρόσφατα με ' αξία ' που ισχύει για ολόκληρο το αντικείμενο Array.
Ας χρησιμοποιήσουμε την ιδιότητα που ορίζεται παραπάνω πρακτικά με τη βοήθεια της σύνταξής της.
Κώδικας HTML
Αρχικά, ρίξτε μια ματιά στον αναφερόμενο κώδικα HTML:
< Π > ο 'πρωτότυπο' ο κατασκευαστής βοηθά σε την προσθήκη των νέων μεθόδων / ιδιότητες στον δεδομένο πίνακα ( ) αντικείμενο. Π >< κουμπί στο κλικ = 'jsFunc()' > Αποκτήστε κάθε μήκος χορδής κουμπί >
< Π ταυτότητα = 'δείγμα' Π >
< Π ταυτότητα = 'Για' Π >
Στις παραπάνω γραμμές κώδικα:
- Ο ' Η ετικέτα προσδιορίζει τη δήλωση παραγράφου.
- Ο ' <κουμπί> Η ετικέτα ενσωματώνει ένα κουμπί με ένα συμβάν 'onclick' για την κλήση της καθορισμένης συνάρτησης 'jsFunc()' όταν κάνετε κλικ στο κουμπί.
- Τα δύο τελευταία» Οι ετικέτες προσθέτουν κενές παραγράφους με τα αναγνωριστικά που τους έχουν εκχωρηθεί 'sample' και 'para', αντίστοιχα.
Σημείωση: Αυτός ο κώδικας HTML ακολουθείται σε όλα τα παραδείγματα που δίνονται σε αυτόν τον οδηγό.
Παράδειγμα 1: Εφαρμογή του κατασκευαστή «πρωτότυπου» για τη μέτρηση του μήκους αντικειμένου πίνακα προσθέτοντας μια νέα μέθοδο
Αυτό το παράδειγμα χρησιμοποιεί τον κατασκευαστή «πρωτότυπο» για να μετρήσει το μήκος κάθε συμβολοσειράς μέσα σε ένα αντικείμενο Array με τη βοήθεια μιας μεθόδου που προστέθηκε πρόσφατα.
Κώδικας JavaScript
Ακολουθήστε τον κώδικα JavaScript που δίνεται:
< γραφή >Array.prototype.stringLength = λειτουργία ( ) {
Για ( όπου t = 0 ; t < αυτό.μήκος? t++ ) {
Αυτό [ t ] = αυτό [ t ] .μήκος;
}
} ;
λειτουργία jsFunc ( ) {
var str = [ 'HTML' , 'CSS' , 'JavaScript' ] ;
document.getElementById ( 'δείγμα' ) .innerHTML = str;
str.stringΜήκος ( ) ;
document.getElementById ( 'Για' ) .innerHTML = str;
}
γραφή >
Στις παραπάνω γραμμές κώδικα:
- Εφαρμόστε τη βασική σύνταξη του πίνακα ' πρωτότυπο 'κατασκευαστής που προσθέτει μια νέα μέθοδο' Μήκος χορδής ” ορίζοντας μια λειτουργία.
- Στη συνέχεια, στον ορισμό της συνάρτησης, το ' Για Ο βρόχος ' επαναλαμβάνεται σε όλους τους δείκτες ενός αντικειμένου Array για να βρεθεί το μήκος τους χρησιμοποιώντας την ιδιότητα 'length'.
- Μετά από αυτό, το « jsFunc() ' ορίζει ένα αντικείμενο Array που είναι αποθηκευμένο στη μεταβλητή 'str'.
- Μετά το ' document.getElementById () Η μέθοδος ' έχει πρόσβαση στην πρώτη κενή παράγραφο μέσω του αναγνωριστικού της 'δείγμα' για να εμφανίσει το αντικείμενο Array 'str'.
- Τέλος, συσχετίστε το αντικείμενο του πίνακα 'str' με το ' StringLength() ' μέθοδος μέτρησης του μήκους συμβολοσειράς κάθε δείκτη πίνακα και στη συνέχεια προσθήκης στην επόμενη κενή παράγραφο της οποίας το αναγνωριστικό είναι 'para'.
Παραγωγή
Εδώ, η έξοδος δείχνει το μήκος κάθε συμβολοσειράς του αντικειμένου Array στόχου με τη βοήθεια της μεθόδου 'stringLength()' που προστέθηκε πρόσφατα μέσω του κατασκευαστή Array 'prototype'.
Παράδειγμα 2: Εφαρμογή του κατασκευαστή «πρωτότυπου» για τη δημιουργία μιας νέας μεθόδου «myUcase» και την εφαρμογή της σε ένα αντικείμενο πίνακα
Αυτό το παράδειγμα χρησιμοποιεί τον κατασκευαστή 'πρωτότυπο' για να δημιουργήσει μια νέα μέθοδο 'myUcase' και την εφαρμόζει στο αντικείμενο Array στόχου.
Κώδικας JavaScript
Ας δούμε τον παρακάτω κώδικα JavaScript:
< γραφή >Array.prototype.myUcase = λειτουργία ( ) {
Για ( αφήνω t = 0 ; t < αυτό.μήκος? t++ ) {
Αυτό [ t ] = αυτό [ t ] .toUpperCase ( ) ;
}
} ;
λειτουργία jsFunc ( ) {
const arrObj = [ 'html' , 'css' , 'JavaScript' , 'Αντιδρώ' ] ;
arrObj.myUcase ( ) ;
document.getElementById ( 'δείγμα' ) .innerHTML = arrObj;
}
γραφή >
Εδώ, ο κατασκευαστής 'prototype' δημιουργεί μια νέα μέθοδο με το όνομα ' myUcase ' που χρησιμοποιεί το ' Κεφάλαια ' μέθοδος στον ορισμό της συνάρτησης για τη μετατροπή κάθε συμβολοσειράς του αντικειμένου Array σε 'UpperCase'. Στην τελευταία συνάρτηση, η προσαρμοσμένη μέθοδος καλείται επίσης στον Πίνακα.
Παραγωγή
Όπως φαίνεται, κάθε συμβολοσειρά ενός αντικειμένου Array χρησιμοποιεί κεφαλαία σε ένα κλικ κουμπιού λόγω της εφαρμοσμένης μεθόδου 'myUcase()'.
συμπέρασμα
Για να χρησιμοποιήσετε τον πίνακα ' πρωτότυπο ” κατασκευαστή σε JavaScript, συσχετίστε τη νέα μέθοδο/ιδιότητα με αυτήν. Καθορίζει μια συνάρτηση που καθορίζει τις λειτουργίες για μια άλλη λειτουργία με προσαρμοσμένο τρόπο σύμφωνα με τις απαιτήσεις. Αυτός ο οδηγός εξήγησε εν συντομία τη χρήση του κατασκευαστή 'πρωτότυπου' Array σε JavaScript.