Κοινή χρήση τεχνολογίας

한어Русский языкEnglishFrançaisIndonesianSanskrit日本語DeutschPortuguêsΕλληνικάespañolItalianoSuomalainenLatina

Οι συχνές ερωτήσεις σε συνεντεύξεις JS στο μπροστινό μέρος καλύπτουν πολλές πτυχές, συμπεριλαμβανομένης της βασικής σύνταξης, των δομών δεδομένων και των αλγορίθμων, των λειτουργιών DOM, του ασύγχρονου προγραμματισμού, της σπονδυλοποίησης, της χρήσης πλαισίου/βιβλιοθήκης κ.λπ. Ακολουθούν ορισμένες κοινές ερωτήσεις συνέντευξης JS στο front-end και η σύντομη ανάλυσή τους:

1. Βασική γραμματική

• Τύποι δεδομένων και διαφορές αποθήκευσης :Τι τύποι δεδομένων υπάρχουν στο JavaScript; Ποια είναι η διαφορά στο πώς αποθηκεύονται στη μνήμη; (Όπως η διαφορά μεταξύ πρωτόγονων τύπων δεδομένων και τύπων δεδομένων αναφοράς)
• μεταβλητή δήλωση：var、let、const Ποιά είναι η διαφορά; Ποιο είναι το εύρος και ο κύκλος ζωής τους;
• Χειριστής：i++και++iΠοιά είναι η διαφορά;breakκαιcontinueΠώς διαφέρει όταν χρησιμοποιείται σε βρόχο;

2. Δομές δεδομένων και αλγόριθμοι

• Λειτουργίες συστοιχίας : Ποιες είναι οι συνήθως χρησιμοποιούμενες μέθοδοι για πίνακες; (αρέσειpush、pop、shift、unshift、splice、slice、join、sortΠερίμενε)
• Βαθύ αντίγραφο και ρηχό αντίγραφο :Τι είναι το βαθύ αντίγραφο και το ρηχό αντίγραφο; Πώς να τις εφαρμόσετε; (Εάν χρησιμοποιείτεJSON.parse(JSON.stringify(obj)), τελεστής spread, recursion και άλλες μέθοδοι)
• Αλγόριθμος ταξινόμησης: Κατανόηση και εφαρμογή αλγορίθμου ταξινόμησης (όπως ταξινόμηση με φυσαλίδες, γρήγορη ταξινόμηση κ.λπ.)

3. Λειτουργίες DOM

• Κοινές λειτουργίες DOM: Πώς να εκτελέσετε λειτουργίες όπως επιλογή, προσθήκη, διαγραφή, τροποποίηση και έλεγχος στοιχείων DOM;
• innerHTML και innerText: Ποιες είναι οι διαφορές και τα ισχύοντα σενάρια μεταξύ των δύο;
• χειρισμός εκδηλώσεων :Τι είναι το μοντέλο συμβάντος στο JavaScript; Πώς να εφαρμόσετε το διακομιστή μεσολάβησης συμβάντος;

4. Ασύγχρονος προγραμματισμός

• Υπόσχεση :Τι είναι το Promise; Ποιες είναι οι τρεις καταστάσεις του;πώς να χρησιμοποιήσετεPromise.allκαιPromise.race？
• Async/Await : Πώς να χρησιμοποιήσετε το async/wait για να χειριστείτε ασύγχρονες λειτουργίες; Πώς σχετίζεται με το Promise;
• Λειτουργίες επανάκλησης και βρόχοι συμβάντων: Κατανοείτε τον μηχανισμό βρόχου συμβάντων JavaScript και πώς λειτουργούν οι συναρτήσεις επανάκλησης;

5. Modularity

• ES6 αρθρωτό: Κατανόηση της αρθρωτής σύνταξης στο ES6 (import/export), και ποια είναι τα πλεονεκτήματά του;
• CommonJS και AMD/CMD: Κατανοήστε και συγκρίνετε τις διαφορές και τα ισχύοντα σενάρια των προδιαγραφών λειτουργικών μονάδων CommonJS, AMD και CMD.

6. Χρήση πλαισίου/βιβλιοθήκης

