ALLISON BUCHHOLTZ-ΑΕ: Εντάξει ο καθένας. Καλώς ήρθατε και πάλι στο τμήμα. Είναι προτελευταίο τμήμα μας. Είναι τόσο λυπηρό. Δεν ξέρω τι πάω να κάνω χωρίς να σας δούμε ρε παιδιά κάθε Δευτέρα. Υποθέτω ότι θα πρέπει να just-- ίσως θα μπορούσαμε απλά να συναντηθούμε εδώ και να έχουν δείπνο ή κάτι τέτοιο. Δεν ξέρω. Θα φέρω φαγητό αντ 'αυτού. Θα μιλήσουμε μόνο. Αλλά ναι, την επόμενη εβδομάδα θα είναι το τελευταίο τμήμα μας. Σε αυτό το σημείωμα, έχετε ένα κουίζ την επόμενη εβδομάδα. Ξέρω ότι ξέχασα να κάνω μου, όπως, δύο εβδομάδες εκ των προτέρων την περασμένη εβδομάδα, αλλά ελπίζουμε ότι εσείς ήξερε ότι αυτό ερχόταν. Ας ελπίσουμε ότι αυτό είναι ένα από τα τελευταία του τριμήνου για σας παιδιά για το εξάμηνο. Αλλά πρόκειται να καλύπτουν το σύνολο των υλικό που έχουμε πάει πάνω. Έτσι δεν είναι όπως μπορείτε να ξεχάσετε μόνο περίπου τέσσερις βρόχους ή μεταβλητές. Επειδή μάθαμε εκείνα στην αρχή, αυτά είναι προφανώς δίκαιη παιχνίδι για το κουίζ σας. 

Είναι πρόκειται να είναι το ίδιο σχήμα, ίδιο μήκος, έτσι ώστε να έχει ήδη συνηθίσει σε αυτό. Υπάρχει πρόκειται να είναι κωδικοποίησης με προβλήματα χέρι, ίσως κάποια αλήθεια ψευδής, ίσως κάποια σύντομη απάντηση. Έτσι θα πρέπει να είναι εξοικειωθεί με τη μορφή, ειδικά εάν παίρνετε οι δοκιμές πρακτική. Αλλά, όπως είπα εδώ, είναι σωρευτικά, αλλά είμαστε σίγουρα πρόκειται να επίκεντρο τα πράγματα από την έκτη εβδομάδα και μετά. Έτσι, είμαστε κατά πάσα πιθανότητα δεν πρόκειται να σας ρωτήσω σχετικά με το πόσα bytes είναι σε κάθε τύπο ή αυτά τα είδη των πραγμάτων, αλλά εμείς πρόκειται πιθανώς να είναι ενδιαφέρονται για τα πράγματα όπως συνδεδεμένες λίστες, ή διαφορετικές δομές δεδομένων, ή διαφορετικών αλγορίθμων ότι έχουμε μιλήσει. Έτσι, βεβαιωθείτε ότι είστε πραγματικά για τις επιχειρήσεις εκείνες, και αν χρειαστώ κάποια πηγή, εδώ είναι πολλά πόρων. Θέλω μόνο να σας έδωσε είδος μια γρήγορη λίστα εκεί. 

Την επόμενη εβδομάδα θα είναι κουίζ αναθεώρησης κατά τη διάρκεια αυτής της περιόδου. Έτσι, εάν έχετε οποιεσδήποτε ερωτήσεις ή συγκεκριμένα θέματα, συγκεκριμένα πράγματα για το κουίζ που θα θέλατε να πάει πάνω, παρακαλώ στέλνετε σε μένα μπροστά από το χρόνο, έτσι μπορώ είδος προετοιμάσει κάποιο υλικό για αυτό. Και εκτός αυτού ενότητα αναθεώρηση, θα επίσης να κρατάτε το μάθημα σε επίπεδο επανεξετάζει όπως κάναμε την τελευταία φορά. Και αυτό πρόκειται να είναι γίνεται από τους ίδιους ανθρώπους. Δεν ξέρω αν αυτό κάνει καλύτερα ή χειρότερα, αλλά πρόκειται να είμαι εγώ, Χάνα, Davan, και ο Gabe και πάλι. Έτσι, εάν θέλετε να έρθουν να δουν όλους μας πειράγματα μεταξύ τους και τα πόδια σας μέσα κουίζ αναθεώρηση, σίγουρα θα πρέπει να έρχονται σε αυτή την επόμενη Δευτέρα επίσης. Έτσι θα έχετε μόνο μια μαρμελάδα Δευτέρα συσκευασμένα κριτικής κουίζ, το οποίο είναι καλό γιατί τότε έχετε την Τρίτη να επεξεργαστεί μέσα από τα πάντα. 

Αλλά σίγουρα να ελέγχετε από τους πόρους αυτούς. Study.csv.net είναι κατά πολύ, εγώ πιστεύω, ένα από τα πιο χρήσιμα, κυρίως επειδή έχει πολλά δείγματα κώδικα, έχει όλες τις πρίζες με όλες τις σημειώσεις σε αυτό, που είναι πραγματικά ό, τι ήθελα να επιστήσω πιο του τμήματος υλικά μου από. Αν υπάρχει κάτι στο προηγούμενο τμήματα που μπορεί να έχουν σταλεί ότι δεν μπορεί να έχει πάρει, απλά επιτρέψτε μου να ξέρω. Όπως και δείγμα κώδικα της περασμένης εβδομάδας, αν κάποιος δεν πάρει ότι, μόνο e-mail μου ή να έρθουν να μου μιλήσει, και εγώ θα βεβαιωθείτε ότι μπορείτε να πάρετε αυτό. 

Έτσι, με αυτό, σήμερα θα να μιλάμε για JavaScript. Έτσι, εδώ έχουμε τον Tommy, ο οποίος ήμουν απλά μιλάμε για την τελευταία νύχτα. Αγαπώ τον Tommy. JavaScript είναι το αγαπημένο του γλώσσα, όπως λέει εδώ. Θα προσπαθήσουμε και να σας πω ότι είναι δεν είναι η καλύτερη, και θα είναι λάθος. Έτσι, ο Tommy είναι ένα master JavaScript. Δεν είμαι αρκετά στο του επίπεδο, αλλά ήμουν όπως, "Tommy, πώς μπορώ να διδάξω αυτά τα παιδιά JavaScript; " Έτσι πήρα κάποιες συμβουλές, έτσι ελπίζω να ασκηθείτε. 

Έτσι, ένα ζευγάρι πράγματα που πρέπει να ξέρετε είναι ότι Η JavaScript είναι μια client-side scripting γλώσσας, έτσι ενώ η PHP είναι κάτι ότι θεωρείται πιο server-side, έγινε μεταφόρτωση στο διακομιστή, καταρτίζονται και εκτελούνται εκεί. Αυτός εκτελείται για τη δική σας μηχανή. Εντάξει; Έτσι θα φορτώσει κάποια σελίδα JavaScript, και εκτελεί στον υπολογιστή σας. Σύνταξη είναι πολύ όμοια με τη C και PHP. Εμείς πάμε για να περάσει Μερικά παραδείγματα της JavaScript, και θα πάμε να δούμε ότι η τρόπο που μιλάμε για τις μεταβλητές, βρόχους, και οι συνθήκες είναι πολύ παρόμοια. Εντάξει; Το γεγονός ότι είναι τόσο παρόμοια είναι κατά πάσα πιθανότητα πρόκειται για ταξίδι κάποιοι από εσάς επάνω, σε ορισμένες περιπτώσεις, μόνο και μόνο επειδή θα ενσωματώσει ένα μικρό κομμάτι της C όταν δεν θα έπρεπε να υπάρχει. Ίσως να προσπαθήσετε να γράφετε κάτι όταν δεν θα πρέπει να είναι δακτυλογραφημένες. 

Και σε αυτό, ένα πράγμα που πρέπει να γνωρίζουμε είναι ότι το JavaScript είναι μια δυναμικά δακτυλογραφημένες γλώσσας, όπως η PHP. Έτσι, αν εσείς θυμάστε από το τμήμα την περασμένη εβδομάδα, όταν ήμασταν είδος του κάνει υπερεντατικά μαθήματα PHP μας, είδαμε πώς ένα μία χορδή θα μπορούσε να είναι μετατράπηκε σε int ένα, και ούτω καθεξής. Ο τύπος των μεταβλητών σας καθορίζονται κατά το χρόνο εκτέλεσης, έτσι ώστε να μπορεί να αλλάξει με την πάροδο Η πορεία του προγράμματος, και με τον ίδιο τρόπο που ποτέ δεν πραγματικά δηλώνουν τους τύπους για τις μεταβλητές της PHP, θα πάμε να κάνουμε το ίδιο πράγμα εδώ, όπου δεν είμαστε πραγματικά τον έλεγχο των τύπων των μεταβλητών μας, να το πω έτσι, όπως κάνουμε σε C. 

Και τότε ένα πράγμα ότι είναι αρκετά δροσερό είναι ότι μπορείτε να error ελέγχει μέσω της κονσόλας, με αυτή τη μεγάλη λειτουργία console.log, η οποία σας δίνει τη δυνατότητα να εκτυπώσετε διαφορετικές μεταβλητές ή αντικείμενα που θα μιλήσουμε. Ακριβώς όπως την περασμένη εβδομάδα, όταν ήμουν όπως, «να χρησιμοποιήσετε αυτή τη λειτουργία," με χωματερή από το chipset σας αυτό είναι μια συνάρτηση που θέλετε να χρησιμοποιήσετε, console.log. Ήμουν τόσο έκπληκτος πόσοι φοιτητές σε ώρες γραφείου Δεν ήξερε για τη λειτουργία χωματερής. Και ήμουν όπως, «ρε παιδιά, αυτό θα κάνουν τη ζωή σας πολύ ευκολότερη. " 

Εντάξει, έτσι ώστε να ήταν το είδος του μόνο μια σύντομη πράγμα, όπως πάντα, έχουμε παραδείγματα. Ξέρω ότι εσείς αγαπάτε εκείνους. Έτσι, εδώ είναι ένα παράδειγμα ενός πολύ απλό αρχείο JavaScript εδώ. Γι 'αυτό ακριβώς πρόκειται να δημιουργήσουν Αυτό το pop-up που λέει, "Hello World", όταν εισάγετε τη σελίδα, αλλά ας δοκιμάστε και να περπατήσετε μέσα από αυτό το λίγο. Έτσι, προφανώς αυτό είναι μόνο σαν κανονικό index.html σας. Έτσι, απλά φυσιολογικό πρότυπο μας εδώ, και έχουμε HTML, έχουμε το κεφάλι μας, όπως ακριβώς και με το CSS, πώς μπορούμε περιλαμβάνονται κάποια εξωτερική αρχείο, σωστά; Έχουμε κάποιο είδος σεναρίου κείμενο που είναι JavaScript. Και η πηγή είναι hello.js, που είναι εδώ κάτω. Αυτό είναι το σύνολο του φακέλου της hello.js. Και τότε έχουμε κάποια Τίτλος και κάποια HTML σώμα ότι δεν ενδιαφέρονται πραγματικά για. 

Αυτό που συμβαίνει είναι, όταν θα φορτώσει αυτή τη σελίδα, εκτελεί αυτόματα αυτό το σενάριο. Εντάξει; Έτσι, το JavaScript θα εκτελέσει αυτόματα. Έτσι τι πρόκειται να κάνει, πρόκειται να πάει αμέσως και να εκτελέσει αυτό. Και αυτό πρόκειται να πει, «σήμα. Γεια σας κόσμο. " Ποια συναγερμού είναι η λειτουργία που παράγει πραγματικά αυτό το πλαίσιο. Εντάξει; Έτσι είναι το είδος του Περικλείουν όλες. Δεν υπάρχει τίποτα επιπλέον είχαμε να κάνουν εκτός από απλά συναγερμού, και στη συνέχεια ό, τι θέλαμε εντός ειδοποίησης κουτί μας. Εντάξει; Έτσι, αυτό είναι απλά ένα σούπερ απλό παράδειγμα του τι μπορεί να κάνει το JavaScript. 

Ένα από τα πραγματικά δροσερό πράγματα, όπως θα δούμε, είναι ότι το JavaScript σας επιτρέπει να χειραγωγήσουν τις ιστοσελίδες σας, χωρίς να χρειάζεται να τοποθετήστε τις ξανά κάθε φορά. Έτσι, αν want-- για παράδειγμα, εάν που πλανάται πάνω από κάτι, εάν εσείς έχετε ποτέ φαίνεται σαν μπαρ μενού, ή όταν περνάτε πάνω από μερικά θέμα, εμφανίζεται ένα drop-down μενού, αυτό συμβαίνει επειδή του το JavaScript. Εντάξει; Έτσι, δεν είστε επαναφόρτωση ολόκληρη την σελίδα για να πάρετε αυτό το μενού για να δείξει, είστε απλά ψάχνουν για κάποιο συγκεκριμένο δράση που ο χρήστης έχει λάβει, οι οποίες ονομάζονται γεγονότα που θα πάρετε σε, και μόλις δείτε ότι, λέτε, "Εντάξει, να επεξεργαστείτε κάτι για αυτό σελίδα και κάνει το βλέμμα διαφορετικό, αλλά μόνο να επεξεργαστείτε αυτά τα συγκεκριμένα πράγματα. Μην φορτώσετε εκ νέου το όλο θέμα. " Γι 'αυτό πραγματικά είναι πολύ καλύτερο, και δεν χρειάζεται να φορτώσετε τις σελίδες σας, και είναι πραγματικά δροσερό. 

