Αυτή η ανάρτηση θα εξηγήσει τη διαδικασία σχηματισμού ενός πίνακα με μια σειρά αντικειμένων στο JavaScript.
Πώς να δημιουργήσετε πίνακα από μια σειρά αντικειμένων σε JavaScript;
Για να δημιουργήσουμε έναν πίνακα από έναν πίνακα αντικειμένων, θα χρησιμοποιήσουμε τις ακόλουθες μεθόδους:
Ας εξερευνήσουμε κάθε μέθοδο μία προς μία!
Μέθοδος 1: Δημιουργία πίνακα από μια σειρά αντικειμένων χρησιμοποιώντας συμβολοσειρά πίνακα HTML σε JavaScript
Στη JavaScript, ο σκοπός ενός ' σειρά ” είναι η αποθήκευση κειμένου, αριθμών ή ειδικών συμβόλων. Οι συμβολοσειρές ορίζονται κλείνοντας έναν χαρακτήρα ή μια ομάδα χαρακτήρων σε διπλά ή μονά εισαγωγικά. Πιο συγκεκριμένα, χρησιμοποιούνται και για τη δημιουργία πινάκων.
Ας πάρουμε ένα παράδειγμα για να έχουμε μια σαφή ιδέα σχετικά με τη δημιουργία ενός πίνακα από έναν πίνακα αντικειμένων χρησιμοποιώντας τη συμβολοσειρά Table.
Παράδειγμα
Στο παράδειγμά μας, θα χρησιμοποιήσουμε ένα ' Ας δηλώσουμε ένα « πίνακας ” και αντιστοιχίστε μερικές τιμές σε αυτό: Αρχικοποιήστε μια μεταβλητή ' Τραπέζι ” για να αποθηκεύσετε τη συμβολοσειρά του πίνακα HTML: Καθορίστε τα δύο κελιά ανά σειρά ορίζοντας την τιμή ' δύο ' απο ' κύτταρα ' μεταβλητή: Στη συνέχεια, χρησιμοποιήστε το ' array.for Every() ' μέθοδος για να περάσει κάθε στοιχείο πίνακα από τη συνάρτηση. Στη συνέχεια, ορίστε το ' {αξία} 'με αναγνωριστικό' $ ' μέσα στο ' Αντιστοιχίστε τις ετικέτες κλεισίματος πίνακα στη μεταβλητή ' Τραπέζι ' χρησιμοποιώντας το ' += ' χειριστής. Στη συνέχεια, συνδέστε το περιεχόμενο του Πίνακα με το κοντέινερ που δημιουργήθηκε χρησιμοποιώντας το κοντέινερ του. Για αυτό, χρησιμοποιήστε το ' υποτίμηση() ' μέθοδο και περάστε του το αναγνωριστικό και τοποθετήστε το εσωτερικό HTML για να ορίσετε τις τιμές μέσα στη μεταβλητή Πίνακας: Στο αρχείο μας CSS , θα εφαρμόσουμε ορισμένες ιδιότητες στον πίνακα και τα κελιά δεδομένων του. Για να το κάνουμε αυτό, θα ορίσουμε το ' σύνορο “ακίνητο με την αξία” 1 px στερεό ' για να ορίσετε το περίγραμμα γύρω από τον πίνακα και τα κελιά του και το ' υλικό παραγεμίσματος “ακίνητο με την αξία” 3 εικονοστοιχεία ” για να δημιουργήσετε τον καθορισμένο χώρο γύρω από το περιεχόμενο του στοιχείου, σύμφωνα με το καθορισμένο περίγραμμα: Αποθηκεύστε τον δεδομένο κώδικα, ανοίξτε το αρχείο HTML και προβάλετε τον πίνακα με τα αντικείμενα ενός πίνακα: Ας εξερευνήσουμε μια ακόμη μέθοδο για τη δημιουργία ενός πίνακα από μια σειρά αντικειμένων στο JavaScript. Ο ' χάρτης() Η μέθοδος », εφαρμόζει μια συγκεκριμένη συνάρτηση σε κάθε στοιχείο του πίνακα, και σε αντάλλαγμα, παρέχει έναν νέο πίνακα. Ωστόσο, αυτή η μέθοδος δεν κάνει καμία αντικατάσταση στον αρχικό πίνακα. Μπορείτε επίσης να χρησιμοποιήσετε τη μέθοδο map() για να σχηματίσετε έναν πίνακα με έναν πίνακα αντικειμένων. Ας δημιουργήσουμε έναν πίνακα χρησιμοποιώντας το ' αφήνω » λέξη-κλειδί. Εκχωρήστε ορισμένες τιμές στις ιδιότητες ή τα κλειδιά του αντικειμένου: Αποκτήστε πρόσβαση στο ήδη δημιουργημένο κοντέινερ χρησιμοποιώντας τη μέθοδο belittlement() και χρησιμοποιήστε το ' insertAdjacentHTML() ' μέθοδος προσθήκης ετικετών πίνακα: Χρησιμοποιήστε το ' Object.keys() ' μέθοδος για πρόσβαση στα κλειδιά του καθορισμένου αντικειμένου και στη συνέχεια χρησιμοποιήστε το ' Συμμετοχή() ' μέθοδος για να τα τοποθετήσετε ως επικεφαλίδες εντός του ' Αφού προσθέσουμε την ετικέτα κλεισίματος της κεφαλής πίνακα και τη γραμμή πίνακα και την ετικέτα ανοίγματος δεδομένων, θα χρησιμοποιήσουμε το ' χάρτης() ' μέθοδος για να καλέσετε το ' Object.values() Συνάρτηση μεθόδου για κάθε τιμή των κλειδιών αντικειμένου και, στη συνέχεια, χρησιμοποιήστε το Συμμετοχή() ” μέθοδος για να τα τοποθετήσετε σε μια σειρά και να μετακινηθείτε στην επόμενη: Όπως μπορείτε να δείτε, δημιουργήσαμε με επιτυχία πίνακα από τον καθορισμένο πίνακα αντικειμένων: Καλύψαμε τους αποτελεσματικούς τρόπους δημιουργίας πίνακα από μια σειρά αντικειμένων στο JavaScript. Στη JavaScript, για το σχηματισμό ενός πίνακα από έναν πίνακα αντικειμένων, το HTML ' τραπέζι 'χορδή ή ' χάρτης() Η μέθοδος μπορεί να χρησιμοποιηθεί. Για να το κάνετε αυτό, καθορίστε μια ετικέτα div με ένα αναγνωριστικό. Στη συνέχεια, δηλώστε τη διάταξη των αντικειμένων και στις δύο μεθόδους, αποθηκεύστε ετικέτες πίνακα μέσα σε μεταβλητές ή επιστρέψτε τις απευθείας σε ένα συνδεδεμένο στοιχείο HTML με δεδομένα. Αυτή η ανάρτηση έχει συζητήσει τη μέθοδο για τη δημιουργία ενός πίνακα από έναν πίνακα αντικειμένων χρησιμοποιώντας JavaScript.
ήταν συστοιχία = [ 'Σημάδι' , 'Σπουργίτης' , 'Ψάρι' , 'Πορτοκάλι' ] ;
' ; ' ;
ετικέτα '. Στη συνέχεια, δηλώστε μια μεταβλητή ' ένα ' για να προσθέσετε σε αύξηση το ευρετήριο ' Εγώ ' και καθορίστε ένα ' αν ' συνθήκη με τέτοιο τρόπο ώστε αν οι υπόλοιπες τιμές των κελιών και η μεταβλητή που δημιουργήθηκε είναι ίσο με μηδέν και η τιμή ' ένα Το ” δεν είναι ίσο με το μήκος του πίνακα, μετά σπάστε στην επόμενη γραμμή ή σειρά του πίνακα: πίνακας. Για Καθε ( ( αξία, θ ) => {
Τραπέζι += ` < TD > $ { αξία } TD > ` ;
υπάρχει ένα = Εγώ + 1 ;
αν ( ένα % κύτταρα == 0 && ένα != πίνακας. μήκος ) {
Τραπέζι += '' ;
} } ) ;
έγγραφο. υποτίμηση ( 'δοχείο' ) . εσωτερικός HTML = Τραπέζι ;
σύνορο : 1 px στερεό ;
υλικό παραγεμίσματος : 3 εικονοστοιχεία ;
}
Μέθοδος 2: Δημιουργία πίνακα από έναν πίνακα αντικειμένων χρησιμοποιώντας τη μέθοδο map() σε JavaScript
Παράδειγμα
{ 'Ονομα' : 'Σημάδι' , 'Ηλικία' : 'Είκοσι (20)' } ,
{ 'Ονομα' : 'Τι εγώ' , 'Ηλικία' : 'Τριάντα (30)' } ]
` < τραπέζι >< tr >< ου >
Ετικέτα ': $ { Αντικείμενο . κλειδιά ( πίνακας [ 0 ] ) . Συμμετοχή ( ' ' ) }
. Συμμετοχή ( '' ) ) . Συμμετοχή ( ' ' ) } τραπέζι > ` )
συμπέρασμα