• React/Vue/Angular: Κατανοήστε και συγκρίνετε τα χαρακτηριστικά, τα πλεονεκτήματα και τα εφαρμόσιμα σενάρια αυτών των πλαισίων/βιβλιοθηκών front-end.
• κύκλος ζωής: Ποιος είναι ο κύκλος ζωής των στοιχείων σε πλαίσια όπως το React και το Vue;
• Διαχείριση κατάστασης: Πώς να χρησιμοποιήσετε εργαλεία διαχείρισης κατάστασης όπως το Redux ή το Vuex στο React;

7. Άλλα ζητήματα υψηλής συχνότητας

• Πρωτότυπα και αλυσίδες πρωτοτύπων: Κατανοήστε τους μηχανισμούς αλυσίδας πρωτοτύπων και πρωτοτύπων στο JavaScript και τις λειτουργίες τους.
• αυτή τη λέξη-κλειδί: Κατανόηση JavaScriptthisκανόνες κατάδειξης και απόδοση σε διαφορετικά σενάρια.
• Κλείσιμο: Κατανοήστε την έννοια, τη λειτουργία και τα σενάρια χρήσης των κλεισίματος.
• Μηχανισμός συλλογής σκουπιδιών: Κατανόηση του μηχανισμού συλλογής σκουπιδιών σε JavaScript (όπως η μέθοδος σάρωσης σημαδιών, η μέθοδος μέτρησης αναφοράς κ.λπ.).

Δείγματα ερωτήσεων και ανάλυσης

Δείγματα ερωτήσεων: Εξηγήστε τον πρωτότυπο μηχανισμό αλυσίδας στο JavaScript.

αναλύω λέξη：