Έτσι δηλώσεις μεταβλητών, ώστε να μπορείτε να δείτε το είδος, Έβαλα στην κορυφή εδώ, χαλαρά πληκτρολογήσει. Έτσι, αυτό είναι πάρα πολύ σαν PHP. Δεν χρειάζεται να πω JavaScript ποιο τύπο είμαστε περιμένοντας κάθε μία από αυτές τις μεταβλητές να είναι. Μπορούν να είναι ό, τι τους τύπους που θέλουμε. Έτσι, μπορείτε να παρατηρήσετε σε αυτήν την περίπτωση, δηλώνουμε τους πολύ απλά, μόνο με "var" και στη συνέχεια ό, τι θέλουμε όνομα μεταβλητής μας να είναι. Ένα πράγμα που πρέπει να σημειωθεί είναι ότι όταν θέσει var μπροστά από το όνομα μιας μεταβλητής, αυτό το μελετά σε τοπικό επίπεδο. Εντάξει; Είναι απόλυτα λογικό για σας σε εντελώς απλά διαγράψει το var και μόλις έχουν s ισούται με CS50, και Αυτό θα ήταν απλά μια καθολική μεταβλητή. Εντάξει; Έτσι, μπορείτε να προετοιμάσετε τους δύο τρόπους, ακριβώς εξαρτάται από το πώς το θέλετε. Έτσι, εάν είστε αρχικοποίηση εντός μιας λειτουργίας, και θέλετε αυτήν τη μεταβλητή να μείνετε scoped εντός αυτής της λειτουργίας, θα πάμε να θέλουν να κάνουν κάτι σαν var ορίσουμε μια μεταβλητή, έναντι αν θέλετε σε παγκόσμιο επίπεδο scoped, μπορείτε μπορεί να κάνει ακριβώς το όνομα του η μεταβλητή και έπειτα ό, τι θα θέλατε να οριστεί ίση με. Εντάξει; 

Αυτό είναι το είδος της δροσερό πράγμα εδώ κάτω, γιατί αν παρατηρήσετε μεταβλητή μας β ξεκινά ως αλήθεια. Και ό, τι αυτό μπορεί να does-- κάποιος να μου πει τι σημαίνει αυτό; Έτσι έχουμε κάποια ειδοποίηση. Τι θα του τύπου του Β είναι στην αρχή; ΚΟΙΝΟ: Boolean. ALLISON BUCHHOLTZ-ΑΕ: Boolean. Δεξιά. Και τότε η επανεκχώρηση β σε αυτό το string, σωστά; Έτσι λοιπόν εδώ, ποιος τύπος β είναι; Θα ήθελα να είναι ένα string, σωστά; Έτσι, αυτό που είναι σημαντικό να σημείωση είναι ότι στο c, εμείς δεν θα μπορούσε ποτέ να κάνει σχεδόν κάτι τέτοιο. Θα θέλαμε να έχουμε μια μεταβλητή, ρίχνει το ως κάτι άλλο, ίσως να κάνουμε κάποια λειτουργία με δύο i, πηγαίνετε από μια επιβάρυνση σε ακέραιο. Αλλά αν παρατηρήσετε εδώ, β πολύ εύκολα αλλάζουν είδος. 

ΚΟΙΝΟ: Περιμένετε, έτσι ώστε να μπορείτε απλά είναι σαν, "κάνουν β έναν ακέραιο;" 

ALLISON BUCHHOLTZ-ΑΕ: Ναι. Μπορείτε να εκχωρήσετε εκ νέου μόνο β σε ακέραιο. 

ΚΟΙΝΟ: Αλήθεια; 

ALLISON BUCHHOLTZ-ΑΕ: Ναι. Και τότε θα ήταν ένας int. Έτσι μεταβλητές σας μπορεί να αλλάξει με την πάροδο Η πορεία του προγράμματος πάρα πολύ. Δεν είναι αυστηρά πληκτρολογήσει. Είναι πολύ χαλαρά πληκτρολογήσει. Εντάξει; Βασικά μεταβλητών σας να κάνετε ό, θέλουν, όπως το είδος του είδε με την PHP. Μπορούν να κάνουν κάποια τρελά πράγματα, έτσι είναι σημαντικό να είναι αρκετά προσεκτικοί. Ονομάστε τις μεταβλητές σας καλά. Αν όχι, κάντε ξαφνικά θα πάμε να είναι όπως, "Περιμένετε, σκέφτηκα ότι αυτή ήταν μια string, και τώρα είναι ένας int, και δεν είμαι σίγουρος τι συμβαίνει εδώ. " Έτσι, αυτό είναι μόνο ένα απλό παράδειγμα που δείχνει πώς μια μεταβλητή μπορεί εύκολα αλλάξετε τον τύπο του πάνω η πορεία του προγράμματος. 

ΟΚ. Έτσι, αυτό θα πρέπει να εξετάσουμε σούπερ, σούπερ εξοικειωμένοι. Αυτοί είναι λοιπόν οι βρόχοι μας σε JavaScript. Είναι ακριβώς η ίδια, εκτός από την αντί των τεσσάρων int Ι ισούται με μηδέν, θα μπορούσαμε απλά να πούμε var i ισούται με μηδέν. Και τότε θα μπορούσαμε να έχουμε ίδιο είδος μας της κατάστασης, το ίδιο είδος ενημέρωσης, i συν συν δουλεύει μια χαρά. Έτσι τέσσερα είναι τα ίδια, whiles είναι τα ίδια, και να κάνει ενίοτε είναι ακριβώς το ίδιο. Ίδιο είδος γενική μορφή. Θα παρατηρήσετε, τέσσερα, παρενθέσεις, παρένθεση, είναι όλοι το ίδιο. Επίσης, θα υπάρξουν ερωτηματικά όταν φτάσουμε στο παράδειγμα κώδικα. Θα δείτε ότι είναι αρκετά πολύ το ίδιο ως c. 

Για δηλώσεις λειτουργία, πάλι, πολύ παρόμοια. Έχουμε κάποια λειτουργία που μόλις λέει ότι είναι μια λειτουργία, και στη συνέχεια, Το όνομα μας λειτουργία, και οι είσοδοι. Και πάλι, αν παρατηρήσετε, εμείς δεν έχουν κανένα απολύτως τύποι εδώ. Σωστά; Δεν έχουμε τίποτα λέγοντας ότι αυτά πρέπει να είναι ints ή διπλά, ή πλωτήρες. Θα μπορούσε να είναι ό, τι θέλουν. Αυτό που είναι σημαντικό είναι να σημειωθεί ότι πρέπει να γράψουμε λειτουργία εκ των προτέρων να αφήσει το JavaScript γνωρίζουν ότι αυτό είναι πραγματικά μια λειτουργία. 

Έτσι, αυτό είναι μόνο μερικά απλό άθροισμα συνάρτηση που επιστρέφει Χ ή Υ, και τότε τι είναι επίσης δροσερό είναι ότι μπορείτε πραγματικά να αντιστοιχίσετε μια λειτουργία σε μια μεταβλητή. Έτσι, στην περίπτωση αυτή, το ποσό είναι τώρα η λειτουργία που κάνει στην πραγματικότητα ποσό. Έτσι, αν παρατηρήσετε εδώ, έχουμε λειτουργία, το όνομα της λειτουργίας, οι είσοδοι. Σωστά; Εδώ έχουμε μόνο τη λειτουργία και τις εισροές. Έτσι, αυτό ονομάζεται μια ανώνυμη λειτουργία. Και αυτό είναι κάτι που θα πρέπει να είναι νέα για τους περισσότερους από σας παιδιά, αν όχι όλοι σας. Έτσι, βασικά, τι σημαίνει ότι εμείς δεν κάνουμε Πρέπει να το όνομα του μας λειτουργίας σε αυτή την περίπτωση. Εμείς απλά να πούμε, "Εντάξει, Πάω να έχουν αυτή τη λειτουργία που εκτελεί, εδώ είναι οι συντελεστές του, και εδώ είναι τι πρόκειται να κάνει. " Και ειδικά όταν είστε ανάθεση μια λειτουργία σε κάποια μεταβλητή ότι θα πάμε να χειραγωγήσουν, Δεν είναι υποχρεωτικό πρέπει να το αναφέρουμε, διότι θα πάμε να αναφέρεται σε αυτήν από αυτή τη μεταβλητή όνομα, όχι από ό, τι η λειτουργία κατέπεσε. Εντάξει; 

Έτσι, αν βλέπουμε εδώ, εμείς έχουν κάποια μεταβλητή άθροισμα τώρα ότι είναι ίσο με το άθροισμα των τριών και πέντε. Και θα πάρει αυτό. Και αυτό θα έχει μόνο κάποια ειδοποίηση, τρία συν πέντε ισούται με τον αριθμό. Αυτό συν θα ενώσετε μόνο όποια και αν είναι η απάντησή μας ήταν πάνω στο κορδόνι. Επίσης, δροσερό, καθώς μπορεί να ενώσετε χορδές. 

Για JavaScript, όπως με την PHP, HTML, CSS και όπως είπαμε, πολλά από αυτά έχουμε το είδος είστε λήψη οι ρόδες από εδώ και εσείς έχετε ένα μεγάλο μέρος της τεχνογνωσίας πώς να καταλάβουν αυτά τα πράγματα. Είναι ελαφρώς διαφορετική, αλλά δεν είναι τόσο ξένη και ότι δεν μπορείτε να το Google τα πράγματα ή βλέμμα τους επάνω σε απευθείας σύνδεση με W3 σχολεία. Και είμαστε πραγματικά περιμένουμε παιδιά με, το είδος του, το πείραμα και να μάθουν για τη δική σας. Έτσι, ξέρω ότι αυτό μπορεί να φαίνεται λίγο λιγότερο βάθος από ό, τι μερικά από τα πράγματα γ κάνουμε, αλλά αυτό είναι πραγματικά για έναν λόγο. Αλλά ελπίζω ότι δεν είναι πολύ διαφορετικά, και αυτό δεν είναι συντριπτική. 

Έτσι συστοιχίες σε JavaScript, πάλι πολύ, πολύ παρόμοια. Σωστά; Έχουμε κάποια μεταβλητή πίνακα ότι είναι ίση με ένα κενό μεταξύ παρενθέσεων, και αυτό είναι μόνο ένα άδειο πίνακα. Αυτό καλείται συχνά κυριολεκτική σημειογραφία πίνακα. Αυτό είναι μόνο ένα πράγμα λέμε. Αν δούμε συστοιχία δύο εδώ, έχουμε κάποια κυριολεκτική πίνακα που έχει τρία στοιχεία, έτσι δεν είναι; Και τότε έχουμε κάποια var τρίτο στοιχείο που είναι κάποια μεταβλητή που είναι ακριβώς πρόκειται να κρατήσει αυτή τη σειρά, JS. 

Τα στοιχεία, καλό να παρατηρήσετε, διαχωρίζονται με κόμματα, ακριβώς όπως θα περιμέναμε. Και μπορείτε επίσης να αποκτήσετε πρόσβαση σε αυτά, όπως κάναμε σε C, με αυτόν τον συμβολισμό του δείκτη, έτσι δεν είναι; Έτσι, διαφέρει από την PHP τώρα, θα πάμε πίσω με ακριβώς το είδος της παραπομπής για τα πράγματα με το δείκτη. Ακριβώς όπως η C, είναι επίσης μηδέν δείκτη. Νιώθω σαν να ήταν πραγματικά σκληρή αν γίνει ξαφνικά ένας JavaScript δείκτη, και θα έπρεπε να εντελώς επανεξετάσουμε το πώς σκέφτεστε για συστοιχίες. 

Ένα δροσερό πράγμα είναι ότι αντί έχουν να do-- αν ποτέ ήθελε το μήκος μιας συστοιχίας, ίσως διέτρεξε το μέχρι να βρείτε κάποιο τέλος, ή θα ξέρω ακριβώς τι είναι. Επειδή το JavaScript είναι πολύ χαλαρή σε περισσότερα τρόπους από ό, τι ακριβώς είδος, όπως βλέπουμε εδώ, μπορούμε να κάνουμε ακριβώς αυτό το array μεγαλύτερο επειδή αποφασίζουμε να. Εάν παρατηρήσετε διάταξη των τριών έχει τρία πράγματα για να ξεκινήσει, αλλά στη συνέχεια ξαφνικά, είμαστε σαν, "Ω, Αστειεύομαι. Είμαστε πραγματικά συμβαίνει να το κάνει 101 πράγματα. " Έτσι, αν ποτέ θέλετε να ξέρετε το πραγματικό μήκος του πίνακα σας, να το κάνει όπως αυτό. Και θα πάμε να δούμε πολλά αυτής της σημειογραφίας σε παραδείγματα, αλλά με JavaScript είναι συνήθως ανεξάρτητα από αντικείμενο που μιλάτε για dot ανεξάρτητα από το είδος της λειτουργίας που θέλετε να εφαρμόζονται σε αυτό. Εντάξει; 

Έτσι, στην περίπτωση αυτή, μας αντικείμενο είναι συστοιχία δύο, και λέμε ότι θέλουμε η μήκος της συστοιχίας δύο. Έτσι, αυτό απαιτεί όπως ακριβώς μήκος σε αυτό. Και ότι θα επιστρέψει το μήκος σας. Επίσης, κάτι που πρέπει να σημειωθεί είναι ότι αν παρατηρήσετε συστοιχίες μας, αντίθεση με την C, δεν έχουν να είναι όλα του ίδιου τύπου. Αυτό είναι πολύ περισσότερο σαν PHP. JavaScript είναι βασικά ακριβώς όπως Αυτή η ενδιαφέρουσα συγχώνευση της Γ και PHP. Έτσι θα μπει σε αυτό. Προς το παρόν, ας υποθέσουμε ότι συστοιχίες σας είναι βασικά όπως πίνακες C, σε ότι είναι μηδέν ευρετήριο. Εντάξει, έτσι ώστε να είναι τα πάντα. Μπορείτε επίσης απλά να επεκτείνει ένα συστοιχία σε ό, τι ευρετήριο που θέλετε. Ότι η παρούσα θα μπορούσε πιθανότατα να SEG σφάλμα σε σας ή να σας δώσει κάποιο σφάλμα, JavaScript είναι όπως, «Μπα, αυτό είναι μια χαρά. Πήρα αυτό. Εμείς απλά θα πάει κατ 'ευθείαν όπου θέλετε να. " 

Εντάξει, έτσι ώστε τα αντικείμενα είναι πολύ σημαντικό. Εσείς θα πρέπει να χρησιμοποιούν πολλά από αυτά στο σύνολο σας P, αν θυμάμαι καλά. Έτσι, το γεγονός ότι αυτά είναι παρόμοιο με σε C είναι structs. Έτσι, μπορείτε να σκεφτείτε όταν about-- πάμε σε ένα παράδειγμα δεξιά Μετά από αυτό νομίζω ότι θα κάνουν πολύ πιο sense-- αλλά χρησιμοποιούμε βασικά αντικείμενα οργανώσουν τις πληροφορίες που σχετίζονται με φυσικά. Όταν μιλήσαμε για structs σε C, συχνά μιλάμε για έναν φοιτητή ο οποίος είχε κάποιο όνομα, ID, το σπίτι, ξέρετε, η συγκέντρωση. Και αυτό είναι το είδος του ίδιου πράγματος ότι χρησιμοποιούμε αντικείμενα εδώ. Είναι απλά για να οργανώσουν παρόμοιες πληροφορίες. 

