Πίνακας περιεχομένων[Κρύβω][Προβολή]
- 1. Βελτιώστε τις βασικές σας γνώσεις
- 2. Χρησιμοποιήστε μια αντικειμενοστραφή στρατηγική
- 3. Χρησιμοποιήστε τις λειτουργίες ακόμα κι αν είναι μικρές
- 4. Αντί για ==, χρησιμοποιήστε ===
- 5. Χρησιμοποιήστε το JSLint
- 6. Τα σενάρια πρέπει να τοποθετούνται στο κάτω μέρος της σελίδας σας
- 7. Ο πιο γρήγορος τρόπος για να φτιάξετε μια χορδή
- 8. Προσθέστε ένα σχόλιο στον κώδικά σας
- 9. Χρησιμοποιήστε τα Template Literals
- 10. Iterators και για … των Loops
- 11. Χρησιμοποιήστε το {} Αντί για το νέο αντικείμενο()
- 12. Σκεφτείτε να βάλετε let και const στον κώδικά σας
- 13. Το eval() δεν είναι καλή ιδέα
- 14. Ο χειριστής Spread είναι χρήσιμος
- 15. αναμονή και ασυγχρονισμός
- 16. Χρησιμοποιήστε τη μέθοδο include() στο Javascript
- 17. Αφαιρέστε στοιχεία από έναν πίνακα χρησιμοποιώντας το Splice
- 18. Κάντε χρήση της συνάρτησης βέλους
- 19. Με το Destructuring, μπορείτε να εκχωρήσετε γρήγορα τιμές μεταβλητών
- 20. Κάντε πολλά έργα
- Συμπέρασμα
Αν σας ενδιέφερε ποτέ η ανάπτυξη ιστού, πιθανότατα έχετε συναντήσει JavaScript. Μια αντικειμενοστραφής γλώσσα προγραμματισμού είναι η JavaScript. Οι προγραμματιστές το χρησιμοποιούν για να κάνουν τις ιστοσελίδες από την πλευρά του πελάτη (front end) δυναμικές και διαδραστικές.
Χρησιμοποιείται επίσης για τη δημιουργία ιστοσελίδων και εφαρμογών ιστού, με HTML και CSS. Σήμερα δεν υπάρχει ιστοσελίδα στο διαδίκτυο που να μην έχει κώδικα JavaScript. Έχει γίνει μια αναπόσπαστη πτυχή της δουλειάς ενός προγραμματιστή.
Πράγματι, αυξάνεται σταθερά. Αν και η JavaScript αναγνωρίζεται καλύτερα για την παροχή λειτουργικότητας σε ιστοσελίδες, χρησιμοποιείται επίσης σε περιβάλλοντα που δεν είναι JavaScript. Τα Node.js, Apache Couch-DB και Adobe Acrobat είναι παραδείγματα αυτών των τεχνολογιών. Για την εκτέλεση JavaScript, τα περισσότερα σύγχρονα προγράμματα περιήγησης ιστού περιέχουν μια ενσωματωμένη μηχανή εκτέλεσης JavaScript. Εάν θέλετε να είστε επιτυχημένος προγραμματιστής ιστού, θα πρέπει να ασχοληθείτε με το JavaScript.
Πρέπει να το αντιμετωπίσετε σήμερα ή αύριο. Γιατί να μην μάθετε JavaScript εκ των προτέρων, ώστε να είστε προετοιμασμένοι όταν έρθει η ώρα;
Αυτό θα μάθετε σε αυτή τη συνεδρία. Εξηγεί πώς να παραμείνετε ένα βήμα μπροστά από τους συναδέλφους σας προγραμματιστές ιστού γυαλίζοντας το JavaScript σας.
Ας ξεκινήσουμε!
1. Βελτιώστε τις βασικές σας γνώσεις
Θα ξεκινήσω με μια πραγματικά βασική σκέψη και δήλωση που έχετε ακούσει από τότε που ήσασταν νέος. Μάθετε τα βασικά και εφαρμόστε τα στην πράξη. Πολλές φορές, θα εφαρμόζετε τη λογική με την κωδικοποίηση, αλλά θα ξεχνάτε ότι υπάρχει ήδη μια ενσωματωμένη συνάρτηση για αυτήν, όπως η κοπή ενός πίνακα. Όταν εκτελείτε τον κώδικα JavaScript, μπορείτε να λάβετε ένα σφάλμα και ως αποτέλεσμα, πολλές πρόσθετες λειτουργίες σταματούν να λειτουργούν.
Αυτό μπορεί να προκληθεί από μία άνω τελεία ή από ανεστραμμένα κόμματα. Αυτά τα πράγματα συμβαίνουν ως αποτέλεσμα της έλλειψης κατανόησης των θεμελιωδών. Πολλές φορές σε ένα μεμονωμένο πρόγραμμα χρησιμοποιείται ένας βασικός βρόχος όπως for, which, ή do while. Οι βρόχοι είναι μια από τις πιο θεμελιώδεις δομές προγραμματισμού.
Είναι αρκετά δύσκολο να κωδικοποιήσετε και ακόμη και να έχετε την ευκαιρία να εργαστείτε για μια εταιρεία εάν δεν είστε εξοικειωμένοι με το looping και άλλα βασικά στοιχεία. Η αναβάθμιση των βασικών σας στοιχείων είναι κρίσιμης σημασίας, καθώς παρέχουν μια σταθερή βάση πάνω στην οποία μπορείτε να αναπτύξετε την περίπλοκη λογική και τη φήμη μιας λύσης.
2. Χρησιμοποιήστε μια αντικειμενοστραφή στρατηγική
Η αντικειμενοστραφής μέθοδος είναι η πιο γνωστή προγραμματιστική προσέγγιση σήμερα. Η αντικειμενοστραφή προσέγγιση, η οποία ξεκίνησε με τη C++, έχει αυξηθεί σε τεράστια δημοτικότητα από τότε. Σήμερα, μόνο αντικειμενοστραφής προγραμματισμός χρησιμοποιείται για τη δημιουργία όλων των κύριων γλωσσών. Μια αντικειμενοστραφή στρατηγική είναι αυτή που εστιάζει σε ένα συγκεκριμένο αντικείμενο.
Στη συνέχεια, το στοιχείο γίνεται θεμελιώδης οντότητα. Αυτό το αντικείμενο χρησιμοποιείται στη συνέχεια για την προσθήκη χαρακτηριστικών και συναρτήσεων στη σελίδα ως βάση. Μπορείτε επίσης να χρησιμοποιήσετε την παραδοσιακή μέθοδο δημιουργίας κώδικα από πάνω προς τα κάτω χωρίς συναρτήσεις ή αντικείμενα. Αυτό είναι πολύ εκτεταμένο και δεν πρέπει ποτέ να επιχειρηθεί. Κατά την ανάπτυξη κώδικα, θα πρέπει να χρησιμοποιούμε μια λειτουργική προσέγγιση και εάν χρησιμοποιούμε συναρτήσεις, θα πρέπει να χρησιμοποιούμε αντικείμενα.
Έτσι, στην αρχή, προσπαθήστε να μετατρέψετε τον εκτεταμένο κώδικά σας σε αντικειμενοστραφή κώδικα και πάντα να γράφετε τον κώδικά σας σε αντικειμενοστραφή στυλ. Όταν μελετάτε τον κώδικα άλλων ανθρώπων, θα εξετάζετε συνεχώς αντικειμενοστρεφείς τεχνικές. Εάν θέλετε να κατακτήσετε την JavaScript, είναι καλύτερο να το πάρετε στα χέρια σας.
3. Χρησιμοποιήστε τις λειτουργίες ακόμα κι αν είναι μικρές
Ο προγραμματισμός με λειτουργική προσέγγιση είναι ένας καταπληκτικός τρόπος. Γιατί; Διαχωρίζει το λογισμικό σας σε ενότητες που λειτουργούν μαζί αλλά εξακολουθούν να είναι διακριτές μεταξύ τους. Επιτρέψτε μου να σας δώσω ένα παράδειγμα για να σας βοηθήσω να καταλάβετε.
Το Root Mean Square των ακεραίων μπορεί να υπολογιστεί χρησιμοποιώντας μια συνάρτηση. Για να το κάνετε αυτό, πρέπει να τετραγωνίσετε τους ακέραιους αριθμούς, να υπολογίσετε τη μέση τιμή τους και στη συνέχεια να υπολογίσετε την τετραγωνική ρίζα του μέσου όρου. Υπάρχουν τρεις φάσεις στη διαδικασία. Ως αποτέλεσμα, μπορούμε να χρησιμοποιήσουμε τρεις λειτουργίες. Όμως, όπως μπορείτε να δείτε, όλες αυτές οι λειτουργίες είναι αλληλένδετες. Η έξοδος του ενός αποστέλλεται σε άλλο και λαμβάνουμε το τελικό αποτέλεσμα.
Ας υποθέσουμε ότι αντί για τρεις συναρτήσεις, χρειάζεστε απλώς μία για να υπολογίσετε το RMS με βάση πολλούς παράγοντες. Η τελική λύση, όπως βλέπετε, είναι λανθασμένη. Θα είναι αρκετά δύσκολο για εσάς να προσδιορίσετε τι πήγε στραβά σε μια τόσο μεγάλη εκδήλωση σε αυτό το σημείο.
Έχοντας τρεις μικροσκοπικές λειτουργίες, από την άλλη πλευρά, θα σας επιτρέψει να αναλύετε γρήγορα. Ως αποτέλεσμα, ακόμα κι αν οι λειτουργίες είναι μέτριες, χρησιμοποιήστε τις για να ορίσετε ξεχωριστές μονάδες κώδικα. Αυτή η τεχνική θα σας βοηθήσει να γίνετε ειδικός στο JavaScript σαν magic.
Τώρα, ας δούμε μερικές συμβουλές κωδικοποίησης JavaScript.
4. Αντί για ==, χρησιμοποιήστε ===
Στο JavaScript, υπάρχουν δύο τύποι τελεστών ισότητας: τελεστές αυστηρής ισότητας === και !==, και μη αυστηροί τελεστές ισότητας == και !=. Κατά τη σύγκριση, θεωρείται ως βέλτιστη πρακτική να χρησιμοποιείται πάντα η ακριβής ισότητα. Όταν εργάζεστε με == και !=, ωστόσο, θα αντιμετωπίσετε προβλήματα όταν αντιμετωπίζετε διαφορετικά είδη.
Όταν οι τύποι των τιμών που συγκρίνετε είναι διαφορετικοί, οι μη αυστηροί τελεστές θα προσπαθήσουν να εξαναγκάσουν τις τιμές τους, κάτι που μπορεί να οδηγήσει σε απροσδόκητα αποτελέσματα.
5. Χρησιμοποιήστε το JSLint
Ο Douglas Crockford δημιούργησε το JSLint, ένα πρόγραμμα εντοπισμού σφαλμάτων. Απλώς βάλτε το σενάριό σας στο πλαίσιο και θα το σαρώσει γρήγορα για τυχόν σφάλματα ή ελαττώματα.
Το JSLint εξετάζει ένα αρχείο πηγής JavaScript. Εάν εντοπιστεί ένα πρόβλημα, στέλνει ένα μήνυμα με μια περιγραφή του προβλήματος και μια κατά προσέγγιση θέση εντός της πηγής. Το ζήτημα δεν είναι πάντα ένα συντακτικό σφάλμα, αν και συμβαίνει συχνά.
Το JSLint εξετάζει τόσο στιλιστικούς κανόνες όσο και δομικά ζητήματα. Δεν σημαίνει ότι το λογισμικό σας είναι ακριβές. Απλώς προσθέτει ένα άλλο ζευγάρι μάτια για να βοηθήσει στον εντοπισμό προβλημάτων. Προτού υπογράψετε ένα σενάριο, εκτελέστε το μέσω του JSLint για να βεβαιωθείτε ότι δεν έχετε διαπράξει λάθη.
6. Τα σενάρια πρέπει να τοποθετούνται στο κάτω μέρος της σελίδας σας
Ο πρωταρχικός στόχος του χρήστη είναι η φόρτωση της σελίδας όσο το δυνατόν γρηγορότερα. Το πρόγραμμα περιήγησης δεν μπορεί να συνεχίσει τη φόρτωση ενός σεναρίου έως ότου φορτωθεί ολόκληρο το αρχείο. Ως αποτέλεσμα, ο χρήστης θα πρέπει να περιμένει περισσότερο για να δει οποιαδήποτε πρόοδο.
Εάν έχετε αρχεία JS που χρησιμοποιούνται μόνο για την παροχή λειτουργικότητας (για παράδειγμα, όταν πατηθεί ένα κουμπί), τοποθετήστε τα προς το κάτω μέρος της σελίδας, ακριβώς πριν από την ετικέτα κλεισίματος του σώματος. Αυτή είναι αναμφισβήτητα η καλύτερη πρακτική.
7. Ο πιο γρήγορος τρόπος για να φτιάξετε μια χορδή
Όταν χρειάζεται να κάνετε loop γύρω από έναν πίνακα ή ένα αντικείμενο, μην χρησιμοποιείτε πάντα τη δήλωση έμπιστου για βρόχο. Χρησιμοποιήστε τη φαντασία σας για να βρείτε την πιο γρήγορη λύση για την εργασία που έχετε. Δεν πρόκειται να σας φέρω αριθμούς. απλά θα πρέπει να με εμπιστευτείς (ή να δοκιμάσεις μόνος σου).
Αυτή είναι η πιο γρήγορη τεχνική με διαφορά.
8. Προσθέστε ένα σχόλιο στον κώδικά σας
Μπορεί να φαίνεται άσκοπο στην αρχή, αλλά πιστέψτε με όταν λέω ότι πρέπει να σχολιάζετε τον κώδικά σας όσο πιο συχνά γίνεται. Τι θα συμβεί αν επιστρέψετε στο έργο μήνες αργότερα και δεν μπορείτε να θυμηθείτε την αρχική σας διαδικασία σκέψης;
Τι γίνεται αν ο κωδικός σας πρέπει να ενημερωθεί από έναν από τους συναδέλφους σας; Σημαντικές περιοχές του κώδικά σας θα πρέπει πάντα να σχολιάζονται.
9. Χρησιμοποιήστε τα Template Literals
Οι περιορισμοί των συμβολοσειρών που δημιουργούνται με διπλά ή μονά εισαγωγικά είναι πολλοί. Για να κάνετε την εργασία μαζί τους πολύ πιο εύκολη, μπορείτε να επιλέξετε να αντικαταστήσετε μερικές από τις συμβολοσειρές σας με κυριολεκτικά πρότυπα.
Ο χαρακτήρας backtick (') χρησιμοποιείται για τη δημιουργία λέξεων προτύπων, κάτι που έχει πολλά πλεονεκτήματα. Μπορείτε να τα χρησιμοποιήσετε για να αποθηκεύσετε εκφράσεις ή να δημιουργήσετε συμβολοσειρές πολλών γραμμών.
Όπως μπορείτε να δείτε, σε αντίθεση με ένα συμβατικό κυριολεκτικό συμβολοσειράς που κατασκευάζεται με μονά ή διπλά εισαγωγικά, δεν χρειαζόταν να μπαίνουμε και να βγαίνουμε επανειλημμένα από το πρότυπό μας κυριολεκτικά. Αυτό ελαχιστοποιεί την πιθανότητα σφαλμάτων πληκτρολόγησης και μας επιτρέπει να γράφουμε καθαρότερο κώδικα.
10. Iterators και για … των Loops
Οι επαναληπτικοί είναι αντικείμενα στη JavaScript που εφαρμόζουν τη μέθοδο next() για να επιστρέψουν ένα αντικείμενο που αποθηκεύει την επόμενη τιμή σε μια ακολουθία καθώς και true ή false ανάλογα με το αν έχουν απομείνει άλλες τιμές. Αυτό σημαίνει ότι εάν εφαρμόσετε το πρωτόκολλο iterator, μπορείτε να δημιουργήσετε τα δικά σας αντικείμενα iterator.
Υπάρχουν ορισμένοι ενσωματωμένοι επαναλήπτες στο JavaScript, όπως String, Array, Map και ούτω καθεξής. Μπορείτε να χρησιμοποιήσετε για … βρόχους για επανάληψη κατά μήκος τους. Σε σύγκριση με τους συνηθισμένους βρόχους for, αυτό είναι πιο συνοπτικό και λιγότερο επιρρεπές σε σφάλματα. Δεν χρειάζεται να παρακολουθούμε το πλήρες μήκος του πίνακα ή τον τρέχοντα δείκτη χρησιμοποιώντας έναν βρόχο for…of. Όταν σχεδιάζετε ένθετους βρόχους, αυτό μπορεί να βοηθήσει στην απλοποίηση του κώδικα.
11. Χρησιμοποιήστε το {} Αντί για το νέο αντικείμενο()
Στο JavaScript, μπορείτε να δημιουργήσετε αντικείμενα με διάφορους τρόπους. Η χρήση του νέου κατασκευαστή, όπως φαίνεται, είναι ένας πιο συμβατικός τρόπος. Αυτή η στρατηγική, από την άλλη πλευρά, χαρακτηρίζεται ως «κακή πρακτική».
Δεν είναι καταστροφικό, αλλά είναι λίγο φλύαρο και μοναδικό. Αντιθέτως, προτείνω τη χρήση της τεχνικής της κυριολεκτικής αντικειμένου.
12. Σκεφτείτε να βάλετε let και const στον κώδικά σας
Μπορούμε να χρησιμοποιήσουμε τη λέξη-κλειδί let για να δημιουργήσουμε τοπικές μεταβλητές που έχουν εμβέλεια στο δικό τους μπλοκ. Μπορούμε να χρησιμοποιήσουμε τη λέξη-κλειδί const για να δημιουργήσουμε τοπικές μεταβλητές με εύρος μπλοκ που δεν μπορούν να αλλάξουν.
Όταν δηλώνετε μεταβλητές, θα πρέπει να εξετάσετε το ενδεχόμενο χρήσης των λέξεων-κλειδιών let και const όταν αυτό ισχύει. Να θυμάστε ότι η λέξη-κλειδί const απενεργοποιεί μόνο την εκ νέου ανάθεση. Ούτε κάνει τη μεταβλητή αμετάβλητη.
13. Το eval() δεν είναι καλή ιδέα
Η μέθοδος eval(), για όσους δεν γνωρίζουν, μας επιτρέπει την πρόσβαση στον μεταγλωττιστή JavaScript. Ουσιαστικά, μπορούμε να χρησιμοποιήσουμε το eval για να εκτελέσουμε το αποτέλεσμα μιας συμβολοσειράς παρέχοντάς το ως είσοδο ().
Όχι μόνο αυτό θα επιβραδύνει σημαντικά το σενάριό σας, αλλά προσφέρει επίσης σημαντική ανησυχία για την ασφάλεια, καθώς δίνει στο κείμενο που διαβιβάζεται πάρα πολύ μεγάλη εξουσία. Αποφύγετε το πάση θυσία!
14. Ο χειριστής Spread είναι χρήσιμος
Χρειάστηκε ποτέ να μεταδώσετε όλα τα στοιχεία ενός πίνακα ως μεμονωμένα στοιχεία σε μια άλλη συνάρτηση ή πρέπει να βάλετε όλες τις τιμές από έναν πίνακα σε έναν άλλο; Αυτό ακριβώς μας επιτρέπει να πετύχουμε ο τελεστής spread (…). Εδώ είναι μια απεικόνιση.
15. αναμονή και ασυγχρονισμός
Δημιουργήστε ασύγχρονες συναρτήσεις χρησιμοποιώντας τη λέξη-κλειδί async, η οποία επιστρέφει πάντα μια υπόσχεση, είτε ρητά είτε σιωπηρά.
Η λέξη-κλειδί αναμονής μπορεί να χρησιμοποιηθεί σε ασύγχρονες συναρτήσεις για να σταματήσει η εκτέλεση μέχρι να ολοκληρωθεί η επίλυση των υποσχέσεων που επιστρέφουν. Εκτός από τη λειτουργία ασυγχρονισμού, ο κώδικας θα συνεχίσει να εκτελείται κανονικά.
16. Χρησιμοποιήστε τη μέθοδο include() στο Javascript
Στο JavaScript, η συνάρτηση include() καθορίζει εάν μια συμβολοσειρά περιέχει τους παρεχόμενους χαρακτήρες ή εάν ένας πίνακας περιέχει το καθορισμένο στοιχείο.
Αυτή η μέθοδος επιστρέφει true αν εντοπιστεί η συμβολοσειρά ή το στοιχείο. διαφορετικά, επιστρέφει ψευδής. Αξίζει να αναφέρουμε ότι η συνάρτηση String contain() κάνει διάκριση πεζών-κεφαλαίων. Εάν θέλετε να ταιριάξετε μια συμβολοσειρά ανεξάρτητα από την περίπτωση, απλώς μικρύνετε πρώτα το κείμενο-στόχο.
17. Αφαιρέστε στοιχεία από έναν πίνακα χρησιμοποιώντας το Splice
Για να αφαιρέσετε ένα στοιχείο από έναν πίνακα, έχω δει προγραμματιστές να χρησιμοποιούν τη λειτουργία διαγραφής. Αυτό είναι λανθασμένο επειδή, αντί να διαγράψει το αντικείμενο, η μέθοδος διαγραφής το αντικαθιστά με απροσδιόριστο.
Ο ευκολότερος τρόπος για να αφαιρέσετε ένα στοιχείο από έναν πίνακα ανάλογα με την τιμή του στη JavaScript είναι να χρησιμοποιήσετε τη συνάρτηση indexOf() για να λάβετε τον αριθμό ευρετηρίου αυτής της τιμής στον πίνακα και, στη συνέχεια, να διαγράψετε αυτήν την τιμή ευρετηρίου με τη μέθοδο splice().
18. Κάντε χρήση της συνάρτησης βέλους
Οι συναρτήσεις βέλους είναι ένα άλλο σημαντικό χαρακτηριστικό που μόλις προστέθηκε στο JavaScript.
Έχουν πολλά πλεονεκτήματα. Αρχικά, κάνουν τα λειτουργικά μέρη της JavaScript πιο ελκυστικά οπτικά και ευκολότερα στη γραφή. Ωστόσο, η χρήση των συναρτήσεων βέλους το κάνει πολύ πιο ευανάγνωστο και συνοπτικό.
19. Με το Destructuring, μπορείτε να εκχωρήσετε γρήγορα τιμές μεταβλητών
Νωρίτερα σε αυτήν την ανάρτηση, μάθαμε για τον τελεστή spread στο JavaScript. Η καταστροφή είναι παρόμοια με την αποδομή, καθώς αποσυσκευάζει δεδομένα που περιέχονται σε πίνακες.
Η διάκριση είναι ότι αυτές οι μη συσκευασμένες τιμές μπορούν να αντιστοιχιστούν σε διαφορετικές μεταβλητές. Η σύνταξη είναι πανομοιότυπη με αυτή της συντόμευσης [] όταν σχηματίζεται ένας πίνακας. Οι αγκύλες, ωστόσο, τοποθετούνται στην αριστερή πλευρά του χειριστή εκχώρησης αυτή τη φορά. Εδώ είναι μια απεικόνιση.
20. Κάντε πολλά έργα
Κάθε ταλέντο χρειάζεται συνεπή εξάσκηση, γι' αυτό προσπαθήστε να κατασκευάσετε μια ποικιλία έργων για να βελτιώσετε τις ικανότητές σας και να αποκτήσετε τεχνογνωσία με μια ποικιλία σεναρίων προγραμματισμού.
Ενώ εργάζεστε στα έργα, θα αντιμετωπίσετε αρκετές προκλήσεις και ελαττώματα, τα οποία θα σας παρέχουν την απαραίτητη τεχνογνωσία. Προσπαθήστε λοιπόν να δημιουργήσετε έργα και υπάρχει πληθώρα ιδεών και παραδειγμάτων στο διαδίκτυο για να σας βοηθήσουν. Συνεχίστε να αναπτύσσετε κώδικα και οι ικανότητές σας θα βελτιωθούν.
Συμπέρασμα
Μπορεί να είναι δύσκολο να μάθετε μια γλώσσα υπολογιστή όπως η JavaScript. Εάν θέλετε να γίνετε καλός προγραμματιστής και να εξασφαλίσετε την πρώτη σας δουλειά, τότε αυτές οι στρατηγικές εκμάθησης JavaScript μπορούν να σας βοηθήσουν να επιταχύνετε τη διαδικασία εκμάθησής σας.
Φροντίστε να εξασκείτε την κωδικοποίηση σε τακτική βάση, να κρατάτε λεπτομερείς σημειώσεις ενώ μαθαίνετε νέες ιδέες και να χρησιμοποιείτε όλα τα εργαλεία που έχετε πρόσβαση. Πάνω από όλα, βγείτε εκεί έξω και ξεκινήστε την κωδικοποίηση διασκεδάζοντας.
Αφήστε μια απάντηση