• Η πρωτότυπη αλυσίδα είναι ένας μηχανισμός για την υλοποίηση της κληρονομικότητας σε JavaScript.
• Κάθε αντικείμενο έχει ένα__proto__Ιδιότητες (συνιστάται στο ES6Object.getPrototypeOf()μέθοδος), αυτή η ιδιότητα δείχνει τον κατασκευαστή τηςprototypeΓνωρίσματα.
• Κατά την πρόσβαση σε μια ιδιότητα ή μια μέθοδο ενός αντικειμένου, εάν η ιδιότητα ή η μέθοδος δεν υπάρχει στο ίδιο το αντικείμενο, θα αναζητηθεί κατά μήκος της αλυσίδας πρωτοτύπου του μέχρι να βρεθεί ή να φτάσει στην κορυφή της αλυσίδας πρωτοτύπου (Object.prototype）。
• Η κορυφή της πρωτότυπης αλυσίδας είναιnull, υποδεικνύοντας ότι δεν υπάρχουν άλλα πρωτότυπα αντικείμενα προς αναζήτηση.
• Μέσω της αλυσίδας πρωτοτύπων, μπορεί να επιτευχθεί κοινή χρήση ιδιοτήτων και κληρονομικότητα μεθόδου μεταξύ αντικειμένων.

1. Ποιοι είναι οι τύποι δεδομένων στο JavaScript; Ποια είναι η διαφορά μεταξύ τους;

απάντηση：
Υπάρχουν 8 τύποι δεδομένων στο JavaScript, συμπεριλαμβανομένων των βασικών τύπων δεδομένων (Primitive Types) και των τύπων δεδομένων αναφοράς (Reference Types).

• Βασικοί τύποι δεδομένων：
  • Απροσδιόριστος: Undefined, η τιμή όταν η μεταβλητή δηλώνεται αλλά δεν εκχωρείται.
  • Μηδενικό: Μηδενική τιμή, που υποδεικνύει μια αναφορά κενού αντικειμένου.
  • Boolean: Τύπος Boolean, με δύο μόνο τιμές, true και false.
  • Αριθμός: Αριθμητικοί τύποι, συμπεριλαμβανομένων ακεραίων και αριθμών κινητής υποδιαστολής.
  • Σειρά: Τύπος συμβολοσειράς, που χρησιμοποιείται για την αναπαράσταση δεδομένων κειμένου.
  • Σύμβολο: Μοναδικός τύπος τιμής που χρησιμοποιείται για τη δημιουργία μοναδικών αναγνωριστικών.
  • BigInt: Τύπος μεγάλου ακέραιου αριθμού, που χρησιμοποιείται για την αναπαράσταση ακεραίων αυθαίρετης ακρίβειας.
• Τύπος δεδομένων αναφοράς：
  • Αντικείμενο: Τύπος αντικειμένου, η οποία είναι η βασική κλάση για όλους τους σύνθετους τύπους δεδομένων στο JavaScript, συμπεριλαμβανομένων πινάκων (Πίνακας), συναρτήσεων (Συνάρτηση), ημερομηνιών (Ημερομηνία) κ.λπ.

Η κύρια διαφορά μεταξύ των πρωτόγονων τύπων δεδομένων και των τύπων δεδομένων αναφοράς είναι ο τρόπος με τον οποίο αποθηκεύονται και εκχωρούνται. Οι τιμές των βασικών τύπων δεδομένων αποθηκεύονται στη μνήμη στοίβας και οι τιμές αντιγράφονται απευθείας κατά την εκχώρηση, ενώ οι τιμές των τύπων δεδομένων αναφοράς αποθηκεύονται στη μνήμη του σωρού και η μνήμη στοίβας αποθηκεύει αναφορές (δηλαδή διευθύνσεις) στις τιμές. στη μνήμη σωρού, τα οποία αντιγράφονται κατά την ανάθεση είναι μια αναφορά.

2. Μιλήστε για το εύρος και το κλείσιμο σε JavaScript;

απάντηση：

• Πεδίο εφαρμογής : αναφέρεται στο έγκυρο εύρος αναγνωριστικών, όπως μεταβλητές και συναρτήσεις στο μπλοκ κώδικα. Το JavaScript έχει κυρίως δύο πεδία: καθολικό εύρος και τοπικό εύρος (συμπεριλαμβανομένου του εύρους λειτουργίας, του εύρους σε επίπεδο μπλοκ, κ.λπ.). Οι μεταβλητές στο καθολικό εύρος είναι ορατές σε όλο το σενάριο, ενώ οι μεταβλητές στο τοπικό εύρος μπορούν να προσπελαστούν μόνο μέσα στο μπλοκ κώδικα στο οποίο έχει οριστεί.

• Κλείσιμο : σημαίνει ότι μια συνάρτηση θυμάται και έχει πρόσβαση στο λεξικό της πεδίο, ακόμα κι αν η συνάρτηση εκτελείται εκτός του λεξικού της πεδίου. Οι κύριες χρήσεις των κλεισίματος είναι η ενθυλάκωση ιδιωτικών μεταβλητών, η δημιουργία μονάδων κ.λπ. Τα κλεισίματα επιτρέπουν στις συναρτήσεις να έχουν πρόσβαση και να χειρίζονται μεταβλητές εκτός της συνάρτησης και αυτές οι μεταβλητές δεν μολύνονται ή αλλάζουν εύκολα ακόμη και εκτός της συνάρτησης.

3. Εξηγήστε τον ασύγχρονο προγραμματισμό και το Promise σε JavaScript;

απάντηση：

• Ασύγχρονος προγραμματισμός : σημαίνει ότι η σειρά εκτέλεσης του κώδικα δεν βασίζεται στη σειρά εγγραφής, αλλά καθορίζεται με βάση την ολοκλήρωση ορισμένων συνθηκών (όπως αιτήματα δικτύου, ανάγνωση και εγγραφή αρχείων κ.λπ.). Η JavaScript είναι μονού νήματος, αλλά υλοποιεί ασύγχρονο προγραμματισμό μέσω βρόχων συμβάντων και συναρτήσεων επανάκλησης.

• Υπόσχεση : είναι ένα νέο αντικείμενο που εισήχθη στο ES6, που χρησιμοποιείται για τον χειρισμό ασύγχρονων λειτουργιών. Ένα αντικείμενο Promise αντιπροσωπεύει μια λειτουργία που μπορεί να μην ολοκληρωθεί τώρα, αλλά θα ολοκληρωθεί (ή αποτύχει) στο μέλλον και την τιμή αποτελέσματός της. Η υπόσχεση έχει τρεις καταστάσεις: σε εκκρεμότητα (σε εξέλιξη), εκπληρώθηκε (επιτυχής) και απορρίφθηκε (αποτυχία). Μέσω του Promise, μπορούμε να γράψουμε ασύγχρονο κώδικα με σύγχρονο τρόπο, καθιστώντας τον κώδικα πιο συνοπτικό, ευκολότερο να κατανοηθεί και να διατηρηθεί.

4. Μιλήστε για τη δημιουργία φυσαλίδων συμβάντων και τη λήψη συμβάντων σε JavaScript;

απάντηση：

• Φούσκα εκδήλωσης : σημαίνει ότι το συμβάν ξεκινά από το στοιχείο προορισμού και στη συνέχεια διαδίδεται μέχρι το ανώτερο επίπεδο του δέντρου DOM (δηλαδή, το αντικείμενο του εγγράφου). Κατά τη διαδικασία δημιουργίας φυσαλίδων συμβάντος, οποιοδήποτε επίπεδο στοιχείων DOM μπορεί να καταγράψει το συμβάν και να το επεξεργαστεί.

• καταγραφή γεγονότος : Σε αντίθεση με τη δημιουργία φυσαλίδων συμβάντων, η καταγραφή συμβάντων ξεκινά στην κορυφή του δέντρου DOM και στη συνέχεια διαδίδεται μέχρι το στοιχείο προορισμού. Κατά τη διαδικασία λήψης συμβάντος, οποιοδήποτε επίπεδο στοιχείων DOM μπορεί να καταγράψει το συμβάν και να το επεξεργαστεί.

Στο JavaScript, μπορείτε να ορίσετε τη μέθοδο επεξεργασίας συμβάντων μέσω της τρίτης παραμέτρου της μεθόδου addEventListener, δηλαδή να χρησιμοποιήσετε τη δημιουργία φυσαλίδων συμβάντων ή τη λήψη συμβάντων. Εάν η τρίτη παράμετρος είναι αληθής, σημαίνει ότι χρησιμοποιείται καταγραφή γεγονότος, εάν είναι ψευδής ή παραλείπεται, σημαίνει ότι χρησιμοποιείται φυσαλίδες συμβάντος.

5. Ποιες νέες δυνατότητες εισάγονται στο ES6+;

απάντηση：
Πολλές νέες δυνατότητες έχουν εισαχθεί στο ES6 (ECMAScript 2015) και στις επόμενες εκδόσεις, συμπεριλαμβανομένων, ενδεικτικά, των εξής:

• ας και συνθ: Χρησιμοποιείται για τη δήλωση τοπικών μεταβλητών και σταθερών εμβέλειας σε επίπεδο μπλοκ.
• λειτουργία βέλους: Παρέχει έναν πιο συνοπτικό τρόπο γραφής συναρτήσεων και δεν δεσμεύει το δικό του αυτό, ορίσματα κ.λπ.
• συμβολοσειρά προτύπου: Επιτρέπει ενσωματωμένες εκφράσεις και υποστηρίζει συμβολοσειρές πολλών γραμμών.
• Ανάθεση καταστροφής: Επιτρέπει την εξαγωγή δεδομένων από έναν πίνακα ή αντικείμενο και την αντιστοίχιση σε μια δηλωμένη μεταβλητή.
• Προεπιλεγμένες τιμές παραμέτρων, υπόλοιπες παράμετροι και τελεστές εξάπλωσης: Βελτιωμένες δυνατότητες επεξεργασίας παραμέτρων λειτουργίας.
• Υπόσχεση και ασυγχρονισμός/αναμονή: Χρησιμοποιείται για το χειρισμό ασύγχρονων λειτουργιών, καθιστώντας τον ασύγχρονο κώδικα πιο συνοπτικό και πιο κατανοητό.
• Σύνταξη τάξης: Παρέχει συντακτική ζάχαρη για κλάσεις που είναι πιο κοντά στον παραδοσιακό αντικειμενοστραφή προγραμματισμό.
• Ενότητες: Υποστηρίζει τη σύνταξη της ενότητας ES6 και υλοποιεί αρθρωτό προγραμματισμό JavaScript.