Μπορείτε επίσης να σκεφτείτε αυτά ως πιο παρόμοιο με συνεταιριστικές συστοιχίες στην PHP. Έτσι, αυτό θα είναι το είδος του πράγματος όπου έχουμε κάποια βασικά με κάποια αξία, πολύ παρόμοια με την PHP. Έτσι, μπορείτε να προετοιμάσει μερικά κενή αντικειμένου, όπως βλέπουμε εδώ, μόνο με άγκιστρα. Έτσι συστοιχίες είναι αγκύλες. Αδειάστε αντικείμενα είναι άγκιστρα. Καλή διάκριση να έχει. Και αυτά είναι μόνο δύο διαφορετικές τρόποι για να ρυθμίσετε τις ιδιότητες. Έτσι, αυτό είναι το είδος του πολύ περισσότερο από έναν τρόπο ότι είναι παρόμοια με την PHP, με μας συνειρμική συστοιχίες, με τους βασικούς μας, και την αξία μας, ενώ ένα αυτό is-- που θα δείτε αυτό το πολύ περισσότερο σε JavaScript. Αυτό τείνει να είναι η σύμβαση. Και με τον ίδιο τρόπο που κάναμε συστοιχία δύο dot μήκος, αυτό που λέει, "Εντάξει, μου το δώσει χαρακτηριστικό αυτού του αντικειμένου. " Σωστά; Έτσι, με τον ίδιο τρόπο ήταν σαν, "δώσε μου το μήκος χαρακτηριστικό του πίνακα δύο, " Αυτό λέει, «να μου δώσει κάποιες ιδιοκτησία των κενών αντικειμένου μας. " Ή στην περίπτωση αυτή, είμαστε αναθέσουν σε κάποια τιμή εδώ. Αλλά θα μπορούσε επίσης να είναι με αυτόν τον τρόπο την πρόσβαση. 

Και τότε εδώ αυτό είναι μόνο που δείχνει δύο διαφορετικές ειδοποιήσεις. Έτσι, αυτό θα δείξει τις ειδοποιήσεις θα είναι ακριβώς το ίδιο, Είναι μόλις δύο διαφορετικούς τρόπους πρόσβαση το στοιχείο που θέλουμε. Μήπως αυτό έχει νόημα για όλους; Νιώθω σαν αυτό ίσως περισσότερο νόημα, μόνο και μόνο επειδή είμαστε έρχεται από την PHP. Αλλά, όπως κάνουμε περισσότερα παραδείγματα, αυτή η είναι κυριολεκτικά ακριβώς το ίδιο. Πολλά από αυτά είναι απλά αλλάξτε σε σύνταξη. 

Εντάξει, έτσι παραδείγματα. Αγαπώ παραδείγματα. Έτσι, εδώ είναι μερικά CS50 μεταβλητή που είναι ένα αντικείμενο, και αποθηκεύουμε όλα αυτά πληροφορίες σχετικά με αυτό. Έτσι έχουμε βέβαια, εκπαιδευτής, TFS, psets, και μαγνητοσκοπημένο. Έτσι παρατηρούμε, αυτά είναι σχεδόν όλα διαφορετικών τύπων. Σωστά; Έτσι, τα αντικείμενα μπορεί να αποθηκεύσει Χαρακτηριστικά των διαφόρων τύπων. Μπορούμε να σκεφτούμε this-- είναι πολύ παρόμοιο με συνειρμική σειρά μας σε PHP. Έτσι, βασικά, την αξία, το κλειδί, τιμή, κλειδί, αξία, ούτω καθεξής και ούτω καθεξής. Αυτό που είναι επίσης ενδιαφέρον κατά τον ίδιο τρόπο ότι μπορούμε να έχουμε συστοιχίες μέσα σε πίνακες, Μπορούμε επίσης να έχουμε αντικείμενα μέσα αντικείμενα, ή συστοιχίες εντός αντικείμενα. Ποτέ δεν είσαι πραγματικά περιορίζεται σε ένα μόνο ένα από τα πράγματα. Μπορούμε να πάρουμε πολύ Inceptionesque, μόλις συνεχίσουμε την πορεία προς την τρύπα του κουνελιού εκεί. 

Έτσι, αν παρατηρήσετε, εμείς έχουν κάποια φυσικά, ότι η είναι μια συμβολοσειρά, εκπαιδευτής, που είναι ένα string, και τη σειρά, ένας int, και μια Boolean. Έτσι, όλα αυτά τα διαφορετικά πράγματα. 

Εντάξει, ναι, έχουμε ένα άλλο. Έτσι, σε αυτή την περίπτωση, έχουμε μία συστοιχία αντικειμένων. Έτσι ακριβώς όπως ένα αντικείμενο μπορεί να έχει μια σειρά σε αυτό. Μπορούμε επίσης να έχουμε μια σειρά από αντικείμενα. Αυτό μπορεί να είναι χρήσιμο να σκεφτείτε παρόμοια με το είδος πώς είχαμε ένα hash τραπέζι, είχαμε μια σειρά όλων αυτών των διαφορετικών τύπους structs ότι ήταν δείκτες σε διαφορετικές κόμβους και εταζέρα. Αλλά σε αυτή την περίπτωση, έχουν μία σειρά αντικειμένων. Έτσι, αυτό είναι σαν μια σειρά των συνεταιριστικών συστοιχίες. Έτσι έχουμε μερικά πρώτο στοιχείο θα είναι το αντικείμενο με το όνομα James και να στεγαστούν Winthrop. 

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

Έτσι, αν θέλαμε, μπορεί κανείς να πει με ό, τι αυτό έγκαιρης προειδοποίησης που θα κάνουμε εδώ; Ή ό, τι αυτό το κομμάτι της κώδικας θα κάνει για μας; ΚΟΙΝΟ: Θα σας δώσω όλα τα ονόματα. ALLISON BUCHHOLTZ-ΑΕ: Δεξιά, έτσι ώστε να θα ειδοποιεί μόνο με όλα τα ονόματα διότι θα περάσει εξοχικό σπίτι i, έτσι θα ξεκινούν από το μηδέν. Γι 'αυτό ήθελα να πω, εντάξει ψάχνουμε σε αυτό το πρώτο αντικείμενο, το οποίο είναι η πρώτη θέση στον πίνακα μας. Και λέει, "δώσε μου το αποδίδουν, το όνομα του αντικειμένου. " Έτσι, πάμε εδώ, είχαμε σάρωση, θα βρίσκαμε το όνομα, και εμείς θα εκτυπώσετε James, Molly, και ο Καρλ. Όλες οι ερωτήσεις μέχρι στιγμής; Δυστυχώς το JavaScript θα πάμε να είναι κάνει πολλά ανατρέχοντας σε σας δικά, υπολογίζοντας τη σύνταξη, αγωνίζεται με αυτό. Αλλά φυσικά είμαι πάντα εδώ, ώρες γραφείου είναι πάντα εδώ. Μπορεί να κάνω την Τρίτη αυτή την εβδομάδα. Έτσι, αν είστε εκεί, μπορείτε να έρθουν επίσκεψη μου αυτή την εβδομάδα. Θα ήθελα να είναι μεγάλη. 

Εντάξει, έτσι είναι το έγγραφο DOM-Object Model. Έτσι, αυτό είναι απλώς ένας τρόπος ότι θέλουμε να πιστεύουμε για το πώς HTML μας και τα πάντα στο πλαίσιο αυτό οργανώνεται. Αυτό είναι πάρα πολύ κάτι που μάλλον θα καταλήξει σε ένα κουίζ σας. Ξέρω χρόνο μου, ήταν σαν να είναι εδώ HTML αρχείο, συμπληρώστε το DOM για αυτό. Και μπορείτε απλά να συμπληρώσετε στα μικρά πράγματα. Αυτά θα πρέπει να είναι εύκολο σημεία ελπίζουμε. Ας ελπίσουμε ότι θα see-- 

ΚΟΙΝΟ: [δεν ακούγεται] 

ALLISON BUCHHOLTZ-ΑΕ: Έτσι βλέπετε αυτό το δέντρο εδώ; 

Κοινό: Ναι. 

ALLISON BUCHHOLTZ-ΑΕ: Έτσι θα ζητήσει από τη χρήση να συμπληρώσετε το τι συμβαίνει κάτω από το σώμα. Ίσως κάτω από το σώμα, έχουμε κάποια divs ή έχουμε κάποιες σκέψεις, και θα σας ζητήσει να συμπληρώσετε ένα δέντρο μοιάζει πολύ με αυτό. Έτσι θα είναι το περπάτημα μέσα από αυτό. Έτσι, το αντικείμενο document Μοντέλο είναι απλώς ένας τρόπος να δομήσουν και να σκεφτούμε για την HTML μας γραφικά. Και επίσης όταν παίρνουμε σε περισσότερες JavaScript, πρόκειται να είναι η τρόπο ότι πράγματι χειρίζονται διαφορετικά στοιχεία σχετικά με τη σελίδα. Χρειαζόμαστε έναν τρόπο για να αποκτήσετε πρόσβαση σε κάθε από τα πράγματα σε HTML μας, και έτσι αυτό μας δίνει μια πολύ σκυρόδεμα τυποποιημένο τρόπο σε διάφορες ιστοσελίδες για να το κάνουμε αυτό. 

Έτσι, αν εμείς απλά να περπατήσετε μέσα Αυτό εδώ, φυσικά εγγράφου μας είναι σαν ολόκληρο το αρχείο μας. Αυτό προφανώς έχει νόημα ότι αυτό είναι το υψηλότερο πράγμα, και στη συνέχεια έχουμε την πραγματική μας HTML, που αντιστοιχεί σε αυτήν την ετικέτα εδώ. Επίσης, αν σε περίπτωση ετικέτες σας σωστά, τότε η δημιουργία αυτού του δέντρου DOM γίνεται εξαιρετικά απλή. Έτσι έχουμε κάποια κεφαλή εδώ. Έχουμε κάποιο σώμα που βλέπουμε προέρχονται από την HTML, η οποία είναι ο λόγος που έχουμε το κεφάλι και το σώμα. Στο κεφάλι, έχουμε κάποια ετικέττα τίτλου, μια ετικέτα τέλους τον τίτλο, έτσι ξέρουμε ότι έρχεται μετά από το κεφάλι. Και μέσα σε ετικέττα τίτλου μας, έχουμε Hello, world. Εντάξει; Έτσι, αυτό είναι όλο αυτό το αριστερό κλάδο χέρι. Και στη συνέχεια, για την διακλάδωση δεξιά Εδώ, βλέπουμε ότι έχουμε HTML, Εντάξει έχουμε κάνει αυτό το μέρος της κεφαλής, ψάχνουμε μόνο στο σώμα, έτσι έχουμε κάποια περιοχή του σώματος. Και μέσα σε αυτό, το μόνο πράγμα που έχουμε είναι γειά σου, τον κόσμο. Εντάξει; Αν είχαμε τα πράγματα όπως κάποια π βραχίονα και, στη συνέχεια, Γεια σας, τον κόσμο, και στη συνέχεια ένα άλλο στήριγμα σ του αντίο, στον κόσμο, θα είχαμε δύο φυσαλίδες έρχεται από εδώ. Επειδή είναι τόσο κάτω από το σώμα, αλλά από όπου και αν ξεχωριστές παραγράφους αυτή η περίπτωση. Υπάρχει σίγουρα πρακτική για αυτό σε προηγούμενες κουίζ, καθώς και την αφθονία σε απευθείας σύνδεση σε αυτό. Εντάξει έτσι, αυτό αφήνει μόνο μας βλέπουν πάντα όμορφα και να χειριστείτε τα πράγματα πολύ συστηματικά. Εντάξει; Ξέρουμε ακριβώς πώς να ταξιδέψτε μέσα από αυτό το δέντρο, για να ξέρουμε τι θέλουμε να έχουν πρόσβαση. 

Εντάξει έτσι αυτό είναι ο λόγος που θέλουμε να έχουν αυτό το είδος του μοντέλου, έτσι ώστε να μπορούμε να χρησιμοποιήσουμε τα πράγματα όπως αυτό, και καταλαβαίνουμε τι σημαίνουν, και είναι τυποποιημένα σε όλα τα πράγματα που κάνουμε. Έτσι τίτλος dot έγγραφο είναι μόνο ο τίτλος του our-- όλα αυτά είναι αρκετά αυτονόητα, Θέλω να πιστεύω. Τρία Έτσι, η πρώτη παραδείγματα είναι απλά λέει, "Εντάξει, απλά να μου δώσει το τίτλος αυτής της ιστοσελίδας. " Γι 'αυτό θα σας δώσει ό, τι αντιστοιχεί στον τίτλο. 

Το σώμα του εγγράφου dot πρόκειται να σας δώσω ό, τι είναι μέσα σε αυτές τις ετικέτες του σώματος. Έτσι, μπορείτε να χειριστείτε αυτό. Και dot έγγραφο σώμα τελεία εισάγετε HTML είναι ένα πολύ δροσερό το ένα, και ίσως δεν είναι σαν σούπερ διαισθητική, αλλά η εσωτερική HTML αντιστοιχεί στο δικαίωμα αυτό εδώ. Έτσι, εάν θέλετε πάντα να χειραγωγήσουν το κείμενο σε μια σελίδα, συνήθως θα πάμε να κάνουμε κάτι με τελεία σώμα εσωτερική HTML. Εντάξει; Έτσι, η Inner HTML τείνει να αναφέρεται σε ό, τι είναι στην πραγματικότητα ανάμεσα σε αυτές τις ετικέτες. Εντάξει; Και τότε χρήσιμες λειτουργίες. Έτσι, αν θέλετε να πάρετε οποιοδήποτε από αυτά, κάθε στοιχείο, έχουμε κάποια ταυτότητα, την τάξη το όνομα ή το όνομα της ετικέτας. Αυτό είναι πολύ παρόμοιο με πράγματα που κάναμε με CSS, έτσι δεν είναι; Όταν έχουμε κάποια επιλογείς αντιστοιχεί είτε σε μια ετικέτα, μια κατηγορία ότι εμείς τους, ή ένα αναγνωριστικό δώσει. Αυτό είναι πάρα πολύ με τον ίδιο τρόπο. Αν έχετε κάτι που έχει κάποια τάξη του σκύλου, και λέτε να πάρει στοιχεία από το όνομα ετικέτας, και βάζετε το σκυλί σε there-- ή συγγνώμη, το όνομα της κλάσης. Μπορείτε να βάλετε τελεία εκεί. Είναι πρόκειται να επιστρέψει όλους εκείνους τα στοιχεία σας που έχουν αυτή την κατηγορία. Έτσι, μπορείτε να χειριστείτε μόνο εκείνους. Κατά τον ίδιο τρόπο, ίσως απλά θέλουν να χειραγωγήσουν κάποιο κεφαλίδα, έτσι κάποια επικεφαλίδα h1, όπως το κάναμε. Θα μπορούσατε να το κάνετε να πάρετε τα στοιχεία από την ετικέτα το όνομα, επειδή h1 είναι ένα όνομα ετικέτας. Και με τον ίδιο τρόπο, αν θέλετε να πάρετε κάποια μοναδικό πράγμα, μπορείτε να κάνετε get ετικέτα. Πάρτε το στοιχείο με ID. Και είναι πραγματικά πολλά από αυτά. Αυτά είναι μόνο όπως και τρεις από πάρα πολλές. Έτσι, αν πάτε σε απευθείας σύνδεση, όπως Πάω να ενθαρρύνουν μπορείτε να το κάνετε, και να κάνουμε κάποιες έρευνα για το δικό σας, Θα ήθελα να συστήσω σίγουρα εξετάζοντας όλα αυτά. Θα μπορούσαν να είναι σούπερ χρήσιμο, ειδικά όταν θέλετε να ακριβώς το είδος της χειραγωγήσουν πολύ συγκεκριμένα πράγματα, χωρίς να έχει για να περάσει και να δοκιμάσετε να αναλύσει τα πάντα. 

Εντάξει, έτσι το τελευταίο πράγμα Είναι javascript γεγονότα. Έτσι, όταν μιλούσα νωρίτερα για τη μετάβαση σε ένα δικτυακό τόπο, και όταν περνάτε πάνω από κάτι, ή το ποντίκι σας αιωρείται πάνω από κάτι, κάτι άλλο συμβαίνει. Αυτό είναι ό, τι θα θέλαμε να σκεφτείτε ως ένα γεγονός. Έτσι, αυτό που έχουμε που θα μπορούσαν να είναι χρήσιμο εδώ είναι onclick. Έτσι, η δική μου ήταν κάτω από το ποντίκι, το οποίο, είμαι αρκετά βέβαιος, είναι ακριβώς κάτω από το ποντίκι. Επίσης, ένας τόνος από αυτά ότι μπορείτε να αναζητήσετε. Υπάρχει μια ολόκληρη λίστα σε απευθείας σύνδεση από τα διαφορετικά πράγματα ότι μπορείτε να ακούσετε. 

Αλλά τα γεγονότα JavaScript είναι βασικά ακριβώς ανταποκρίνεται στα πράγματα ότι ο χρήστης σας κάνει. Σωστά; Έτσι, ο χρήστης σας κάνει κάτι, αυτό είναι ένα γεγονός, και JavaScript θα ανταποκριθεί Ωστόσο, θα ήθελα να αρέσει. Θα απαντήσει αναλόγως. Έτσι, σε αυτή την περίπτωση, έχουμε κάποια onload παράθυρο τελεία. Λοιπόν, τι λέει αυτό είναι, "περιμένετε μέχρι τη φόρτωσή του παραθύρου. " Εντάξει; Έτσι, όταν είναι φορτωμένο, onload όλα είναι, τότε μπορείτε να εκτελέσετε αυτή τη λειτουργία. Έτσι, όταν τα πάντα είναι φορτωμένο, θα πάμε να έχουν κάποια κουμπί αναζήτησης που παίρνει ένα στοιχείο από Id, και εκτυπώνει ό, τι αυτό στοιχείο είναι το κουμπί Αναζήτηση. Και στη συνέχεια, έχουμε αυτή τη μεταβλητή, λέμε, "Εντάξει, onclick". Έτσι, όταν ακούμε ένα κλικ στο κουμπί Αναζήτηση, εκτελέσετε αυτή τη λειτουργία, η οποία είναι μια συναγερμού, κάνατε κλικ στο κουμπί Αναζήτηση. 

Έτσι τι συμβαίνει is-- αυτό είναι ένα ωραίο μικρή γραφική αναπαράσταση εδώ. Έτσι, η φόρτωση του εγγράφου μας, ότι είναι onload μας, βρίσκουμε μας Αναζήτηση κουμπί, το οποίο είναι αυτό. Ψάχνουμε για το κουμπί αναζήτησης μας. Και στη συνέχεια, όταν το κουμπί αναζήτησης είναι κλικ, αυτό αντιστοιχεί σε ακριβώς εδώ. Onclick. Στη συνέχεια, προειδοποιεί τελικά χρήστη μας, η οποία είναι αυτή η τελευταία γραμμή εδώ. Εντάξει; Έτσι, κάθε ένα από τα τέσσερα αυτά βήματα μόνο αντιστοιχεί στα τέσσερα κουτιά εκεί κάτω στο κάτω μέρος. Μήπως αυτό έχει νόημα για όλους; 

Και τότε ένα πράγμα που είμαι απλώς πρόκειται να αναφέρω πολύ, πολύ σύντομα, ότι Σας ενθαρρύνουμε τα παιδιά να πηγαίνετε να δείτε περισσότερα σε είναι jQuery, η οποία είναι απλά μια βιβλιοθήκη ότι είναι χτισμένο στην κορυφή του το JavaScript. Είναι εξαιρετικά χρήσιμο, όπως με τις περισσότερες βιβλιοθήκες. Υπάρχουν πολλές λειτουργίες. Έτσι, αν υπάρχει ποτέ κάτι που θέλετε να κάνετε σε JavaScript, το πρώτο ένστικτό σας δεν θα πρέπει να σκεφτούμε του, "ποια λειτουργία θα πρέπει Έχω κώδικα; »θα πρέπει να είναι, "Επιτρέψτε μου να δείτε κάποιον είναι ήδη κάνει αυτό για μένα. " Επειδή εννέα φορές στις δέκα, κάποιος θα το έχουν κάνει ήδη, και μάλλον το έχουν κάνει καλύτερα. Οι άνθρωποι ξοδεύουν πολύ χρόνο να κάνει αυτά, και JavaScript χρησιμοποιείται ευρέως, έτσι ώστε οι άνθρωποι είναι συνεχώς προσπαθούν να κάνουν το καλύτερο. Και jQuery έχει πολλές λειτουργίες ότι κατά πάσα πιθανότητα θα είναι χρήσιμο σε εσάς στην τελική του έργου σας, αν είστε να κάνει τίποτα με το σχεδιασμό ιστοσελίδων. Όπως μου αρέσει να λέω, "εργασία εξυπνότερα, όχι σκληρότερα. " Εάν εσείς το κάνετε αυτό, θα είναι μεγάλη. Όταν είμαστε στο hackathon εγώ δεν κάνω θέλουμε να είστε όλοι τόνισε έξω. Θέλω να είναι όπως, «πήρα αυτό. jQuery πήρε πίσω μου. Δεν χρειάζεται να γράψω αυτές τις λειτουργίες. " 

Έτσι μόνο δύο πράγματα που πρέπει να θυμηθείτε, θα πάω να αφήσει εσείς φαίνονται περισσότερο σε jQuery για τη δική σας. Όλα Πάω να πω είναι ότι κάνει μερικά πολύ ωραία πράγματα και μπορεί να κάνει τη ζωή σας ένα πάρα πολύ ευκολότερο. Αλλά τι θέλετε να έχουν είναι ό, τι αρχείο ότι θα πάμε να το χρησιμοποιεί σε, θα πάμε να θέλουν αυτές τις δύο γραμμές. Θα πάμε να θέλουν το γραφή του js jQuery dot js. Και πράγματι πηγή σας πρόκειται να είναι κάποια διεύθυνση URL. Αν έχετε το Google jQuery, το Google φιλοξενεί στην πραγματικότητα όλα τα αρχεία σας. Έτσι, σίγουρα θέλετε να εισόδου ότι η διεύθυνση URL αντ 'αυτού. Έβαλα ακριβώς αυτό εδώ για λόγους απλότητας. Όλο αυτό σημαίνει ότι όπου να βρείτε jQuery βιβλιοθήκη σας. Είναι τεράστια, έτσι δεν θέλετε για να φιλοξενήσει στο δικό σας υπολογιστή αν μπορείτε να το αποφύγετε, το οποίο είναι ο λόγος που τείνουν απλά να βάλει στη διεύθυνση URL της Google ότι φιλοξενεί όλα αυτά τα αρχεία για σας. Εντάξει; Μπορείτε να το Google, το υπόσχομαι θα είναι εκεί. 

Και στη συνέχεια, ανεξάρτητα από Το JavaScript αρχείο που είστε χρησιμοποιώντας, έτσι αυτό είναι μόνο κάποια εξωτερική Αρχείο JavaScript που χρησιμοποιείτε. Με τον ίδιο τρόπο που συνδέονται με το CSS μας αρχείων, αυτό είναι το ίδιο πράγμα. Αυτό συνδέει μόνο στο αρχείο όπου JavaScript σας είναι. Και έχω μερικά παραδείγματα με απλή JavaScript. Γι 'αυτό και θα πρέπει να διέρχεται από αυτό. Και στη συνέχεια στο δείκτη σας το JavaScript, η οποία είναι JavaScript αρχείο σας εδώ, Αυτό είναι το είδος της συσκευασίας ότι έχετε για jQuery. Είσαι σχεδόν 99,9 τοις εκατό του χρόνου θα να έχει αυτό στην index.js αρχείο σας. Διότι τι λέει αυτό, "Δεν εκτελούν τίποτα μέχρι το έγγραφό σας είναι στην πραγματικότητα έτοιμα, "το οποίο είναι ακριβώς αυτό που θέλετε. Διότι, αν το έγγραφό σας δεν είναι έτοιμο, και jQuery αρχίσει να κάνει τα πράγματα, είναι απλά ένα χάος. Έτσι, μπορείτε πάντα θέλουν να έχουν αυτό το περιτύλιγμα. Και στη συνέχεια για πράγματα που πηγαίνουν εκεί, εγώ πρέπει να αφήσουν στο δικό περιεργάζονται τα παιδιά σας ». 

Εντάξει, έτσι Υπάρχουν ερωτήσεις σωστά τώρα περίπου το JavaScript γενικά; Ή το μοντέλο DOM; Αν όχι, έχουμε κάποιο δροσερό παραδείγματα που μπορούμε να πάμε μέσα, ότι εσείς μπορεί να με βοηθήσει κώδικα. Αλλά είμαι επίσης πρόκειται να είναι σούπερ ωραίο, και αν Δεν θέλω να πω τίποτα Γι 'αυτούς, αυτό είναι εντάξει. Μπορώ επίσης να σας δώσω παραδείγματα. Αλλά τίποτα σχετικά με το PowerPoint πριν προχωρήσουμε; Cool. 

Νιώθω σαν εσείς χρειάζεστε για την ενέργεια. Έτσι, νομίζω ότι θα πάμε για να ξεκινήσετε με το κόμμα παράδειγμα μου πρώτα. Έχουμε τρία παραδείγματα, έχετε την επιλογή σας. Έτσι έχουμε το ρολόι, όπου θα πάμε να εφαρμόσουν ένα πραγματικό ρολόι που είναι πρόκειται να ενημερώσει το πέρασμα του χρόνου. Έχουμε αυτή τη μεγάλη λειτουργία του Twitter. This-- ξέρετε τι, κρατήστε την. Εμείς πάμε για να κάνει αυτό να πάει μακριά. Μπαμ. ΟΚ. 

Έχουμε αυτή τη μεγάλη λειτουργία Twitter εδώ, that-- ξέρω, σωστά; Είναι πρόκειται να είναι μεγάλη. Είσαι ενθουσιασμένος παιδιά; Αυτό πρόκειται να μετρήσει τον αριθμό χαρακτήρων που έχετε αφήσει, οπότε αν πληκτρολογήσετε τώρα, προφανώς εξακολουθεί να λέει 140, αλλά ξέρουμε ότι δεν είναι η περίπτωση. Και στη συνέχεια, με το τελευταίο μας εδώ, κάντε κλικ εδώ για να διασκεδάσετε. Τι πρόκειται να συμβεί είναι όταν κάνουμε κλικ, το φόντο του πρόκειται να αλλάξετε τα χρώματα. Έτσι, εσείς έχετε τις επιλογές σας το οποίο θέλετε να κάνετε την πρώτη. Υπόσχομαι ότι θα τον πάρει πολύ εύκολο για σας. Νιώθω σαν ο καθένας στο είδος του μόνο πολύ χαμηλών τόνων και σήμερα. Γι 'αυτό θα σας καθοδηγήσει πώς θα εφαρμόσει όλα αυτά. Αν θέλετε να κόγχη σε, αυτό είναι σπουδαίο, αλλά εγώ αισθάνεται σαν ο καθένας είναι λίγο κουρασμένος. Γι 'αυτό θα σας καθοδηγήσει ακριβώς μέσω αυτών των παραδειγμάτων. Μήπως έχουμε κάτι που θα θέλαμε να κάνουμε πρώτα; Όποιος; Δεν προτίμησης; ΟΚ. Ξέρεις τι; Είμαστε στο κόμμα. Νιώθω σαν εσείς χρειάζεστε ένα little-- έτσι, εμείς θα κάνουμε το ένα μέρος για πρώτη φορά. ΟΚ. 

Έτσι, αυτό που έχουμε here-- ότι είναι δεν έπρεπε να είναι εκεί. Τώρα αυτό είναι καλό. ΟΚ. Έτσι, αυτό που έχουμε εδώ είναι μόνο μια απλή σελίδα HTML ότι εσείς θα πρέπει όλοι να είναι σούπερ εξοικειωμένοι με δύο τελευταίων psets σας. έχουμε μας τύπου doc εδώ. Μπορούν όλοι να δούμε; ΟΚ. Cool. Έχουμε HTML μας προφανώς. Έχουμε κάποια κεφαλίδα που είναι συνδέεται με ένα φύλλο στυλ που μόλις έκανε γραμματοσειρά μου ωραίο και μεγάλο και τολμηρό. Γι 'αυτό μην ανησυχείτε γι' αυτό. 

Έχουμε κάποια σώμα με ένα φόντο Id, εντάξει; Γιατί θα πάμε να είναι αλλάζοντας το φόντο. Έτσι όταν αλλάζουμε την φόντο του σώματός μας, θυμόμαστε από πριν από δύο εβδομάδες όταν έχουμε να κάνουμε με ιστοσελίδες. Έτσι καλό να έχει αυτό. Και έχουμε κάποια ταυτότητα ισούται με κόμμα. Αυτή η διαιτητής λίβρα σημαίνει απλώς ότι πρόκειται να πάει στην ίδια σελίδα. Και κάντε κλικ εδώ για πάρτι, η οποία είναι ο λόγος που όταν το κλικ, θα πρέπει να αλλάξετε τα χρώματα, ευτυχώς. 

Και τότε έχουμε κάποια σενάριο εδώ ότι συνδέεται μόνο γι αυτό το κόμμα js τελεία αρχείο, το οποίο είναι άδειο, διότι δεν έχουμε κάνει τίποτα ακόμα. Και είναι τόσο λυπηρό. Αλλά πολύ σύντομα, θα αλλάξει χρώματα, και θα είναι φοβερό. 

Έτσι είμαι απλώς πρόκειται να περπατάτε παιδιά μέσα από το πώς μπορούμε να προσεγγίσουμε το θέμα. Έτσι, το πρώτο πράγμα που θα μπορούσαμε να θέλουμε να κάνουμε, αν εμείς αλλάζουμε το φόντο του το σώμα, το πρώτο πράγμα που θα θελήσουμε να κάνετε είναι να αρπάξει τι το σώμα είναι, σωστά; Έτσι θέλουμε να έχουμε άθροισμα, μας φόντο, και αν παρατηρήσετε, Απλώς αυτόματα μόλις αρχίσετε να πληκτρολογείτε. Δεν υπάρχει τίποτα ιδιαίτερο που έχουμε πρέπει να κάνουμε για τα αρχεία μας το JavaScript. Μπορώ να ξεκινήσω δηλώνοντας μεταβλητές, και δηλώνοντας λειτουργιών τυχαία. Και είναι πολύ πιο ελεύθερη μορφή. Είναι όπως με τον C, δώσαμε όλοι σας αυτοί οι σκληροί κανόνες και μεγαλώσατε, έτσι είμαστε σαν, "πάει πίσω. Να είναι ελεύθεροι. Κάντε ό, τι θέλετε. " Και αυτό είναι ό, τι το JavaScript είναι. Έτσι έχουμε κάποιο υπόβαθρο εδώ. Με το μοντέλο DOM μας, εμείς ξέρουμε μπορεί να κάνει dot έγγραφο πάρετε το στοιχείο, και αν παρατηρήσετε εδώ, το σώμα μας έχει μια ταυτότητα. Σωστά; Έτσι μπορούμε να παίρνουν έγγραφο Id, και εδώ είναι απλή. Τι μας ταυτότητας που θέλουμε εδώ; Κοινό: Ιστορικό. ALLISON BUCHHOLTZ-ΑΕ: Ιστορικό. Τέλεια. Και ερωτηματικό στο τέλος. Αυτό δεν έχει φύγει ακόμα. Χρειάζεται ακόμα ερωτηματικά σας. ΟΚ. Έτσι, αυτό είναι το πρώτο από το δικό μας. Και όταν κάνουμε κλικ κάτι, θέλουν να συμβεί κάτι, έτσι δεν είναι; Έτσι, μπορούμε να θέλετε κάποια μεταβλητή ότι περιμένει για ένα κλικ. Τι θα πάμε να κάνουμε είναι να πάμε να κάνει ο σύνδεσμός μας πιο παρόμοιο με ένα κουμπί. Έτσι θα πάμε να έχουν κάποιο κουμπί που ισούται τεκμηριώνει dot πάρει το στοιχείο από Id. Και αν μιλάω για το κάντε κλικ στο σύνδεσμο ή κάντε κλικ εδώ για πάρτι σύνδεσμος, τι θα μπορούσε να Id μου είναι εδώ; Κόμμα. Σωστό. Εντάξει δεν είναι και τόσο άσχημα μέχρι στιγμής. Ο καθένας να πάρει ό, τι κάνουμε; 

Εντάξει, έτσι τώρα έχουμε μας κουμπί, και θέλουμε να αλλάξουν τα πράγματα, όταν κάνουμε κλικ σε αυτό. Έτσι, αν θυμόμαστε από το PowerPoint μας, πολύ απλό πράγμα που μπορούμε να κάνουμε είναι απλώς τελεία κουμπί onclick, σωστά; Και αυτό πρόκειται να είναι ίση με κάποια λειτουργία. Αυτή είναι μια ανώνυμη συνάρτηση. Και αυτό ακριβώς as-- πραγματικά είμαι πρόκειται να κάνει αυτό το ένα λίγο μεγαλύτερο. 

Έτσι, ό, τι έκανα ακριβώς εδώ είναι που λέω, εντάξει, όταν κάνετε κλικ στο κουμπί μας, η οποία είναι αυτό το σύνδεσμο που μόλις αναφέρθηκα, πρόκειται να εκτελέσει Αυτή η ανώνυμη λειτουργία. Δεν χρειαζόμαστε εισροές. Δεν με νοιάζει τι λέει ο χρήστης. Όταν κάνετε κλικ σε αυτό, είμαστε Θα κάνουμε ό, τι θέλουμε, που είναι να αλλάξετε το χρώμα του φόντου. Εντάξει; Έτσι, γι 'αυτό και δεν έχουμε κανένα εισόδους, έχουμε μόνο αυτήν την ανώνυμη συνάρτηση. Και τώρα είμαστε στην πραγματικότητα θα να γράψω αυτή τη λειτουργία. 

Έτσι, υπάρχει ένα σωρό τρόπους σας θα μπορούσε να δημιουργήσει ένα τυχαίο χρώμα. Ο τρόπος που έκανα ήταν να παράγει τρεις τυχαίους αριθμούς και τη μετατροπή τους σε ένα τριπλό RGB. Έτσι, αυτό σας δείχνει ακριβώς κάποιο δροσερό πράγματα που αν είστε όπως, «Ω, Πρέπει να δημιουργήσει ένα τυχαίο τον αριθμό. "αν το Googled, Αυτό είναι ό, τι θα βρείτε. 

Έτσι, έχουμε τρεις διαφορετικές τα πράγματα, var, δεν είναι κόκκινο και πάλι, πράσινο. Σωστά; Έτσι, αυτά είναι τα τρία πράγματα που συνθέτουν ένα χρώμα. Μπλε, κόκκινο και πράσινο. Cool. Και τι μπορούμε να κάνουμε είναι να ξέρουμε ότι πρέπει να είναι μεταξύ 255, και αν κοίταξε μερικά γεννήτρια τυχαίων αριθμών, θα μπορούσατε να πάρετε κάτι σαν τα μαθηματικά dot τυχαία, το οποίο αν κοιτάξετε αυτό επάνω επιστρέφει σε κάποιο αριθμό μεταξύ μηδέν και ένα. Εντάξει; Και τι κάνουν οι αριθμοί μας Τριάδες RGB πάει μεταξύ; Μηδέν και τι; Τι μπορεί να πάει μέχρι; 255. Έτσι, αν τα μαθηματικά dot τυχαία πηγαίνει μεταξύ μηδέν και ένα, Πώς μπορούμε να θέλετε να μετατρέψετε αυτό; ΚΟΙΝΟ: Ώρα; ALLISON BUCHHOLTZ-ΑΕ: Ναι, ακριβώς. Έτσι, ο χρόνος είναι 255. 

ΚΟΙΝΟ: [δεν ακούγεται] Είναι σαν [δεν ακούγεται]. ALLISON BUCHHOLTZ-ΑΕ: Μαθηματικά dot τυχαία. ΚΟΙΝΟ: Cool. ALLISON BUCHHOLTZ-ΑΕ: Ναι. JavaScript διαρκεί μόλις φροντίδα σας. ΟΚ. Έτσι, μπορούμε να το κάνουμε αυτό για όλα αυτά. Σωστά; Μαθηματικά dot τυχαίες χρονικές στιγμές 255. Αντιγράψτε αυτό. Cool. Έτσι, το θέμα είναι, αυτό μπορεί να δεν επιστρέφουν έναν ακέραιο. Σωστά; Ίσως έχουμε κάποια αριθμός μεταξύ μηδέν και ένα, και το αναγκάζει να είναι ελαφρώς μακριά, και RGBS μας δεν μπορεί να επιπλέει. Πρέπει να είναι ints. Έτσι, εάν έχετε δοκιμάσει αυτό, θα ήταν πιθανώς έχουν κάποια αλλοπρόσαλλη συμπεριφορά. Θα ήταν λίγο funky. Έτσι, αυτό που κάνουμε είναι να θέλουμε να κάνουμε βέβαιος ότι αυτά είναι στρογγυλεμένες, και θα μπορούσε να στρογγυλοποιεί ή τον άλλο τρόπο. Θα στρογγυλοποιείται με το δάπεδο. Γι 'αυτό και φρόντιζε πάντα ότι στρογγυλοποιείται προς τα κάτω. Αλλά να βγαίνουν εκτός του πόσο απλό ήταν να πάρει μόνο ένα τυχαίο αριθμό, πώς νομίζετε ότι θα μπορούσε πάτωμα αυτόν τον αριθμό; Είναι πολύ παρόμοια. Οποιαδήποτε ιδέα; Έτσι, αν τυχαία ήταν απλά μαθηματικά τελεία τυχαία, έτσι νομίζετε ότι θα κάναμε πάτωμα; Μαθηματικά πάτωμα τελεία. Και μπορείτε επίσης να κάνετε οροφή dot μαθηματικά. Γύρος είναι το είδος της διφορούμενη γιατί δεν το κάνετε ξέρω αν πρέπει να στρογγυλοποιεί προς τα πάνω ή στρογγυλοποίηση προς τα κάτω. Έτσι, συνήθως κάνουμε πάντα μαθηματικά dot δάπεδο, οροφή μαθηματικά τελεία. Αλλά honestly-- 

ΚΟΙΝΟ: Μήπως γύρο πάτωμα κάτω; 

ALLISON BUCHHOLTZ-ΑΕ: Όροφος γύρους κάτω. Και αυτό είναι μόνο μια επιλογή από την πλευρά μου. 

Μέχρι τώρα έχουμε τρεις αριθμούς μας τα οποία έχουν τυχαία, και τι θα πάμε να κάνουμε τώρα είναι να είμαστε ακριβώς πρόκειται να αλλάξει το φόντο. Εντάξει; Έτσι, έχουμε ήδη μας φόντο το είδος των αποθηκευμένων σε αυτό το στοιχείο που ονομάζεται φόντο. Έτσι, αυτό που θα παρατηρήσετε είναι, αν που έπαιξε με αυτό, θέλουμε να αλλάξουμε το στυλ. Και αυτό είναι το είδος του κάτι που θα το Google και να καταλάβω, όπως το πώς να αλλάξετε το χρώμα. 

Αλλά ο τρόπος που έχετε πρόσβαση σε αυτό το χρώμα είναι φόντο dot φόντο στυλ τελεία. Έτσι, αυτό που λέει δίνεται αυτό το αντικείμενο, φόντο, το οποίο αναφέρεται στο ότι στοιχείο Id εκεί πάνω, θα πάμε να δούμε το στυλ μέσα στο στυλ, θα πάμε να δούμε το παρασκήνιο. Εντάξει; Και αν πάτε και να εξετάσουμε αυτό επάνω, θα μπορούσε να κάνει λίγο περισσότερο νόημα, αλλά αυτό είναι βασικά ακριβώς λέει, «Δώσε μου αυτό το πολύ ιδιαίτερο χαρακτηριστικό από ό, τι έχω οριστεί νωρίτερα. " Έτσι, αυτό που είμαστε είναι η αλλαγή να είναι μερικά RGB, επειδή είναι λογικό. Είμαστε χρησιμοποιώντας RGB τριάδες, σωστά; Και εμείς have-- θέλω να είμαι σίγουρη ότι να πάρει το σωστό αριθμό εισαγωγικά εδώ. Έτσι, αυτό που κάνουμε είναι να έχουμε RGB, και θα πάμε to-- αυτό είναι σαν συνένωσης, που είναι κόκκινο. Και μετά θέλουμε κάποιο κόμμα. Και μετά θέλουμε καθώς και το πράσινο, στη συνέχεια κάποιες κόμμα, και κάποια μπλε. 

Έτσι, αυτά τα απλά συν Εννοείς σαν αλληλουχία. Έτσι, αυτό είναι μόνο η δημιουργία αυτή συμβολοσειρά που συμβαίνει μέσα σε RGB. Εντάξει; 

ΚΟΙΝΟ: [δεν ακούγεται] συν συνέχεια το πράσινο είναι ένα συν, στη συνέχεια, το κόκκινο. 

ALLISON BUCHHOLTZ-ΑΕ: Ναι, επειδή έκανα θάλασσα το επάνω. Προστίμου το οποίο κανείς. Ω, κρατήστε την. Όχι. Γιατί πρέπει να βεβαιωθείτε ότι πήρα όλα αυτά τα δεξιά. Γι 'αυτό και θα εξηγήσω σε uno momento. Πράσινο, μπλε, τέλεια. Τώρα είμαι γίνει. Πιστεύω. 

ΟΚ. Έτσι τι είναι αυτό, είναι ότι φόντο πρόκειται να ρυθμιστεί σε κάποιο κορδόνι. Σωστά; Ποιο είναι αυτό που έχουμε εδώ. Είναι πρόκειται να είναι κάποια RGB 255 κόμμα 255 κόμμα μηδέν, ή ανεξάρτητα από τον αριθμό σας έχουν εκεί. Έτσι κάνουμε εδώ, έχουμε κάποια χορδή. Και τι θέλουμε να κάνουμε, είναι να είμαστε είδος δυναμικά δημιουργώντας ότι όταν εμείς τρέχουμε αυτό το πρόγραμμα. Έτσι, αυτό είναι κάποιο κορδόνι. Πλέον συνενώνει με η αξία που έχει το κόκκινο, ο οποίος συνενώνει με ένα κόμμα, το οποίο συνενώνει με ποιο πράσινο είναι, και ούτω καθεξής, και ούτω καθεξής. Εντάξει; Μέχρι το τέλος, η οποία είναι η κλείσιμο παρενθέσεις αυτής RGB εδώ. Εντάξει; 

Έτσι αυτό πρόκειται να παράγουν είναι κάποια εντολή πραγματικά ότι είναι RGB των τριών αριθμών ότι φόντο καλείται τώρα να. Εντάξει; Ας δούμε αν αυτό λειτουργεί. Ελπίζω να το κάνει, γιατί αν δεν, Πάω να είναι πραγματικό λυπηρό. Ω, όχι. Εντάξει, κρατήστε την. Σίγουρα φόντο dot στυλ φόντου τελεία. Είμαι σίγουρα λείπει κάτι λίγο μικρό. Μην σας παιδιά μισούν αυτό; Όταν αυτό είναι μόνο ένα μικρό μικρό λάθος; Παντοδύναμος φόντο. RGB. 

ΚΟΙΝΟ: [δεν ακούγεται] ALLISON BUCHHOLTZ-ΑΕ: Όχι. Δοκίμασα αυτό πριν το μάθημα. Έχω ό, τι έκανα πριν τάξη σε περίπτωση που ήταν σαν, "Περιμένετε, τι έκανα λάθος;" Επειδή ήμουν όπως, "Μάλλον θα χάος αυτό επάνω σε κάποιο σημείο. " Πλέον το πράσινο. Τα πάντα φαίνεται σαν να είναι concatenated σωστά. ΟΚ. 

ΚΟΙΝΟ: [δεν ακούγεται] 

ALLISON BUCHHOLTZ-ΑΕ: Ω, εκεί θα πάτε. Αυτό είναι ό, τι χρειαζόμουν. Κοίτα αυτό. Tiffany για τη διάσωση. Τέλεια. ΟΚ. Τώρα ας δούμε αν αυτό δουλεύει. Θεέ μου. ΟΚ. Περίμενε. 

ΚΟΙΝΟ: Διάστημα μετά το δεύτερο συν. 

ALLISON BUCHHOLTZ-ΑΕ: Ποιο από τα δύο; Ω περιμένετε, κρατήστε την. Φθορά Διάστημα; 

ΚΟΙΝΟ: Δεύτερη συν σε το πράσινο συνένωση. ALLISON BUCHHOLTZ-ΑΕ: Αχ. ΚΟΙΝΟ: Δεν υπάρχει χώρος μετά την συν, ναι. ALLISON BUCHHOLTZ-ΑΕ: Μπορείτε Δεν χρειάζεται ότι, but-- ΚΟΙΝΟ: Ω, δεν το κάνετε; ALLISON BUCHHOLTZ-ΑΕ: Φαίνεται αρκετά. ΚΟΙΝΟ: Εντάξει. ΟΚ. 

ALLISON BUCHHOLTZ ΑΕ: Ας δούμε αν αυτό λειτουργεί. ΟΚ. Είμαι προφανώς αποτυγχάνει σε Αυτή η επίδειξη, η οποία μου θυμίζει μιας διάλεξης την άλλη εβδομάδα, αλλά ξέρω ότι αυτό θα λειτουργήσει. Ξέρω ότι αυτό θα λειτουργήσει. Τόσο κοντά. Εκτός Διέγραψα κατά λάθος σενάριό μου σε αυτό το σημείο. Όχι, αυτό είναι τελεία κόμμα JS. ΟΚ κρατηθώ. Πάω να αντιγράψετε αυτό, και είμαι επίσης ακριβώς πρόκειται να διαγράψει τα πάντα, επειδή είχα αυτή την εργασία νωρίτερα. 

Υπόσχομαι ότι λειτουργεί. Αν όχι, εγώ θα σας δείξει τι Tommy είναι. Και εκεί. 

ΚΟΙΝΟ: Είσαι αναφορά κόμμα dot CSS, και αυτό είναι ένα js κόμμα τελεία. 

ALLISON BUCHHOLTZ-ΑΕ: Αχ, καλά εδώ είναι JS τελεία κόμμα. Εντάξει, τι έκανα διαφορετικά; Εντάξει, θα δούμε αν αυτό λειτουργεί τώρα. Μπαμ. Έτσι, δεν ξέρω τι έκανα με διαφορετικό τρόπο, αλλά αυτό είναι ό, τι πρέπει να συμβεί. Κάπως δροσερό. Χτύπησα σε αυτό, όπως, για πάντα. Αλλά μπορούμε να προσπαθήσουμε και να δούμε τι έκανα με διαφορετικό τρόπο ότι αυτό είχε. Δεν ξέρω για σας παιδιά, αλλά αυτό φαίνεται βασικά αυτό που μόλις έγραψα. Υπάρχει πιθανώς ήταν ένας λείπει ερωτηματικό κάπου είναι το πράγμα μου. Στην πραγματικότητα μετά, νομίζω ότι έλειπε ένα ερωτηματικό εδώ στην πραγματικότητα. Αλλά δεν θα μπορούσα να το δείτε γιατί ήταν έξω από την οθόνη. 

Αλλά αν παρατηρήσετε, αυτό είναι αρκετά πολύ ακριβώς αυτό που μόλις έγραψα. Νομίζω ότι ίσως το πιο δύσκολο κομμάτι για Αυτό είναι ακριβώς το είδος του αυτό το πράγμα σωστά εδώ, κατανόηση τι κάνει εκεί. Αυτά τα είδη των πραγμάτων να μάθετε πραγματικά μόνο με Googling και ειλικρινά απλώς προσπαθεί. Αν νομίζετε ότι υπάρχει κάποια αποδίδουν, κατά πάσα πιθανότητα υπάρχει. Έτσι, δοκιμάστε το. Δείτε τι συμβαίνει. Όπως είπα, υπάρχει πολλή πειραματισμό με JavaScript, και PHP, και όλα αυτά πράγματα, και CSS ιδιαίτερα. Αυτό είναι το μόνο αληθινό τρόπος για να το καταλάβουν. 

Εντάξει, έτσι ώστε μετά από αυτό το φιάσκο με το κόμμα του dot js, έχουμε δύο άλλες επιλογές. Έχουμε το ρολόι ή το Twitter. Είναι τόσο ενδιαφέρουσα. Ίσως δεν είναι τόσο διασκεδαστικό όσο κόμμα, η οποία είχε ένα δροσερό μικρό strobing πράγμα στο τέλος. Μήπως εσείς έχετε κάποια προτίμηση; ΚΟΙΝΟ: ρολόι; ALLISON BUCHHOLTZ-ΑΕ: ρολόι; ΟΚ. Cool. 

Έτσι και πάλι, έχουμε μας κενό αρχείο JavaScript. Και όπως βλέπουμε εδώ, εμείς έχουν κάποια πολύ απλή HTML. Έχουμε φύλλο στυλ μας, ότι μόλις Μορφές τι πρέπει να μοιάσει. Έχουμε div μας με ένα αναγνωριστικό του ρολογιού, το οποίο ακριβώς λέει, "αυτό θα πρέπει να είναι ένα ρολόι." Και έχουμε σύνδεσμος μας στο αρχείο μας JavaScript ότι είναι πραγματικά πρόκειται να παράγουν το ρολόι μας για εμάς. Επειδή το δροσερό πράγμα είναι ότι μπορείτε να που Javascript για να ανανεωθεί αυτόματα η ίδια. Εντάξει; Έτσι, αντί να περιμένουν για το χρήστη να χτυπήσει Ανανέωση σε μια σελίδα έτσι ώστε να μπορείτε να πάρετε ενημερωμένο χρόνο, το JavaScript μπορεί να ενημερώσει, ωστόσο θέλει. 

Έτσι, όπως και με το τελευταίο μας, θελήσαμε να έχουν πρόσβαση σε φόντο μας, σωστά; Λοιπόν, τι νομίζετε ότι θα μπορούσε να είναι η το πρώτο πράγμα που θέλουμε να κάνουμε εδώ; Αν είμαστε είδος θα off Αυτό το είδος του παραδείγματος εδώ; Εμείς μάλλον θα θέλετε να πρόσβαση ρολόι μας, σωστά; Έτσι, έχουμε κάποια var ρολόι, το οποίο equals-- τι νομίζουμε ότι πρόκειται να είναι; Έγγραφο πάρει τελεία στοιχείο by-- ήθελα επίσης αγαπούν Sublime-- Id και μας ταυτότητας είναι το ρολόι. Τελεία. Πήρε να σιγουρευτείτε για να πάρετε αυτά τα ερωτηματικά αυτή τη φορά, γιατί νιώθω ότι ήταν το πρόβλημα την τελευταία φορά. Εντάξει έτσι, όπως ήμουν απλά λέγοντας με την προσπάθεια να έχει την JavaScript ανανεώσετε το ίδιο, υπάρχει αυτή η μεγάλη λειτουργία, εγώ ξέρετε ότι ήρθε σε πρακτικό το περασμένο έτος, Δεν είμαι σίγουρος ότι έρχεται σε βολικό για αυτό το chipset, αλλά αυτό λέγεται σύνολο διάστημα. Και αυτό είναι πραγματικά πολύ δροσερό αν εσείς κάνετε τίποτα με το χρόνο ή να πάρει ενημερωμένες πληροφορίες. Σε μια ιστοσελίδα για την τελική σχέδιο, αυτό είναι πιθανώς μια λειτουργία που θέλετε να πάρει σούπερ εξοικειωμένοι με. Έτσι, αυτό που κάνει είναι το διάστημα που θα πάμε να δώσουμε μια λειτουργία, και πόσο συχνά θα πρέπει να καλέσετε τη συνάρτηση αυτή. Εντάξει; 

Έτσι, σε αυτή την περίπτωση, είμαστε ακριβώς πρόκειται να δημιουργήσει κάποια ανώνυμη συνάρτηση και πάλι, Εντάξει, αυτό πρόκειται να πάρει ημερομηνία μας, και το χρόνο μας, και στη συνέχεια να ενημερώσετε τα πράγματα και να το εμφανίσετε. Έτσι θα ανησυχείτε για αυτό. Θα είναι σαν να δημιουργήσει ρολόι εδώ. Αλλά αυτό που χρειαζόμαστε είναι το πώς συχνά για να το ανανεώσετε. Έτσι, σε αυτή την περίπτωση, είναι ακριβώς χιλιοστά του δευτερολέπτου. Έτσι, είμαστε ακριβώς πρόκειται να κάνει 100 χιλιοστά του δευτερολέπτου. Φυσικά, εντελώς αυθαίρετη. Αν ήθελε να ενημερώσετε πολύ πιο αργά, θα μπορούσατε. Μπορούμε να το χάος γύρω με το καθορισμένο διάστημα, πόσο μεγάλο χρονικό διάστημα μας είναι μετά παίρνουμε ένα ρολόι εργασίας, η οποία ελπίζω ότι θα φτάσουμε. Έτσι, αυτό ακριβώς λέει, "Εντάξει, κλήση Αυτή η λειτουργία κάθε 100 χιλιοστά του δευτερολέπτου. " Εντάξει; Αυτό είναι το μόνο που κάνει. 

Γι 'αυτό θέλουμε τη λειτουργία μας στο κάνουμε είναι να θέλουμε να έχουμε κάποια ημερομηνία και κάποια στιγμή είναι ό, τι θα πάμε να έχουν. Έτσι μπορούμε να ξεκινήσουμε με μας ημερομηνία ισούται με κάτι, και του χρόνου μας ισούται με κάτι ότι δεν ξέρουμε ακόμη. Ή στην πραγματικότητα, το μόνο που χρειάζεται σήμερα, επειδή ημερομηνία πρόκειται να περιλαμβάνει τα πάντα. Και πάλι, αν έχετε μόνο το Google τίποτα για τι θέλετε να κάνετε, αν γράφετε, "Εντάξει, Θέλω να πάρω το χρόνο μέσω JavaScript, "το θα σας δώσει αυτή τη μεγάλη συνάρτηση που ονομάζεται ημερομηνία πάρει. Κυριολεκτικά, τα περισσότερα πράγματα ότι θέλετε να κάνετε, Το JavaScript θα έχει το κάνει για σας ήδη. Έτσι είναι κυριολεκτικά σαν καινούριο να πάρει ημερομηνία, η οποία είναι creating-- ή νέα ημερομηνία, rather-- η οποία δημιουργεί κάποιο αντικείμενο που αντιπροσωπεύει μια ημερομηνία. 

Και τι θα πάμε να κάνουμε εδώ είναι Αυτό is-- Πάω να γράψω αυτό, και στη συνέχεια να εξηγήσει τι κάνει. Γι 'αυτό θα βεβαιωθείτε ότι έχω αυτό το δικαίωμα. 

Εντάξει, έτσι τι αυτή η λειτουργία κάνει, είναι ότι είμαστε μόνο τη δημιουργία της HTML που είναι πραγματικά πρόκειται να πάει μέσα div id μας ρολόι. Έτσι αυτό πρόκειται να κάνει είναι απλά παράγοντας κάποια χορδή, εντάξει; Αυτό, στη συνέχεια, θα είναι μεταμοσχεύθηκαν σε HTML μας. Βασικά αυτό που πρόκειται να κάνουμε είναι να ό, τι we-- τι θα σου δείξω είναι πως ό, τι λέμε HTML είναι, θα πάμε να αντικαταστήσετε αυτό το κείμενο εδώ με ό, τι HTML είναι. Έτσι, αυτό πρόκειται να επιτρέψει να αλλάξουμε το ρολόι ακίδων μας HTML από το να είναι απλώς το κείμενο αυτό θα πρέπει να είναι ένα ρολόι, για να δείχνει στην πραγματικότητα οι αριθμοί και τα πράγματα που μας ενδιαφέρει περίπου, και στην πραγματικότητα είναι η ώρα. 

Λοιπόν, τι θα πάμε να κάνουμε είναι να είμαστε πρόκειται να αρχίσει να παράγει αυτό το HTML. Έτσι, κατά τον ίδιο τρόπο που χρησιμοποιήσαμε να κάνει συν ισούται για ακέραιους αριθμούς, μπορείτε τώρα να το κάνουμε αυτό για έγχορδα, εκτός του ότι πρόκειται να τους ενώσετε. Σωστά; Όπως είδαμε με τελεία κόμμα js, αυτό ακριβώς συνενώνει όλα αυτά τα πράγματα μαζί. Έτσι, μπορείτε να ενώσετε διαφορετικά κομμάτια του HTML από μεταβλητές, ή κομμάτια της χορδές ότι θα γράψουν τον εαυτό σας, και αυτό ακριβώς πραγματικά σας επιτρέπει να δυναμικά παράγουν HTML, το οποίο είναι αρκετά δροσερό. Έτσι, εάν έχετε κάτι πολύ συγκεκριμένο χρήστη, Αυτό μπορεί να σας επιτρέψει να το κάνουμε αυτό. 

Έτσι έχουμε HTML, να πάω να να προσπαθήσουμε και να βεβαιωθείτε ότι έχω αυτό το δικαίωμα. Έτσι θα πάμε να κάνουμε κάποια επικεφαλίδα h1. Έτσι, αυτό που είναι σημαντικό να συνειδητοποιήσουμε εδώ είναι ότι αυτό είναι πραγματικά μόνο HTML. Σωστά; Γράφουμε πραγματική Ο κώδικας HTML εδώ, είναι όχι μόνο ένα string στην κανονική τρόπο που θα το σκεφτώ. Έτσι έχουμε κάποια HTML. Αυτό θεωρείται ένα string εδώ όμως. Και εμείς κάνουμε ημερομηνία dot-- εμείς θέλουν να πάρουν ώρες μας. Και πάλι, αν ήταν να εξετάσουμε οτιδήποτε για την ημερομηνία, θα σας πω όλα αυτά είναι τα χαρακτηριστικά που έχει ημερομηνία. Και εδώ είναι που μπορείτε να χρησιμοποιήσετε για αυτό. Γι 'αυτό έχει πιθανώς τα πράγματα όπως να πάρει ώρες, και να πάρει λεπτά, και να πάρει δευτερόλεπτα, και να πάρει χιλιοστά του δευτερολέπτου, και ποιος ξέρει τι άλλο έχουν. Αλλά αν εξετάσουμε το τεκμηρίωση, όλα θα είναι εκεί. 

Έτσι έχουμε πάρει ώρες, και, στη συνέχεια, θα θέλαμε να ενώσετε ότι with-- είμαι πρόκειται να κινηθεί αυτό εδώ. Έτσι, αν είμαστε παράγουν τώρα, είμαστε στην πραγματικότητα παράγει το χρόνο, σωστά; Έχουμε ώρες, και στη συνέχεια ό, τι είναι ανάμεσα στις ώρες και τα λεπτά; Έχετε ένα ερωτηματικό, σωστά; Έτσι θέλουμε να κάνουμε κάποια ερωτηματικό εδώ. Και τότε θα θέλετε να πάρετε μας λεπτό, έτσι ώστε με τον ίδιο τρόπο ότι έχουμε ημερομηνία dot πάρει ώρες, Πώς μπορούμε να πάρει λεπτά μας; Είναι κυριολεκτικά η ημερομηνία με την τελεία να πάρει λεπτά, το οποίο εγώ το είδος του αρέσει. Είναι σαν, "Ω, πόσο μπορώ να πάρω λεπτά μου; " Θέλω μόνο να πάρει λεπτά μου. 

ΟΚ. Και στη συνέχεια, έχουμε μια άλλη παχέος εντέρου εδώ. Και τότε, αν θέλουμε να πάρει μας δευτερόλεπτα, πώς θα μπορούσαμε να πάρει το δεύτερο μας; Ημερομηνία dot πάρει δευτερόλεπτα. Νομίζω ότι είναι αρκετά δροσερό. Και τι είναι σημαντικό για συνειδητοποιούν, είναι ότι έχουμε επίσης πρέπει να κλείσει ετικέτα HTML μας εδώ, διότι θα πρέπει να εξακολουθεί να ισχύει HTML, έτσι h1. Cool. 

Έτσι, μετά από αυτό, μπορούμε να κάνουμε το ρολόι dot εσωτερικό HTML είναι ίση με την HTML. Εντάξει; Έτσι θυμάμαι πως είπα εσωτερική HTML βασικά παίρνει ό, τι είναι μεταξύ των δύο ετικέτες που μιλήσαμε για και ένθετα ή χειραγωγεί ό, τι είναι εκεί; Έτσι, αυτό που κάνει αυτό, αν πάμε πίσω στο ρολόι μας, είναι ότι το ρολόι αναφέρεται σε πάντα μέσα σε αυτό div. Αυτό είναι το εσωτερικό HTML του ρολογιού Id div. Και γι 'αυτό πρόκειται να αλλάξει σε η HTML που μόλις δημιουργείται, το οποίο, η οποία, ευτυχώς, ελπίζω, ελπίζω, θα δείξει το χρόνο τώρα. Θα δούμε. Φυσικά. Έτσι, πολλά τεχνικά θέματα. Just-- του Allison είμαι μακριά μου παιχνίδι σήμερα παιδιά. Εντάξει, η οποία εργάζεται. ρολόι dot εσωτερικό HTML. Ήταν HTML Αλήθεια; Επίσης, αυτό είναι αυτό που συμβαίνει. Όταν δεν μπορείτε να δείτε κάτι που, απλά κοιτάξτε τον πηγαίο κώδικα σας. ΟΚ. Μήπως θέλετε να ξέρετε ένα δροσερό έργο γύρω ότι θα πάμε να κάνουμε εδώ; 

ΚΟΙΝΟ: Μπορείς να το κάνεις με κεφαλαία γράμματα; Τα κεφαλαία γράμματα; Επειδή έχετε πάρει ώρες, και στη συνέχεια να πάρει λεπτά. 

ALLISON BUCHHOLTZ-ΑΕ: Είναι είναι να πάρει ώρες και get-- oh. Μπορείτε are-- χρυσό αστέρι. Είναι όλα μια δοκιμή, παιδιά. Υπόσχομαι ότι δούλευε πριν το μάθημα. 

ΟΚ, αλλά κάτι δροσερό για να ξέρετε είναι ότι μπορείτε να also-- αν μερικές φορές εξωτερικά αρχεία σας να πάρει λίγο τρελός, μπορείτε επίσης να τα βάλει μόνο κατ 'ευθείαν εδώ, η οποία τείνει να διορθώσει τα πράγματα. Εκτός από αυτό είναι σαν πραγματικά άσχημο. Φυσικά μορφοποιήσετε τα πάντα. Βεβαιωθείτε ότι είναι όλα πολύ. ΟΚ. 

Ήθελα να κάνω όλα τα δροσερά επιδείξεις, και από όπου και αν απλά δεν εργάζονται έξω. ΟΚ. Σενάριο ρολόι var. Anyways, αυτό που είναι σημαντικό είναι ότι αυτός είναι ο γενικός τρόπος ότι θα διαμορφώσετε το JavaScript. Όπως μπορείτε να δείτε, μπορεί να είναι πολύ σχολαστικός μερικές φορές, ακόμη και όταν ήταν κυριολεκτικά εργάζονται πριν από δύο δευτερόλεπτα. Ή όχι δύο δευτερόλεπτο πριν, αλλά πολύ, πολύ πρόσφατα. 

Έτσι, για να σας δείξει τι πρέπει να μοιάζει, και να σας δείξω ότι δεν είμαι τρελός, και ότι τα πάντα είναι ακριβώς η ίδιο, αυτό είναι ό, τι πρέπει να μοιάσει. Είστε ακριβώς πρόκειται να κάνει αυτό το άνω τμήμα εδώ, και αν δείτε τη σελίδα πηγή, αν παρατηρήσετε, έκανε μερικά τα πράγματα πιο τρελός, μου απλοποιημένη. Επίσης, οι πιστώσεις προς τον Tommy McWilliam, ο οποίος στην πραγματικότητα βοήθησε να δημιουργήσει αυτά τα παραδείγματα, η οποία είναι ο λόγος που ξέρω ότι δουλεύουν. Επειδή ο Tommy είναι ένα master JavaScript. Αλλά αν παρατηρήσετε, έχουμε κάποιο σύνολο. Έχουμε τη λειτουργία του ρολογιού μας εδώ. Αυτή είναι όλη η JavaScript που εμείς απλά έγραψε, ή ορισμένα από αυτά. Γράψαμε ακριβώς αυτό το δικαίωμα εδώ. Και έχει ένα επιπλέον λειτουργία που απλά μαξιλάρια βάζοντας ένα μηδέν πριν επιστολή ή πριν από έναν αριθμό, εάν είναι μόνο μία από αυτές. Έτσι, αν παρατηρήσετε, αυτό είναι αρκετά πολύ ακριβώς αυτό που μόλις έγραψα. Έχετε κάποια μεταβλητή ρολόι ότι έχει το στοιχείο μας, να πάρετε το στοιχείο με ID, που είναι το ρολόι. Έχουμε διάστημα σετ μας λειτουργία, ότι είναι μια ανώνυμη συνάρτηση ότι εκτελεί όλα αυτά. Έχουμε κάποια ξεκινώντας σειρά HTML που εμείς τότε δυναμικά παράγουν έχοντας κάποια h1 κεφαλίδα, να συνενώσει με να πάρει τις ώρες, συν του παχέος εντέρου μας, καθώς και να πάρει τα πρακτικά, συν ένα άλλο του παχέος εντέρου, καθώς και δευτερόλεπτα μας, και, τέλος, το τελικό HTML για αυτό. Και τότε θα ενημερώσει το ρολόι μας dot εσωτερικό HTML σε HTML, και θα ανανεώνονται κάθε 100 χιλιοστά του δευτερολέπτου. Εντάξει; 

Δείτε Υπόσχομαι ότι δεν είμαι τρελός. Δεν ξέρω. Δεν ξέρω γιατί δεν μου αρέσει. Νιώθω σαν να μοιάζει το ίδιο, αλλά προφανώς με μισεί. 

Ας δούμε λοιπόν αν τον τρίτο γύρο πηγαίνει καλύτερα. Είμαστε έτοιμοι να δούμε. Δεν είμαι σίγουρος πως αυτό πρόκειται να πάει. Είναι σε όλους τουλάχιστον να πάρει το μειονεκτήματα, όπως ακριβώς το γενικό θέμα JavaScript, όμως; Ελπίζω ότι είναι τουλάχιστον χρήσιμο, περισσότερο από ό, τι δείχνει ότι είναι λίγο σχολαστικός. Αλλά σετ πρόβλημά σας θα είναι πολύ διασκεδαστικό. Είναι πρόκειται να είναι μεγάλη. Δεν θα είναι τόσο κουραστική όπως αυτό, δεν νομίζω. Μπορείτε πραγματικά θα πάρετε για να δείτε πραγματικά δροσερά πράγματα. 

Έτσι, τελευταίο αλλά όχι λιγότερο σημαντικό, Θα προσπαθήσουμε το Twitter ένα. Είμαι πραγματικά φοβισμένοι τώρα, παιδιά. Δεν ξέρω πώς αυτό πρόκειται να πάει. Αλλά ακριβώς για να σας δώσει μια μικρή περισσότερη γεύση, και αυτό είναι πραγματικά χειρισμό χορδές και εισόδους, τι θα πάμε να κάνουμε είναι, αν παρατηρήσετε εδώ με HTML-- αυτός έχει ένα μικρό κομμάτι more-- έχουμε κάποια περιοχή κειμένου, το οποίο αντιστοιχεί σε αυτήν την περιοχή κειμένου εδώ. Εντάξει; Και ότι έχει ένα αναγνωριστικό του κειμένου. Εμείς το αναμορφωμένο λίγο με κάποιο πλάτος και το ύψος ότι έχουμε προκαθορισμένη, και έχουμε Η1, είναι απλώς η κεφαλίδα από το δικό μας, ότι αντιπροσωπεύει χαρακτήρες αριστερά μας. Μας έδωσε κάποια ταυτότητα του χαρακτήρες που απομένουν, και στη συνέχεια να έχουμε κάποια σενάριο εδώ, το οποίο είμαι πραγματικά ελπίζοντας τρίτη φορά του η γοητεία εδώ, παιδιά. 

Έτσι, αυτό που θέλουμε να κάνουμε, στην ίδια γενική φλέβα ότι έχουμε κάνει με js ρολόι dot και το κόμμα τελεία JS όπως έχουμε παρατηρήσει, είναι ότι έχουμε ξεκινήσει με πραγματικά αρπάζοντας τα πράγματα που μας νοιάζει, έτσι δεν είναι; Έτσι, σε αυτή την περίπτωση, υπάρχουν δύο πράγματα που μας νοιάζει, εντάξει; Ένα πράγμα που στην πραγματικότητα είμαστε το είδος του εξετάζει και την κατάρτιση των δεδομένων από, και ένα πράγμα που είμαστε στην πραγματικότητα αλλάζει. Έτσι, δεν υπάρχει HTML μας. Αν αυτή είναι η ιστοσελίδα μας εδώ, τι είναι τα δεδομένα που ψάχνουμε σε; Είναι πρόκειται να είναι ό, τι το κείμενο σε κουτιά μας, σωστά; Έτσι, ό, τι έχω πληκτρολογήσετε εδώ. Αυτό είναι που θέλω να ξέρω, ή αυτό είναι που θέλω να δούμε. Και τι πρόκειται να είναι αλλαγή στην ιστοσελίδα μας; Οι χαρακτήρες που απομένουν. Έτσι, κατά τον ίδιο τρόπο, θέλουμε να ξεκινήστε με αρχικοποίηση μεταβλητών ότι στην πραγματικότητα να κρατήσουν αυτά τα στοιχεία. Εντάξει; Έτσι, αν έχουμε κάποια var ότι είναι περιοχή κειμένου μας, και έχουμε κάποια var που έχει απομείνει. Σωστά; Έτσι, αυτά πρόκειται να κρατήστε αυτά τα δύο πράγματα. Έτσι, το ίδιο είδος του πράγματος, έγγραφο dot-- Εντάξει, είμαι πρόκειται να βεβαιωθείτε ότι αυτό είναι πρόκειται να λειτουργήσει αυτή τη φορά. Είμαι πολύ ανένδοτος. Εντάξει, οπότε αν θέλουμε μας περιοχή κειμένου, σύμφωνα με σε HTML μας, τι είναι αναγνωριστικό μας; Τι μας ταυτότητα; Είναι ακριβώς πρόκειται να είναι το κείμενο, διότι Αυτό δημιουργεί περιοχή κειμένου μας, εντάξει, και Ιδ μας είναι το κείμενο, έτσι ώστε να είναι πώς μπορούμε να αρπάξει ό, τι είναι εκεί. Εντάξει, το ερωτηματικό. Πάω να είναι σούπερ ακριβείς σχετικά με αυτό, γιατί θέλω αυτό να λειτουργήσει αυτή τη φορά. Εντάξει, κάνουν το ίδιο πράγμα, να πάρει το στοιχείο από Id. Είμαι πραγματικά αναρωτιούνται τι έχει προκάλεσε τις άλλες δύο να χαλάσουν. ΟΚ, τότε σε αυτό το ένα, Τι θέλουμε να έχουν πρόσβαση; Τι Id μας εδώ; Έχουμε μια άλλη ταυτότητα σε HTML μας, τι είναι αυτό; ΚΟΙΝΟ: Χαρακτήρες που απομένουν. ALLISON BUCHHOLTZ-ΑΕ: Χαρακτήρες που απομένουν. 

ΟΚ. Cool. Έτσι, είμαι απλώς πρόκειται να γράφω αυτό πολύ γρήγορα. Είμαι ακριβώς πρόκειται να γράψω αυτό στη δεύτερη. Έτσι περιοχή κειμένου. Αυτό που είναι ενδιαφέρον είναι Β function-- εκεί είναι πολλά λειτουργίες που όχι μόνο αντιστοιχούν σε σας ποντίκι, αλλά το πληκτρολόγιο σας. Εντάξει; Έτσι, μπορείτε να πείτε όταν κάποιο πλήκτρο είναι πατημένο, μπορείτε να κάνετε τα πράγματα όπως αυτό. Έτσι, αυτό που χρησιμοποιούμε καλείται κλειδί επάνω, η οποία λέει, «αν έχετε πατηθεί οποιοδήποτε πλήκτρο πληκτρολόγιό σας, όταν έχει αρθεί ο χρήστης δάχτυλο τους από εκείνο το κουμπί, και το κλειδί έχει καταστεί μη πίεσης, τότε θα πάμε να κάνουμε κάτι. " Εντάξει; Έτσι, αυτό έχει νόημα, σωστά; Επειδή κάθε χαρακτήρα γράφουμε, θα πάμε να πρέπει να άρει τα δάχτυλά μας μακριά από αυτό, έτσι ώστε όταν το κλειδί ανεβαίνει, μπορούμε να γνωρίζουμε για να αφαιρέσετε χαρακτήρες που απομένουν μας. 

Έτσι έχουμε κάποια σχετικά με κλειδί επάνω, και κατά τον ίδιο τρόπο, θα πάμε να πούμε, "Εντάξει, όταν το κάνουμε αυτό, θα πρόκειται να δημιουργήσει κάποια λειτουργία που πρόκειται να λάβει e ", στην περίπτωση αυτή, και αυτό που θέλουμε να κάνουμε είναι να υπολογίζουν τον αριθμό που απομένει. ΟΚ, οπότε ας αρχίσουν με τη δημιουργία μιας μεταβλητής. Έτσι έχουμε κάποια μεταβλητή r, ότι πρόκειται να αντιπροσωπεύουν πόσους χαρακτήρες που μας έχουν απομείνει. Εντάξει; Γνωρίζουμε ότι έχουμε ξεκινήσει με 140, και αν θέλουμε να γνωρίζουμε, ας πούμε, το μήκος αυτό κορδόνι που είναι ήδη εισόδου, εσείς δεν έχετε καμία ιδέα πώς μπορούμε να το κάνουμε αυτό; Απλά βασίζεται στα ανοικτά του προφανούς πράγματα, όπως αν θέλαμε ώρες, χρησιμοποιήσαμε πάρει ώρες. Γνωρίζουμε ότι ο σκοπός μας είναι περιοχή κειμένου, αλλά θα μπορούσε να σας παιδιά σκεφτείτε τι μπορεί να έρθει μετά από αυτό; Οποιεσδήποτε ιδέες; 

Έτσι, το είδος αυτού του κάποιου λιγότερο διαισθητική, αλλά αυτό είναι το μήκος dot αξία. Έτσι, απλά δώστε μου κάποια Χαρακτηριστικό τιμή που είναι στην πραγματικότητα το μήκος αυτής της σειράς. Έτσι, πρόκειται να πει, "Εντάξει, ψάχνω σε όλο αυτό το κορδόνι στην περιοχή κειμένου, και Πάω να πω σας πόσο καιρό είναι. " Διότι αν θυμηθούμε χορδές είναι πραγματικά ακριβώς συστοιχίες, έτσι μπορούμε να πάρουμε μόνο το μήκος τους. Έτσι, έχουμε ότι. Cool. 

Στη συνέχεια, αυτό που θέλουμε να κάνουμε είναι να Ποτέ δεν θέλουν να επιτρέψουν στο χρήστη για να εισάγετε περισσότερα από ό, τι 140 χαρακτήρες, σωστά; Γιατί αν λέμε, όπως, «Ω, μόνο να έχουν αυτό το πολύ απομένει, " και στη συνέχεια να τους αφήσουμε να κάνουν ότι ούτως ή άλλως, έχουμε ψέματα. Και αυτό είναι ένα άλλο πράγμα που το JavaScript μπορεί να είναι πραγματικά καλό για, είναι η επικύρωση του χρήστη και να διασφαλίσουμε ότι σας χρήστης ταιριάζει μέσα οποιουσδήποτε κανόνες ότι έχετε τους παρέχονται. Έτσι, εάν θέλετε να κάνετε πράγματα όπως την παραγωγή βέβαιος εισόδου κάποιος τη διεύθυνση ηλεκτρονικού ταχυδρομείου τους, ή να διασφαλίσουμε ότι όταν εισάγετε δύο κωδικούς πρόσβασης, που ταιριάζουν. JavaScript μπορεί να το κάνει. Θα κάνουμε κάτι σαν, "όταν την υποβολή της φόρμας, "ή παρόμοια, "Όταν Υποβολή εντύπου κουμπί είναι κλικ, ελέγξτε όλα αυτά τα πράγματα. " Και μπορούμε να το κάνουμε αυτό JavaScript. Έτσι, αυτό είναι ακριβώς ό, τι θα πάμε να κάνουμε εδώ. 

Λοιπόν, τι θα μπορούσε να είναι ένας τρόπος για να ελέγξετε αν που έχουν περάσει πάνω από 140 χαρακτήρες; Τι πρόκειται να συμβεί σε αξία μας r αν προσπαθήσουν; Είναι πρόκειται να είναι αρνητικό, έτσι δεν είναι; Ή πρόκειται να είναι λιγότερο από ή ίση με το μηδέν. Έτσι, μπορούμε να χρησιμοποιήσουμε ένα, αν αυτό είναι ακριβώς όπως όλα τα άλλα. Εντάξει; Και έχουμε κάποια τελεία περιοχή κειμένου αξία, και αυτό που κάνουμε εδώ είναι ότι απλά cutting-- τι είναι αυτό; Λυπάμαι. Αυτό και μόνο, θέλουμε απλώς να επιστρέψει false. Πήρα σύγχυση. Όλα εξοντώσει από τα πράγματα που δεν εργάζονται. Εντάξει, απλά θέλουμε να return false, και στη συνέχεια θα θέλετε να εμφανίσετε το υπόλοιπους χαρακτήρες, σωστά; Έτσι, με το ρολόι, κάναμε κάτι με το εσωτερικό HTML, σωστά; Όταν θέσαμε αυτό ισούται με κάποια μεταβλητή, έτσι ώστε ό, τι θα μπορούσαμε να κάνουμε εδώ; Τι αλλάζει το εσωτερικό του HTML; 

ΚΟΙΝΟ: Παραμένοντας; 

ALLISON BUCHHOLTZ-ΑΕ: Αλλάζουμε απομένουν. Εντάξει, και τι κάνουμε εμείς θέλουν να το ρυθμίσετε ίση με; Είναι πρόκειται να είναι r, γιατί αυτό θα πρέπει να είναι χαρακτήρες μας απομένουν. Εντάξει; Έτσι, είμαι πολύ νευρικός για να δούμε αν Αυτό λειτουργεί τώρα, αλλά θα δούμε. Αφήστε αυτό. Αυτό είναι πραγματικά γρήγορα. [Δεν ακούγεται] OK. Και πάλι, είμαι απλώς πρόκειται να σας δείξω. Για οποιοδήποτε λόγο, ορυχείο αποφασίζει να μην λειτουργεί, αλλά αυτό που θα σας δείξω είναι ότι αυτό is-- ω Εγώ έπρεπε να θέσω σε. Εντάξει, παρατηρούμε το ίδιο είδος πράγμα εδώ, να πάρει την περιοχή κειμένου. 

Επίσης, αν παρατηρήσετε ο τύπος, αν υπάρχει ποτέ κάτι που θέλετε να κάνετε, και δεν ξέρετε πώς να το κάνουμε αυτό, απλά κάντε κλικ στο κουμπί Προβολή προέλευσης σελίδας, και πρόκειται να σας πω. Μερικές φορές αυτό θα είναι κρυπτογραφημένα. Για το chipset σας, έχουμε κρυπτογραφήσει τα πάντα, έτσι ώστε να μοιάζει με ασυναρτησίες. Αλλά αν υπάρχει ποτέ μια πραγματικά δροσερό ιστοσελίδα που σας αρέσει, αν απλά κάντε κλικ στο κουμπί Προβολή προέλευσης σελίδας, πρόκειται να σας πω πώς να το κάνουμε. Έτσι και πάλι, εργάζονται εξυπνότερα, όχι σκληρότερα. Και όπως βλέπετε εδώ, το σύνολο των αυτά τα πράγματα είναι η ίδια. αυτό εδώ παίρνει μόνο μερικά υποσυμβολοσειρά ότι, ξεχνώ τι ακριβώς κάνει αυτό. Αλλά χρειάζεται προφανώς κάποιο υποσυμβολοσειρά της αξίας από το μηδέν έως το δέκα, και επιστρέφει false τι θα πρέπει να σταματήσει ο χρήστης από την εισαγωγή πια, και, στη συνέχεια, προφανώς ενημερώνει η εσωτερική HTML εκεί. 

Cool. Έτσι, μεγάλο Λαμβάνουν aways από σήμερα, πείραμα, να δούμε τον πηγαίο κώδικα επειδή πρόκειται να σας βοηθήσει πολύ, και ο καθένας, μερικές φορές το JavaScript μπορεί να είναι δύσκολο να εργαστεί με και δεν λειτουργεί πάντα με τον τρόπο που έπρεπε, αλλά απλά συνεχίζουμε να προσπαθούμε γιατί σας υπόσχομαι ότι θα το κάνει. Υπόσχομαι όλα αυτά τα παραδείγματα εργάζονταν πριν το μάθημα. Δεν καταλαβαίνω τι συνέβη. Έχω κυριολεκτικά ό, τι η ίδια. 

Ένα ακόμα πράγμα που θέλω απλώς να σας δείξω παιδιά που μπορεί να είναι εξαιρετικά χρήσιμη είναι in-- τι λειτουργεί πριν; Πήραμε μέρος στην εργασία, δεν είμαστε; Νομίζω πως ναι. Ναι. Κάναμε. Awesome. Εντάξει, έτσι ώστε ένα πράγμα που εσείς πρέπει να γνωρίζετε είναι το ημερολόγιο κονσόλα για την οποία μίλησα. Έτσι παρηγορήσει καταγραφής κουκίδα γεια. Έτσι, αυτό είναι το είδος του JavaScript ισοδύναμο printf. Έτσι, εάν θέλετε πάντα να επιθεωρούν τις μεταβλητές σας ή να δείτε τι συμβαίνει εκεί, τι μπορείτε να κάνετε είναι, αν θέλουμε να επιθεωρήσει το στοιχείο, είναι αυτό που θέλετε να πάτε να, και να πάτε στην κονσόλα, θα δείτε ότι το τυπωμένο γειά σου. 

Έτσι, θα μπορούσαμε να έχουμε Εκτύπωση ό, τι θέλαμε. Αν θέλαμε να εκτυπώσετε φόντο dot στυλ φόντου τελεία, θα πρέπει να είμαστε σε θέση να δούμε το RGB τριπλή ότι έρχεται. Ή όχι. Ξεχάσω πώς ακριβώς εκτυπώσετε μια μεταβλητή όπως αυτό, αλλά θα πρέπει να είναι σε θέση να εκτυπώσετε τα πράγματα όπως αυτό. Αυτό θα είναι πολύ χρήσιμο για το chipset σας όταν είστε προσπαθούν να χειραγωγήσουν συντονίζει ή οτιδήποτε. Έτσι, επίσης, να αλλάξει αυτό το κομμάτι στην τάξη. Αυτό είναι διαφορετικό από τα τελευταία χρόνια, έτσι απλά είναι ωραίο να TFs σας, ή οι ΤΡ σε ώρες γραφείου μάλλον, γιατί είμαστε είδος της μάθησης μαζί με σας παιδιά. Αλλά το ημερολόγιο κονσόλα ήταν σούπερ, σούπερ χρήσιμο για JavaScript πέρυσι. Γι 'αυτό αγαπώ. Μάθετε πώς να το χρησιμοποιήσετε. Είναι πιο εύκολο στη χρήση από GDB, έτσι ώστε να θα πρέπει να είναι τουλάχιστον ένα θετικό σημείο. Αλλά σας ευχαριστώ παιδιά που φέρουν μαζί μου. Λυπάμαι που μου παραδείγματα για κάποιο λόγο απλά δεν θέλουν να συνεργάζονται μαζί μου, αλλά εγώ Ελπίζουμε ότι βοήθησε το είδος του να σας πάρει ένα λίγο περισσότερο στη ζώνη του JavaScript. Και να μου στείλει σε όλες τις ερωτήσεις σας για την επόμενη εβδομάδα ώστε να μπορώ να είναι σούπερ επισκευαστεί, και θα φέρω καραμέλα και ακόμη και επιπλέον καραμέλα, γιατί αυτό ήταν γελοίο. Αλλά εσείς είναι μεγάλες, και να έχουν μια τρομερή εβδομάδα.