JavaScript für Anfänger (einschließlich 6+ reale Projekte) | Kalob Taulien | Skillshare
Suchen

Playback-Geschwindigkeit


1.0x


  • 0.5x
  • 0.75x
  • 1x (normal)
  • 1.25x
  • 1.5x
  • 1.75x
  • 2x

JavaScript für Anfänger (einschließlich 6+ reale Projekte)

teacher avatar Kalob Taulien, Web Development Teacher

Schau dir diesen Kurs und Tausende anderer Kurse an

Erhalte unbegrenzten Zugang zu allen Kursen
Lerne von Branchenführern, Ikonen und erfahrenen Experten
Wähle aus einer Vielzahl von Themen, wie Illustration, Design, Fotografie, Animation und mehr

Schau dir diesen Kurs und Tausende anderer Kurse an

Erhalte unbegrenzten Zugang zu allen Kursen
Lerne von Branchenführern, Ikonen und erfahrenen Experten
Wähle aus einer Vielzahl von Themen, wie Illustration, Design, Fotografie, Animation und mehr

Einheiten dieses Kurses

    • 1.

      Willkommen zu JavaScript für Anfänger:innen

      1:14

    • 2.

      7 JavaScript

      7:07

    • 3.

      Dein erstes Drehbuch

      5:22

    • 4.

      Eine kurze Geschichte

      6:06

    • 5.

      Einführung in Variablen

      10:02

    • 6.

      Merging

      10:41

    • 7.

      Console

      5:50

    • 8.

      HTML-Elemente auswählen

      7:46

    • 9.

      Eine Möglichkeit zum Teilen von Code

      4:24

    • 10.

      JavaScript #1

      6:11

    • 11.

      String

      18:42

    • 12.

      Benutzereintrag

      8:57

    • 13.

      Einführung in Vergleichsoperationen

      9:39

    • 14.

      Gegengesetzte Operatoren umgehen

      5:01

    • 15.

      JavaScript #2

      9:30

    • 16.

      Sonderfälle umgehen

      6:42

    • 17.

      Code

      4:23

    • 18.

      Einführung in die Arithmetik

      6:04

    • 19.

      Boolean Logik

      8:23

    • 20.

      Listen mit Arrays erstellen

      9:22

    • 21.

      Variable Typen überprüfen

      7:30

    • 22.

      Variables Casting

      7:23

    • 23.

      Weitere Vergleichsoperationen

      12:15

    • 24.

      JavaScript #3

      6:07

    • 25.

      Funktionen

      9:57

    • 26.

      Übung

      14:53

    • 27.

      JavaScript

      7:01

    • 28.

      Query Selektoren

      13:13

    • 29.

      Einführung in Events

      9:51

    • 30.

      JavaScript Projekt

      14:59

    • 31.

      Anonyme Funktionen

      6:33

    • 32.

      IIFE

      4:29

    • 33.

      Das Keyword

      6:13

    • 34.

      Geltungsbereich

      6:52

    • 35.

      Hürden

      10:51

    • 36.

      Einführung in Event-Listener

      7:01

    • 37.

      In-Werte bekommen

      5:58

    • 38.

      CSS mit Event ändern

      10:35

    • 39.

      JavaScript #5

      8:21

    • 40.

      Objekte

      14:43

    • 41.

      für Schleifen

      11:20

    • 42.

      Laufen

      7:58

    • 43.

      für jede Schleife

      8:22

    • 44.

      Guessing

      7:54

    • 45.

      Lass und Konst.

      7:53

    • 46.

      Einführung in OOP

      10:44

    • 47.

      Erweiterte Kurse

      12:37

    • 48.

      Modelles Projekt

      16:20

    • 49.

      Home

      1:23

    • 50.

      Template

      3:13

    • 51.

      Object

      3:04

    • 52.

      Verkrustung von Arrays, Objekten und ganzen Rest

      13:02

    • 53.

      Zeitauslöser

      3:51

    • 54.

      Intervalle

      2:51

    • 55.

      APIs und Ajax mit Fetch

      11:58

    • 56.

      Arrow

      8:46

    • 57.

      CSS hinein/-e

      3:48

    • 58.

      Endziel

      14:55

    • 59.

      JavaScript

      3:05

  • --
  • Anfänger-Niveau
  • Fortgeschrittenes Niveau
  • Fortgeschrittenes Niveau
  • Jedes Niveau

Von der Community generiert

Das Niveau wird anhand der mehrheitlichen Meinung der Teilnehmer:innen bestimmt, die diesen Kurs bewertet haben. Bis das Feedback von mindestens 5 Teilnehmer:innen eingegangen ist, wird die Empfehlung der Kursleiter:innen angezeigt.

8.627

Teilnehmer:innen

113

Projekte

Über diesen Kurs

Hallo Mitläufer

Willkommen für Anfänger:innen Hier sind ein wenig Informationen über mich, was in diesem Kurs ist, und was du in diesem Kurs lernen wirst.

Ich lege seit 8 Jahren JavaScript und ich verwende seit den späten 90ern Java, seit dem späten 90er-Jahre. Ich habe über 45.000 Kursteilnehmer:innen der Welt geholfen, diese unterhaltsame und fantastische Programmiersprache zu lernen, JavaScript!

Bust auf einen gründlichen Kurs zum Lernen von JavaScript

Welp. Das ist dieser Kurs!

  • 8-Stunden-Video
  • Über 55 Lektionen
  • 5 Miniprojekte
  • 3 mittelständische Projekte
  • 1 endgültiges Projekt
  • Vollständiger Anfänger:innen!
  • Lust auf Quellcode

Ist dieser Kurs für dich?

  • Wenn du in JavaScript neu bist, ist das der perfekte Kurs für dich!

  • Wenn du bereits Erfahrung von JavaScript, der sich nicht in der Lage ist, wie stark es ist.

  • Außerdem sind die Projekte, die diesen Kurs haben, und helfen dir wirklich zu verwenden, was du gelernt hast.

Hier erlernen in diesem Kurs

In diesem Kurs für Anfänger:innen lernst du alles, was was du brauchst, um ein selbstbewusster for zu werden. Einige Kurse lernen dir nur die Programmierseite von JavaScript und andere Kurse zeigen dir nur die interaktive Seite von JavaScript. Aber die Wahrheit ist: JavaScript ist eine interaktive Programmiersprache und du musst beide Seiten von JavaScript kennen.

  1. JavaScript-Grundlagen - Du lernst, wie man JavaScript schreibt, wo es verwendet wird, und wie du es ausgeführt hast. Wir werden uns auf die - (die lustige curly Klammern). Wir werden uns auch Möglichkeiten ansehen, deinen JavaScript-Code leicht zu debug zu lassen, damit du nicht in der Zeit fehlst, in der du mit dem gebrochenen Code beginnst.

  2. Variablen – Eine Variable ist ein winzig Stück Speicher, die in deinem Computer zugewiesen wird. Es wird für die Speicherung eines winzigen Stücks, wie dein Name, eine Nummer oder mehrere Codezeilen von der sie führen sollte.

  3. Web - der Grund der Nummer 1 warum sich JavaScript sehr populär befindet, ist der Anfangs auf, um mit einer Webseite zu interagieren zu können. Du erfährst, wie du Benutzereingaben accept wie deine Seite aussieht, und wie du eine Aktion basierend auf der Benutzeraktion machst. Dies ist das Umwelten, das Websites wirklich interaktiv.

  4. Datentypen und Datenstrukturen - anders Du lernst Zahlen, Strängen und Float, Funktionen, Objekte, undefinierte, Null und mehr. und warum sie wichtig sind.

  5. Konditionen – dies sind die kleinen Checkpunkte in einem Programm, die ein Computer tatsächlich etwas machen kann. Wenn du 18/älter alt bist, kannst du eine Stimme machen Dies ist ein wahres Leben "conditional Es geht wie die: Wenn der Zeitalter > 18: Zeitung: etwas machen. Dies ist genau wie Computer wissen und du lernst, wie du diese zu schreiben.

  6. Funktionen - Wenn du einen Code schreiben musst, werden du am Ende den gleichen Code immer wieder kopieren und ein genaues Code immer wieder einfügen. Eine Funktion lässt dich ein Stück von Code einer, und es immer wieder verwenden. Du lernst reguläre Funktionen, sofort funktionierte Funktionieren, anonyme Funktionen und functions,

  7. Loops – Eines der stärksten Konzepte der Computerwissenschaft ist die Idee einer „Loop“. Grundlegend es uns ermöglicht, ein Handeln immer wieder zu machen, bis es aufhören soll. Du lernst für Schleife und für Lungen, für jede Schleife und während Schleifen

  8. quirks - JavaScript hat einige seltsame Funktionalität, die andere Programmiersprachen nicht haben. Wir werden in diesem Kurs einige „Quirks“ zusammen behandeln und Dinge wie "quirks" Verschlüsse und "quirks"

  9. Objekte, Kurse und OOP - in JavaScript gibt es einen speziellen Datentyp, der ein Objekt genannt wird. Es kann dir die benannten Datenpunkte für einfachen Zugang und Funktionen. In modernen JavaScript, die wir schreiben können, wie es andere Sprachen wie Python Kurse sind eine schönere Möglichkeit, JavaScript-Objekte zu schreiben. Du kannst sie über die write von ihnen erweitern und ganze pieces wiederverwenden – sie sind Funktionalitäten aber viel größer. Und du lernst alles über diesen!

  10. API's und Ajax Anfragen - API's sind in der Webentwicklung nicht zu vermeiden Es ist wichtig zu wissen wie sie theoretisch funktionieren und wie du mit ihnen arbeitest. Du erhältst Erfahrung mit einer echten life und einer Ajax Anforderung.

BIST du bereit, JavaScript schreiben?

Wenn nicht: Ich habe ein paar andere not.. mit über 45.000 Kursteilnehmer:innen und über 2.000 Bewertungen Hier sind ein paar echte Bewertungen von meinen anderen JavaScript

ich habe jetzt Javascript seit einigen Monaten lemen Dieser Kurs hilft alles, alles in Platz zu fallen.

ich bin wirklich gerne und zu schätzen diese Tutor für seine Erzählung. Fantastisch!

nicht den Kurs gerade noch fertigzustellen, aber aus den Kursen habe ich sich von Kalob's Erklärungen klar und glänzend gemacht. Er erklärt genaues, was er macht und warum. Das Tempo stand in und ich habe nie die Erklärungen von verbose. bekommen. Ich habe nie das Vertrauen mit Js hatte, also ich habe mich entschieden, diesen Kurs zu kaufen. Ich fühle die Kurseinheiten und ich wache langsam in Selbstvertrauen Großartig für Anfänger.

Es ist erstaunlich, die Erklärung ist so einfach, ich wünsche, ich hätte ich diesen Kurs früh durchgehen konnte.

Ja, bisher es sehr einfach ist und hat einen guten Anfang gemacht.

ES IST EIN GROSSER JS ANFANGSKURS

Ich habe seit mehreren Jahren Java-Kurs unterrichtet, die Tausenden Menschen lernen können, zu schreiben, zu schreiben und zu verstehen — und ich habe 3x mehr Aufwand zur Entwicklung dieses Kurs als meine vorherigen Java-Kurs. Ich verspreche, dass du es genießen kannst!

Wir inners!:)

Triff deine:n Kursleiter:in

Teacher Profile Image

Kalob Taulien

Web Development Teacher

Kursleiter:in

Hi everybody! I'm Kalob Taulien.

 

Here's the TL;DR (short) version about me:

I have been coding since 1999 and teaching people how to code since 2013 I have over 350,000 web development students world-wide I'm on the Wagtail CMS core development team (Wagtail is Python's #1 most popular website making system) I try my best to answer EVERY question my students have  I love teaching — it's definitely one of my natural talents  Also I love goats! (Great conversation starter with me if we ever get to meet in person)

Below you can find all my Skillshare courses. The categories go from easiest to hardest, except for the Misc. Coding Courses at the very end. 

If you're brand new to coding, start with BEGINNERS WEB DEV.&nb... Vollständiges Profil ansehen

Level: Beginner

Kursbewertung

Erwartungen erfüllt?
    Voll und ganz!
  • 0%
  • Ja
  • 0%
  • Teils teils
  • 0%
  • Eher nicht
  • 0%

Warum lohnt sich eine Mitgliedschaft bei Skillshare?

Nimm an prämierten Skillshare Original-Kursen teil

Jeder Kurs setzt sich aus kurzen Einheiten und praktischen Übungsprojekten zusammen

Mit deiner Mitgliedschaft unterstützt du die Kursleiter:innen auf Skillshare

Lerne von überall aus

Ob auf dem Weg zur Arbeit, zur Uni oder im Flieger - streame oder lade Kurse herunter mit der Skillshare-App und lerne, wo auch immer du möchtest.

Transkripte

1. Willkommen zu JavaScript für Anfänger:innen: JavaScript, die heißeste Programmiersprache heute, von ausgefüllten Websites über mobile APS bis hin zu Programmen wie Slack und Spotify, JavaScript ist überall. Es ist die moderne Programmiersprache, die jeder Entwickler kennen muss. Wenn Sie Ihre brandneue Web-Entwicklung und nicht wissen, wo Sie beginnen sollen, Suchen Sie nicht weiter. Dieser Kurs ist absolut für Sie. In diesem Kurs lernen Sie alles, was Sie wissen müssen, um ein fundiertes Verständnis der Grundlagen von JavaScript zu erhalten . Es spielt keine Rolle, ob Sie bereits super qualifiziert in der Webentwicklung oder Ihrer brandneuen Dekodierung sind. Dieser Kurs wurde für Sie konzipiert. JavaScript ist eine der beliebtesten Codierungssprachen der Welt, und es ist Superfund-Alarm. In diesem Kurs lernen Sie die Grundlagen von JavaScript, Variablen, Webseite, Interaktivität, Interaktivität, Datentypen und Datenstrukturen, bedingte Anweisungen, Funktionen, JavaScript, Macken, die es von allen anderen Sprachen, Objekten, Klassen und objektorientierte Programmierung unterscheiden Objekten, . AP Eyes und Ajax Anfragen und alles dazwischen. Es gibt auch fünf Mini-Projekte für die sofortige Praxis und ein abschließendes Projekt, um Ihr gesamtes Wissen zu testen. Werden Sie noch heute ein JavaScript-Entwickler 2. 7 JavaScript: Hallo, Ende. Willkommen bei Javascript für Anfänger. In Ordnung, ich denke, wir sollten eigentlich damit beginnen, zu sagen, was JavaScript ist, wo es verfügbar ist und darüber hinaus, was es nicht ist. Also fangen wir einfach mit Nummer eins an. Was ist Javascript? Nicht JavaScript ist nicht Java. Es gibt einen großen Unterschied zwischen Java und JavaScript. Java gibt es länger als JavaScript. JavaScript wurde nur JavaScript genannt, so dass es einige der Popularität hinter Jave a zurück im Jahr 1995 nutzen konnte . Und sie sind eigentlich gar nicht verwandt. In der Tat ist Jaffa streng eine serverseitige Sprache, und JavaScript ist fast streng eine Front auf Sprache, obwohl es jetzt als serverseitige Sprache verwendet werden kann, weil es angepasst wurde, um so zu funktionieren . Der Schlüssel zum Mitnehmen hier ist Java nicht Java-Skript. Wenn Sie also über JavaScript sprechen, rufen Sie bitte nicht einfach Java an, denn das wird andere Entwickler verwirren. Nummer zwei. Jeder Webbrowser verwendet es. 100% aller Webbrowser verwenden JavaScript. Jetzt sind Sie als Benutzer auf sagen wir, Chrome oder Firefox. Sie können sich entscheiden, Javascript zu deaktivieren, wenn Sie möchten, aber Ihr Browser kommt mit ihm so, wenn Sie einen Browser herunterladen. Firefox Chrome Safari Edge. Sogar Internet Explorer kommt mit JavaScript-Unterstützung. Tatsächlich ist JavaScript die einzige Sprache, die Sie am Frontend verwenden können. Lassen Sie uns also sagen, dass JavaScript die Onley-Codierungssprache ist, die Sie am Frontend verwenden können . Es ist der Einzige. Es gibt HTML, CSS und JavaScript, und das macht die gesamte Front und Stack jeder Website. HTML und CSS sind keine Sprachen. JavaScript ist eine Programmiersprache, und es ist die einzige da draußen, und das trägt tatsächlich zu seinem massiven Wachstum und Popularität bei. Weil es keine anderen Entscheidungen gibt. Sie müssen JavaScript kennen, um ein Front- und Webentwickler zu sein. Okay, Nummer vier. Als Entwickler werden Sie viele Worte hören. Sie werden Dinge wie Jake Weary React-Ansicht, eckige Bibliotheken und Frameworks hören . Es gibt einen Unterschied zwischen all diesen, und wir werden mehr darauf eingehen, wenn der Kurs weitergeht. Aber hinter den Kulissen hinter Jake Weary React View und eckig, es ist nur Vanille-Javascript. Es ist alles in schlicht langweilig JavaScript geschrieben. Eine Bibliothek ist eine JavaScript-Datei oder eine Reihe von Funktionen, mit denen Sie Verknüpfungen erstellen können. Also ich, zum Beispiel, J Query ist eine Bibliothek, und das liegt daran, dass es nicht wirklich mit all den zusätzlichen Dingen kommt, die ah volles Framework tut. Und ein Framework ist wie reaktive Sie oder eckig, wo es mit mehr als nur Bindung von Ereignis-Listener kommt. Das kommt mit einer bestimmten Art, Dinge zu schreiben, die mit einem bestimmten Stil, ah, Codierungsstil kommt ah, . Das ist darauf, wie Sie tatsächlich Ihren Code schreiben, und es macht fast alles, was Sie brauchen. Das ist also der Unterschied zwischen einer Bibliothek und einem Framework. Aber wir werden in Zukunft mehr darüber reden. Nummer fünf. Können Sie JavaScript online oder offline verwenden? Ja, die Antwort ist ja. Sie können Js offline verwenden. Warum sage ich das? Oder wie sage ich, dass eher JavaScript ist, wenn Sie eine Website aufrufen, wann immer Sie eine Website haben, Ihr Browser lädt eine Reihe von HTML CSS und JavaScript zusammen mit Bildern und vielleicht ein paar andere Dateien herunter, und Ihre Browser versucht, diese einzuzahlen, so dass er es nicht immer und immer wieder neu laden muss. Sobald Sie eine Javascript-Datei haben, können Sie diese Datei in Ihrem Browser ausführen, auch wenn Sie kein Internet haben. Selbst wenn Sie während des gesamten Kurses kein Internet haben, raten Sie mal? Sie können einfach Ihren Browser öffnen und Sie können Code direkt hier eingeben, was ich Ihnen nur ein wenig zeigen werde. Und es wird nur Hi Welt sagen und das ist JavaScript. Sie brauchen also kein Internet dafür. Mit dem sagte, viele Websites haben immer noch eine Art p ich da draußen und Sie werden immer noch Internet brauchen , um tatsächlich die volle Nutzung von JavaScript zu nutzen. jedoch Sie brauchen esjedochnicht unbedingt die ganze Zeit. JavaScript-Dateien JavaScript-Dateien und in Punkt Js So wie ein HTML, wenn Sie HTML lernten , war es dot html oder CSS war dot CSS oder dot python und lehrte pie, richtig? Also ist es das Gleiche, also Dot Js und du wirst das auch überall sehen. Alle JavaScript-Dateien enden also in dot Js und last but not least können Sie heutzutage ganze Programme mit JavaScript erstellen, so dass es begonnen hat. war einmal, Sie konnten nur Programme in bestimmten Sprachen wie C oder C plus erstellen. Und dann bewegte es sich irgendwie zu Dingen wie Python-Aufklärung. Machen Sie ganze Python-Python-Programme für ein Betriebssystem, und jetzt können Sie das Gleiche mit JavaScript machen. Und das Schöne daran ist, dass es eine Sprache ist, sie alle zu beherrschen. Was Sie tun können, ist, dass Sie ein ganzes Programm erstellen können, und es kann auf mehreren Betriebssystemen sein. Es kann funktionieren. Ihr mobiles Gerät spielt keine Rolle von IOS oder Android oder Windows oder Mac oder Lennox oder irgendetwas anderes. Es ist ein System, um sie alle zu beherrschen. Und ein gutes Beispiel dafür sind Spotify, Spotify und slack. Diese Luft zwei große Anwendungen, die für eine sehr lange Zeit mit etwas namens Electron. Und was das tut, ist es im Grunde kompiliert all Ihr JavaScript in ein aktuelles Programm, und dann können Sie gehen und senden Sie es an Leute zum Download auf Windows, Linux, Mac OS, Android, iPhone, Du nennst es. Es hat Unterstützung dafür. Und so jetzt JavaScript, das ist tatsächlich schreiben diese Notiz. JavaScript wird verwendet, um ganze Programme zu erstellen, so dass ist eine Art von sieben lustigen Fakten über zwei JavaScript. Wir werden in eine Menge mehr von dem Zeug bekommen, wie die Zeit weiter geht, um dieses Video auf der linken Seite zu beenden . Sehen Sie, mein Editor, den ich benutze ves codiert wird von Microsoft gemacht ist völlig kostenlos. Und Sie können es bekommen, indem Sie es einfach herunterladen. Sie werden einen Texteditor wie diesen brauchen. Also, wenn Sie nicht bereits einen haben, würde ich V s Code auf der rechten Seite vorschlagen. Ich habe Google Chrome einfach geöffnet. Es ist ein Browser. Und in der Tat, alles, was ich hier getan habe, war, dass ich zu einem Boot gefahren bin. So brandneue Seite, klicken Sie mit der rechten Maustaste inspizieren. Und wenn du hier oben in deine Konsole gehst und das größer machen willst, wirst du auch hier Javascript schreiben. Hallo. Hallo. Ich mag das einfach und wir haben Javascript. Sie werden also sehen, dass mein Bildschirm in zwei geteilt ist. Also habe ich meinen Redakteur auf der linken Seite, und dann habe ich gerade einen Browser auf der rechten Seite. So etwas wie das. Wenn Sie zwei Monitore, die Sie verwenden können, um Monitore, Sie können einfach zwischen Vollbild auf V s Code oder Ihrem Texteditor und Chrome oder was auch immer Browser Sie verwenden möchten. Es muss nicht Crumb sein. Aber so habe ich es im Video so eingerichtet, dass Sie alles sehen können, nur vor Ihnen angelegt . Wo das heißt, lassen Sie uns zu unserer nächsten Lektion springen, wo wir unser erstes JavaScript-Skript erstellen werden. 3. Dein erstes Drehbuch: Alles klar, lassen Sie uns direkt in JavaScript springen. Zu diesem Zeitpunkt sollten Sie einen Texteditor wie V s Code haben. Adam Erhabene. So etwas wie das. Und alles, was wir tun werden, ist eine neue Datei zu erstellen. Und ich werde das nur als Punkt-HTML-Datei sagen und ich werde dies Ihr erstes Skript dot html nennen . Zuerst sieht es so aus, als würden wir eine HTML-Datei erstellen, und in der Tat sind wir es. Also werde ich schaffen wird, dass kleiner zu machen. Ich möchte hier kein schnelles kleines HTML Fünf-Layout erstellen, und das erste, was ich tun möchte, ist, dass ich ein Java entfernt und so innerhalb meines HTML erstellen möchte, normalerweise am unteren Rand Ihrer Seite kurz vor dem Body-Tag. Du bist das letzte Körper-Tag. Wir setzen ein Tag namens Script in Here Skript und Schrägstrich Skript, und so machen wir so ziemlich alles mit Javascript innerhalb der Seite. Nun, wenn Sie mit diesem Kurs folgen, wirklich, brauchen Sie dieses Zeug nicht wirklich. Sie brauchen nur doc-Typ html Kopf Körper und dann Skript in Ihren Körper setzen. Ich werde das einfach da drin lassen, nur aus Gründen, weil schwere Eskorte es automatisch für mich reinbringt, also werde ich es einfach da drin behalten. Nennen wir das dein erstes Drehbuch. Und wo wir unser Skript hier drin haben, alles, was ich tun werde, ist Alert, Klammer Zitat. Markieren. Hi. Mein Name ist Caleb. Und dann setze ich ein Ende in Anführungszeichen und unendliche Klammer oder Klammern, und dann einen Semikolon. Und wenn ich diese Datei speichere und ich in Chrome gehe und ich einfach commando oder control Oh klicke, kannst du auch in Datei öffnen gehen. Und wenn ich diese Datei einfach öffne, wird mein JavaScript automatisch für mich ausgeführt. Und so gibt es hier eine Warnung. Diese kleine lästige Box, die auftaucht, sagt Hi, mein Name ist Caleb. Und jedes Mal, wenn ich die Seite aktualisiere, heißt es „Hallo“. Mein Name ist Caleb. Hi. Mein Name ist Caleb. Lass es uns nochmal machen. Hi. Mein Name ist Caleb. Was passiert, wenn ich noch einmal darauf klicke? Es wird hallo sagen. Mein Name ist Caleb. Und das liegt daran, dass alles zwischen diesem Tag hier dieses öffnende Skript-Tag in diesem schließenden Skript-Tag. All dieses Javascript wird laufen. Nun, an diesem Punkt, wissen wir nichts über Dinge wie Syntax, die wie die Struktur der Sprache ist. Warum haben wir ein Semikolon? Warum haben wir eine Klammer? Warum haben wir Anführungszeichen? Was ist ein Alarm? Das wissen wir noch nicht, und das ist in Ordnung. Aber für jetzt, was ich möchte, dass Sie dio nur ein kleines Skript wie dieses erstellen. Also, wenn Sie brauchen, um freie Einzahlung Video fühlen und einfach ein Skript zu erstellen sagt hallo, mein Name ist, was auch immer Ihr Name ist, und stellen Sie sicher, es ist eine Warnung. Stellen Sie sicher, dass es hier sehr ähnlich wie mein Code aussieht. Der wichtige Teil ist das Lügen. 15 Abschlepplinie 17 hier. Du musst dir um das Zeug keine Sorgen machen. Wir schauen nicht darauf, eine responsive Website zu erstellen, was im Grunde das ist, was das tut. Wir möchten nur, dass Javascript läuft und es dann in Ihrem Browser öffnet. Es gibt eine Alternative dazu, wenn Sie möchten. Sie müssen das nicht in der Akte tun. Sie können dies auch direkt in Ihrem Browser tun. Wenn Sie also eine Seite öffnen, klicken Sie mit der rechten Maustaste auf Inspector, und Sie werden auf die Tablets als Konsul klicken möchten. Und hier, Dies ist nur Ihre JavaScript-Konsole. Sie können jedes Javascript schreiben, das Sie wollen. So zum Beispiel sagen, könnte ich zum Beispiel sagen,dass JavaScript für Anfänger alarmiert wird, wenn ich es richtig buchstabieren könnte. Und da gehen wir. Es sagt Javascript für Anfänger, und Sie bemerken, dass es genau so aussieht wie der gleiche Code wie das, was ich hier geschrieben habe. Der Text ist in ihm anders. Darüber reden wir später. Ah, aber im Grunde sieht es genauso aus. Also könntest du es so machen. Oder wenn du es wolltest. Sie könnten Code Pen dot io verwenden, das ein Werkzeug für das Sandboxen von HTML CSS und JavaScript ist. Und ich zeige dir das in ein paar Videos von jetzt an. Aber das sind die beiden wichtigsten Möglichkeiten, wie wir JavaScript ausführen. Im Grunde gehen Ihre großen Skripte hier rein. Und wenn Sie jemals etwas testen müssen hey, öffnen Sie einfach Ihren Browser. Richtig. Klicken Sie auf, überprüfen Sie. Gehen Sie in Ihre Konsole und Sie können jedes Javascript schreiben, das Sie wollen. Das nächste, was Sie beachten müssen, ist, wie verknüpfen wir mit JavaScript-Dateien? Nun, wenn Sie mit HTML und CSS in CSS vertraut sind, ist es ein Link. Elemente in JavaScript. Wir machen Skript SRC anstelle eines Entwurfs. SRC ist gleich Let's go-Skripten und Ihr erster Skript-Punkt Js, den wir tun könnten, ist gleich Typ, den wir wollen. Und im Grunde haben wir das Drehbuch geschlossen. Und was das tun wird, ist zu versuchen, aus dem Skript-Ordner zu laden und wird nach Ihrem ersten Script Jazz suchen . Jetzt gibt es das nicht, also wird das nicht funktionieren. Aber so würden Sie eine externe Datei verwenden. Wenn Sie also mehrere HTML-Dateien haben, auf denen JavaScript ausgeführt werden soll, müssen Sie es nicht kopieren und einfügen. Sie können einfach eine externe Datei verwenden, und das sollten Sie auch in CSS und HTML gelernt haben. Ihre Aufgabe für dieses Video besteht also darin, im Grunde nur ein Skript in einem offenen Skript-Tag zu erstellen, einem schließenden gestrippten Tag. Stellen Sie sicher, dass es direkt über Ihrem Körper liegt. Ich will es nicht in den Kopf, wie ich es oben geschrieben habe. Lassen Sie uns das loswerden. Sie möchten direkt über Ihrem Schrägstrich body-Tag und wissen Sie, Sie haben all Ihren HTML hier und dann nur Warnungen an die Welt. Hallo. Mein Name ist. Und dann, wie auch immer Sie heißen, wenn Sie das getan haben, gehen wir zur nächsten Lektion. 4. Eine kurze Geschichte: In Ordnung, lassen Sie uns über eine kurze Geschichte von JavaScript sprechen. Ich weiß, dass das nicht das Wichtigste auf der Welt ist. Ich weiß auch, dass dies nicht das Interessanteste auf der Welt ist. Aber es ist meines Erachtens eine Grundvoraussetzung für das Erlernen einer Sprache. Sie wollen irgendwie verstehen, woher es kam, um zu projizieren, wohin es geht. Und JavaScript, für mich hat eine ziemlich interessante Geschichte. Also erste Dinge zuerst JavaScript war oder ist. Eigentlich ist Jeff Script eine relativ neue Programmiersprache. In der Tat heißt es „You Have a Script“, weil es eine Skriptsprache war. Es war nicht wirklich eine vollständige Programmiersprache bis vor kurzem. Es wurde im Jahr 1995 entwickelt und es wurde vollständig in 10 Tagen hergestellt. Jetzt ist das JavaScript, dass wir schreiben heute deutlich komplexer und hat viel mehr als 10 Tage genommen zu erstellen. Aber der ursprüngliche JavaScript-Prototyp dauerte in den späten neunziger Jahren nur etwa 10 Tage . In die frühen zweitausend, dachten viele Leute tatsächlich JavaScript wäre eine Modeerscheinung, weil Sie eine Programmiersprache schreiben mussten , um eine Website funktionieren zu lassen, und Sie mussten tatsächlich eine Programmiersprache auf dem Backend schreiben, so dass Sie Dinge wie Zahlungen akzeptieren könnten und Sie eine Programmiersprache am Frontend schreiben mussten, damit Sie kleine kleine kleine Interaktionen haben konnten und es damals nicht sehr viel tun konnte. Es ist also verständlich zu überlegen, warum es ein Fett gewesen wäre. Aber dann, da mehr Leute online kamen und mehr Leute Interaktionen wollten, JavaScript tatsächlich nicht wirklich abgenommen. Jedenfalls nicht super gut. Flash wurde jetzt zur Standard-Animationssprache, wie die meisten von uns wissen, blinkt nicht mehr wirklich herum. Und es ist im Grunde alles JavaScript. Und das ist, weil Flash hatte zu viele Sicherheitsprobleme und JavaScript gut, da es langsam im Hintergrund reifte, es war in der Lage, mehr und mehr Dinge zu tun, die Flash war in der Lage, dio-und schließlich nur vollständig ersetzt. Als eines Tages Google und ein paar andere Leute sagten, kein Blitz mehr. Dies ist ein großes Sicherheitsproblem, und Flash wurde im Grunde eine Zeitleiste gegeben, die wie: Hey, Sie haben ein paar Jahre zu leben, und dann schneiden wir Ihre Unterstützung. Wir schneiden Ihre Lebenserhaltung ab, und wir gehen mit JavaScript, damit jeder darauf vorbereitet sein kann. Und das ist es, was am Ende passiert ist. Und so Kehle in dieser Zeit. Während Flash irgendwie auf den letzten Beinen war, nahm JavaScript wirklich Halt. Die Leute begannen wirklich, es zu übernehmen und es besser zu machen und alle Arten von Bibliotheken und Frameworks zu machen, die wir heute verwenden. Ich hatte vor ein paar Videos erwähnt, dass JavaScript die Onley-Front und Programmiersprache ist , und das war an einem Punkt wahr. Es ist nicht ganz wahr. Es gibt andere Programmiersprachen, die Sie am Frontend verwenden können, aber es sind nicht wirklich vier Websites mehr als daher Programmiersprachen. Und die größten Bedrohungen für JavaScript-Erfolge ist eine Web-Assembly genannt, oder kurz Blüte. Es hat tatsächlich nicht einmal die richtige Browserunterstützung bis Ende 2017 Anfang 2018 bekommen. Nun ist die Webassembly im Grunde eine tatsächliche Programmiersprache. Eine riel Programmiersprache, die sehr, sehr, sehr schnell läuft sehr, , ist viel effizienter als JavaScript für Ihren Browser. Allerdings hat es nicht wirklich abgenommen, und ich denke, es hat sich nicht entfernt, weil JavaScript durch nur ein paar Jahre so schnell gewachsen , wirklich, wirklich, etwa ein Jahrzehnt und die Web-Assembly war spät. Abschleppabzug starten. Sie sollten weit vor 2017 starten. Ursprünglich wuchs JavaScript einfach zu schnell für die Web-Assembly, um aufzuholen. Das heißt, wenn Webb Assembly ein Standard geworden wäre, wäre das ein großer Sprung nach vorne für grundsätzlich jede Website oder jedes Programm, das über einen Browser läuft. Aber ich glaube nicht, dass das bald passieren wird. Aber, hey, das ist weder hier noch da, weil wir lernen. JavaScript und JavaScript hat heute enorme Nachfrage, Aber es ist einfach gut zu wissen, dass, wenn eines Tages JavaScript für Front- und Web-Entwicklung ersetzt werden sollte, es wahrscheinlich durch Web-Assembly und so schnelle Weiterleitung ein paar Jahre sein würde. Wir haben jetzt ein serverseitiges JavaScript, genannt Node dot Js, und ist massiv beliebte Frameworks wie React, erstellt von Facebook und View dot Js. Es gab einen anderen namens eckig, erstellt von Google und im Grunde sehen Punkt Js acht oben die gesamte eckige Gemeinschaft. Ah, und React ist König von JavaScript-Frameworks. Aber ich gehe zurück, um diese node.js zu berühren. Grundsätzlich gibt es eine Engine, die Ihr Javascript lesen und es in sehr Leistungscode aufteilen kann , und so können Sie Javascript und Ihren Computer schreiben. Grundsätzlich können Sie es als einen Weg vorstellen, wie es Ihr JavaScript in C kompiliert und dann, wenn es Ihren C-Code ausführt, mache ich hier Luftanführungszeichen, aber Ihren C-Code. Es ist tatsächlich viel schneller. Und so ist dies serverseitiges JavaScript, was bedeutet, dass Sie tatsächlich JavaScript auf einem Linux-Rechner schreiben können und es tatsächlich einer Datenbank verbinden und all den Dingen, die ziemlich neu sind. Es ist in diesen Tagen ziemlich beliebt, und das Schöne daran ist, dass Sie eine Programmiersprache am Frontend schreiben können, eine Programmiersprache auf dem Backend, und Sie können im Grunde jedes Programm schreiben, das Sie jemals brauchen muss mit dem Internet verbunden sein. Du hast Javascript down pat, und du könntest so viele Dinge damit machen. Das heißt, wenn es um serverseitige Sprachen geht, ist es immer noch nicht so mächtig, wie Sprachen wie Python Python deutlich mehr tun können. Zum Beispiel ist eine Menge künstlicher Intelligenz von KI und ML Machine Learning in Python geschrieben. Es ist nicht in JavaScript geschrieben, also ist das eine kurze Geschichte auf JavaScript. Wohin geht es? Niemand weiß es wirklich. Ich vermute, dass JavaScript immer wieder abhebt. Es ist die einzige Front- und Programmiersprache da draußen für eine Website. Und so, wenn immer mehr Leute online kommen, wird es immer beliebter. Es gibt keine Wahl. Es muss wachsen, und man kann es so denken. JavaScript ist das einzige Kind in einer Familie, und so bekommt es die ganze Aufmerksamkeit. Während, wenn Sie über andere Programmiersprachen wie C oder Cortland oder Java oder Python oder eine andere Programmiersprache sprechen, können Sie die meisten davon im Grunde Hot-Swap. In gewissem Sinne können Sie ein ganzes Programm in C schreiben. Sie könnten auch das gesamte Programm in Python schreiben. Wo ist, haben Sie nicht wirklich diese Wahl, wenn es um Front-End-Web-Entwicklung geht. Und so verwenden wir immer JavaScript. Und ich denke, weil JavaScript wirklich abheben wird ah, viel mehr als es bereits in den kommenden Jahren. 5. Einführung in Variablen: Hallo und willkommen zurück in diesem Video, wir werden über Variablen sprechen. Wenn du nicht sehr an Mathematik interessiert bist, wenn du Mathematiknicht magst,bist du vielleicht nicht gut in Mathematik und du hörst das Wort Variablen und du flippst ein bisschen aus. Wenn du nicht sehr an Mathematik interessiert bist, wenn du Mathematik nicht magst, bist du vielleicht nicht gut in Mathematik und du hörst das Wort Variablen und du flippst ein bisschen aus Mach dir keine Sorgen. Es ist eigentlich nicht so komplex, wie es scheint. Viele Leute denken an Variablen als, Hey, wir werden direkt in der Kalkül sein. Und um ehrlich zu sein, ich sitze wie meine Person. Ich kenne keine Kalkül und arbeite jeden Tag mit Variablen. Hunderte, vielleicht sogar Tausende von ihnen. Variablen sind im Grunde nur eine Möglichkeit, kleine Datenstücke auf Ihrem Computer zu speichern und sie später zu verwenden. Sie können sie manipulieren, Sie können sie überprüfen. Sie können Ihrem Computer anweisen, einen bestimmten Befehl basierend auf einem bestimmten Variablentyp und dem Wert, den diese Variable enthält, auszuführen . Werfen wir einen Blick darauf, wie eine Variable aussieht. Und so werde ich hier einfach eine HTML-Fünf-Website erstellen, und weißt du was? Ich brauche nicht all das Zeug, das uns sehr Bulls-Variablen nennt, und weil wir hier keine HD-Melone haben werden. Ich meine, wir würden es generell hier reinlegen, aber das werden wir nicht. Wir werden nur einige grundlegende JavaScript für jetzt schreiben. Also werden wir bei einem Skript-Tag bleiben und hier unten werden wir ein weiteres Skript-Tag setzen. Und wenn wir anfangen, über Variablen zu sprechen , meinen wir wirklich nur ein Stück Daten, die wir ein- und austauschen können. Und das machen wir mit var. Und das ist sehr interessant, dass es Django-Vorlage sagt. Also lassen Sie mich schnell ändern. Das ist zu normalem HTML. Da gehen wir. Und so haben wir eine VAR-Deklaration. Dies steht für Variable und Vier sagt grundsätzlich, dass sie JavaScript. Nur damit Sie es wissen, wir sind dabei, Variable zu deklarieren und dann geben Sie ihr einen Namen, also was immer Sie wollen, dass dieser Name gleich ist und dann gibt es verschiedene Möglichkeiten, verschiedene Arten von Variablen zu deklarieren und wir werden in diese Überstunden kommen. Also werden wir es vorerst einfach halten. Also werde ich nur sagen, mein Name ist Caleb und lass uns das hier etwas größer machen. Also habe ich eine Variable. Es heißt Name und der Wert ist Caleb. Und so wissen wir von dieser Alert-Funktion bereits. Wir werden viel mehr darüber reden. Wenn ich einfach nur sagte Warnungsname und ich öffne diese Seite in Google Chrome, Sie können tatsächlich sehen, dass. Da steht nur Caleb. Das ist alles, was es tut. Wenn ich das jederzeit austauschen wollte, bekomme ich, sagen wir, Caleb, Darlene, Darlene, außer ich werde hier rüber gehen und Refresh sagt Caleb sagen, du könntest sogar mehr als das tun. Lassen Sie uns also eine andere Variable erstellen. Nennen wir es Kurs. Welchen Kurs nehmen wir derzeit? Im Moment nehmen wir JavaScript für Anfänger, und Sie können sehen, dass es in eine neue Zeile eingewickelt. Das ist eigentlich in Ordnung. Es ist nur, weil mein Handy hier etwas zu groß ist. Dann unten könnte man Alert-Kurs sagen und lass uns voran gehen, unsere Seite aktualisieren und das ist Javascript für Anfänger. Und so ist das wirklich alles von Variable ist jetzt können Sie eine sehr Rechnung jederzeit neu zuweisen, so dass wir keinen Namen mehr verwenden. Ich habe vorhin erwähnt. Semidarm sind Ding. Im Allgemeinen sagt dies einem Computer, dass hey, das ist das Ende der Zeile und was auch immer danach kommt, ist eine neue Aussage, also als Beispiel, würden wir nicht wollen, diese beide auf die gleiche Zeile wie diese setzen, denn wenn wir das taten und auf Refresh drücken, werden wir nichts sehen. In der Tat können Sie tatsächlich mit der rechten Maustaste klicken, inspizieren und Sie können sehen, dass wir einen Fehler in hier haben und lassen Sie uns unseren Konsul öffnen und Sie können sehen, dass wir einen Fehler haben in hier sagt etwas, das zu schwer zu lesen ist. Da gehen wir. Uncaught, Syntax, Fehler, unerwartete Token var Und es sagt uns genau, wo es ist. Also, wenn ich darauf klicke und sagt Zeile 11 und zeigt mir hier so das ist ziemlich cool. Das ist also ein kleiner Pro-Tipp für dich. Und so auch meine Redakteure sagen: Hey, Hey, etwas stimmt hier nicht. Und was wir tun wollen, ist normalerweise, dass wir das einfach auf eine neue Zeile setzen und am Ende einen Semikolon setzen. Dies ist der einfachste Weg, uns zu pflegen, und wenn wir klicken, erneut aktualisieren, alarmiert es uns wie erwartet, und es gibt keinen Fehler in unserem Rat. Und übrigens, jedes Mal, wenn Sie auf ein JavaScript laufen, sind sie immer auf Ihrer Konsole geöffnet. Werfen Sie einen Blick darauf, was dieser Bereich ist, weil es Ihnen als Javascript-Entwickler sagen kann. Was das Problem, eigentlich, wie vielleicht ist es etwas, das der Benutzer getan hat. Vielleicht ist es etwas, was der Entwickler getan hat. Am Ende dieses Kurses werden Sie in der Lage sein, genau zu wissen, wessen Fehler etwas ist. Normalerweise sind die Entwickler. Sie haben etwas nicht richtig umgesetzt. Okay, also haben wir Variablennamen und Kurs, und wir alarmieren das nur. Lassen Sie uns voran gehen und unsere Variable überschreiben. Jetzt könnten wir es einfach haben. Unser Kurs ist gleich Python für Anfänger. Und wie ich das sage und gehe, um diese Seite zu aktualisieren, wird es jetzt Python für Anfänger sagen. Und so funktioniert das. Also haben wir im Grunde eine Variable erstellt. Wir haben es überhaupt nicht benutzt. Und dann überschrieben wir die ganze Sache mit einem neuen Wert hier jetzt, weil diese Variable bereits deklariert wurde, da dies dazu kommt, eine Sache zu heben über die wir später auf der Straße sprechen werden. Wir müssen die Bar nicht wieder deklarieren. Es ist bereits da, also müssen wir var nur einmal für eine bestimmte Variable deklarieren. Und danach müssen wir das nicht mehr tun. Also lassen Sie uns voran und speichern Sie dies und drücken Sie Aktualisierungsfinanzen. Python für Beginners Rat hat sich nicht beschwert. Dinge sahen gut aus. In Ordnung. Eine weitere Sache, die wir übergehen sollten, ist, was damit ist. Siehst du diese Anführungszeichen dort? Es gibt zwei andere Möglichkeiten, dies zu tun. So könnten wirzum Beispiel zum Beispiel unseres Alters tun. Wie alt bin ich? Nun, ich bin 30. Wir könnten das tun. Und wenn ich das Alter alarmiere und diese Seite aktualisiere, heißt es 30. Und wenn ich hier reingehe und Alter tippe, scheint es schon zu existieren. Es gibt mir auch 30. Und wenn ich hier reintippe, existiert es schon. Oh, mein Browser versteht, dass es hier Variablen gibt, die für den Rat zugänglich sind . Und jetzt beginnen wir irgendwie mit JavaScript in einem Skript-Tag oder einer Punkt-JS-Datei zu interagieren . Wenn wir es in eine externe Datei verschieben, und hier können wir auch auf einige dieser Variablen zugreifen. Also fangen wir an, unseren Editor und unseren Browser-Terminal oder den Rat zu verbinden. So sehen wir hier, Alter hat keine Zitate um es kann. Es kann Zitate um ihn herum haben. Ah, man kann auch sehen, dass der Halbpunkt grundsätzlich optional war. Ich brauchte es nicht, und das ist okay, weil ich meinen Mantel auf neue Linien anziehen wollte. Und JavaScript ist heutzutage klug genug, um zu verstehen, dass für eine gute Praxis, lassen Sie uns mit diesem zynischen darin fortfahren und unsere Seite aktualisieren, und es ist immer noch sagt, 30 sieht nicht anders aus. Aber wenn ich hier im Alter tippe, können Sie sehen, dass es die Zitate um sie herum hat. Dies ist ein grundlegender Unterschied zwischen verschiedenen Variablentypen. Wir werden alles darüber auf der Straße reden, aber es ist wichtig, die Idee jetzt zu bekommen. Das ist eine Variable, die als Variable bezeichnet wird, eine variable Aktion namens var one. Alles, was einen Satz oder Leerzeichen darin hat. Jede Art von Raum ist wie das, was Sie hier sehen, das in Zitaten sein muss, so dass wir nicht einfach 30 30 30 30 30 30 30 mit Leerzeichen darin und Warnung unserer einen setzen können . Dies wird uns einen Fehler geben. Da gehen wir. Unerwartete Zahl, aber wenn wir Zitate um sie setzen, geben Sie dies eine Aktualisierung? Es funktioniert. An diesem Punkt sollten Sie ein wenig verwirrt sein, wenn Sie brandneu in Javascript darüber sind, worum es hier geht . Wenn wir also Zitate verwenden, wird dies eine Zeichenfolge genannt. Also das ist eine Zeichenfolge, und das ist eine Art von Variable, die im Grunde sagt, Hey, das ist ein Satz und dann haben wir speichern unsere beiden hier drin ist gleich der Zahl 30 oder einer beliebigen Zahl oder 30,5, So etwas. Und das wird eine Nummer genannt. Oder in anderen Programmiersprachen. Es wird manchmal als Ganzzahl bezeichnet. Eigentlich wäre es in diesem Fall flott. Aber das ist weder hier noch da. In diesem Moment werden wir ein wenig auf der Straße hinunterkommen. Und JavaScript fasst das eigentlich gut zusammen, und sie sagen, wie es uns egal ist , ob es ein Dezimalzeichen hat oder nicht. Uns ist es nur wichtig. Ist es eine Nummer? Ist es keine Nummer? Und wenn Sie also streng mit einer Zahl zu tun haben, brauchen Sie keine Zitate um sie herum. Da sind keine Räume drin. Sie haben nur Zahlen und Dezimalstellen, und das war's. Keine Kommas, kein Dollar signiert nichts dergleichen. Es ist einfach Zahlen und eine Periode. Also, wenn ich jetzt vorgehe und sage: Lasst uns auch weit warnen . Und was ich hier tun will, ist, diese loszuwerden. Aktualisieren Sie unsere Seite. Es wird 30,5 sagen, und es hier. Wenn ich auch viel tippe, können Sie sehen, dass 30,5 keine Anführungszeichen hat. Lassen Sie uns das größer machen, hat keine Anführungszeichen um ihn herum. Aber Var man tut es. Und das liegt daran, dass dies eine Zeichenfolge ist und auchweit auch eine Zahl ist. Warum ist das jetzt wichtig? Tolle Frage. Nun, da wir gerade JavaScript lernen, ist es für uns nicht wichtig. Aber es wird uns sehr, sehr bald wichtig werden. Und ich denke, je früher Leute diese Art von Unterschied in einem variablen Typ verstehen, desto besser wird Ihre Programmierung auf dem Weg sein. Das ist also alles, was es wirklich für dieses spezielle Video im nächsten gibt. Lassen Sie uns voran und beginnen, einige Variablen zusammen zu ermorden, damit Sie tatsächlich sehen können wie eine Variable die Arbeit angeblich hat, denn im Moment sind diese Variablen und ich meine, wir sind hart, sie zu beschichten, also sind sie keine wirklich Variablen sagten nur, Hey, weisen Sie Kurse gleich JavaScript für Anfänger zu und überschreiben Sie es dann sofort. Das nützt also nichts. Die Variable muss etwas sein, das sich ändern kann. Und, hey, wenn du dieses ganze Video nicht vollständig verstehst, mach dir keine Sorgen darüber. Bewegen Sie sich auf den nächsten sowieso, und schließlich wird dies alles einfach an Ort und Stelle klicken. Es wird viel einfacher, wenn wir tatsächlich anfangen, mehr JavaScript zusammen zu schreiben. 6. Merging: Hallo, Ende. Willkommen zurück. In der letzten Lektion haben wir ein wenig über Variablen gelernt. In diesem letzten werden wir lernen, wie wir sie zusammenführen können. Nein, das Zusammenführen von Variablen wie das Kombinieren von Sätzen heißt Concoct eine Nation. Siehst du das Wort hier? Verkettung. Sie werden es oft so sehen, wie das Wort kommen Katze als auch. Warum heißt es Cat Nation? Ich weiß es nicht. Wir könnten einfach „Emerging“ nennen. Aber hey, Entwickler mögen ihre schicken Worte. Also hey, wir nennen es Verkettung. Jetzt in diesem Video werde ich das meiste davon in der Konsole machen. Also gehe ich zur Konsole und lass uns weitermachen und Chrom größer machen, weil wir können. Und so auf meiner linken Seite habe ich nur ah, Variablen zusammenführen, die HTML öffnen. Das ist nur der Quellcode hier drin. Es ist momentan nichts drin, kein JavaScript, und es sieht aus wie eine leere Seite, und wir haben ein Terminal hier drin. Also könnte ich sagen, wachsam. Hi, und das wird funktionieren. Lassen Sie uns voran und klären Sie diesen klaren Rat und lassen Sie uns ein paar Variablen zusammen erstellen und dann kann Katze sie brauchen? Lassen Sie uns also ein Zeitalter und eine Einführung darüber schaffen, wer ich bin. Also sagen wir, Var intra war gleich Hi, mein Name ist Caleb, und ich bin etwas, etwas Jahre alt. Das ist also mein Intro. Und wenn ich das tippe, können Sie sehen, dass es gerade ausspuckt, was ich schon geschrieben hatte. Nun, wenn ich in unserer Zeit tippe ist gleich 30 Typ und Alter wieder, wir können sehen, dass Alter hat keine Zitate um sie herum. Also wissen wir, dass es tatsächlich eine Nummer ist, und wir wollen diese Nummer hier reinspritzen. Also, wie machen wir das? Nun, wir haben das irgendwie rückwärts gemacht, weil wir das definiert haben. Zuerst definieren wir zuerst Intro, und dann definieren wir ihr Alter. Aber ratet mal was? Wir können Variablen überschreiben, so dass wir Intro sagen können, und es sagt uns, was das Intro bereits gleich ist, anstatt nur dieses Leerzeichen hier drin zu haben. Was ich tun kann, ist, dass ich den Satz tatsächlich beenden kann, indem ich ein weiteres Anführungszeichen einfüge , ein Pluszeichen und dann die Variable, ein weiteres Pluszeichen und dann ein Zitat setzen kann. Und es gibt verschiedene Möglichkeiten, dies zu tun und moderneres Javascript. Aber du wirst das überall sehen. Wir werden das zuerst lernen. Und im Grunde heißt das: Hey, Hey, Intro, du trotzst schon, also brauchen wir keinen Einsatz. VAR sagt Hi, mein Name ist Calvo. Gute alte Calvo tabl e in. Mein Name ist Caleb und ich bin und dann beendet es den Satz und sagt: Hey, Hey, füge auch das Alter in ihrem, was auch immer dieser Wert ist. Legen Sie es da rein und dann Oh, hey, fangen Sie den Satz wieder mit einem weiteren Pluszeichen an und dann noch einem Zitat und setzen Sie einfach den Rest des Satzes hinein. Und wenn wir Enter drücken, können wir Hi sehen, mein Name ist Caleb und ich bin 30 Jahre alt, und ehrlich gesagt, das ist alles, was es gibt, um Nation zusammenzubauen. Jetzt tritt das Problem auf, wenn Sie versuchen, Nate Zahlen zusammenzubauen. Also, wenn ich eine andere Variable namens Nummer zwei erstelle Also , denke ich, und wir machen, dass 40.123 wir hier sehen können Numb ist gleich 40.123 Was passiert wenn ich 30 40.123 sagen wollte Also die Zahl sollte aussehen 3040.123 Wie sollen wir das Kabinett? Das ist heikler, weil diese Luftnummern und wenn Sie ein Pluszeichen mit Zahlen in den meisten Programmiersprachen machen , es fügt einfach die Zahlen zusammen, und das ist nicht das, was wir wollen. Also, wenn wir Alter plus taub gemacht haben, um das zu betrachten, gibt es uns eine Zahl, die wir nicht wollen 70.12 bis 99999 Dies ist eine lustige kleine Sache in der Informatik , wo es tatsächlich keine Lochnummer auf JavaScript gelegentlich läuft eigentlich ziemlich cooles Beispiel. Aber anstatt 70.123 zu sagen, heißt es 70.12 bis 99. Nn nn Nn und Unendlichkeit, Unendlichkeit und so weiter. Aber das ist nicht das, was wir wollen. Wie verschmelzen wir diese zusammen? Was? Wir können das tun, indem wir hier eine Schnur kontaminieren. Erinnerst du dich an die letzte Lektion? Strings und Zahlen auf der rechten Seite sind ein wenig anders. Irgendwie wichtig zu wissen. Nun, schon müssen wir den Unterschied hier kennen, damit wir das tun können und immer gesagt war, Hey, nimm die Zahl 30, die zu einer leeren Zeichenfolge und einem leeren Satz hinzugefügt wurde, und füge dann die zweite Zahl hinzu . Und so, wenn wir Enter drücken, können wir sehen, dass dies nicht mehr tatsächlich eine Zahl ist. Dies ist eine Zeichenfolge und wir können es String sagen, weil es Zitate um ihn herum hat. Und so sagt dies, dass dies eine Zeichenfolge von 3040.123 ist. Beachten Sie auch, wie es 0.123 sagt und nicht 1 zu 29999999 ist, weil es keine Zahl ist. Der Computer muss nicht so eine gerundete Zahl ausarbeiten. Es muss nur sagen, Oh, Oh, das ist eine Schnur. Also ja, ich verstehe, dass es hier Zahlen gibt, aber wir müssen keinen Haufen Mathematik-Zeug hinter den Kulissen durchführen, damit das funktioniert. Das ist genau so, als ob es normale englische Buchstaben waren. Negus muss keine englischen Buchstaben sein. Es könnten alle Briefe sein. Wirklich? Ah, aber ja, nur der Unterschied zwischen Buchstaben und Zahlen hier. Und so denkt dieser jetzt, dass diese Luft alle im Grunde Buchstaben statt Zahlen. Also lassen Sie uns voran und fügen Sie einen Satz mit zwei Katzen hinzu. Also sagen wir ah von unserer Katze eins. Sein Name wird ein Zephyr sein. Ist das für und von unserer Katze zwei ist gleich Henry. Das sind also meine beiden Katzen. Übrigens, Sie werden das undefiniert sehen. Wann immer Vyron verwenden, kommt dies in Hebezeug. Dies ist eine kompliziertere JavaScript-Funktion, die wir gerade jetzt angehen, wir werden dies ein wenig später angehen. Aber wenn du so undefiniert siehst, mach dir keine Sorgen. Nichts ist falsch. Es ist nur eine Art JavaScript entfernt, eine Variable zu registrieren und dann den Wert der Variablen zu registrieren. Es heißt wieder „Hissen“. Wir werden in Zukunft darauf eingehen. Und so jetzt möchte ich sagen, var Satz ist gleich ich habe zwei Katzen und die 1. 1 wird Katze eins sein. Und die 2. 1 wird auch Katze sein, und wir könnten es einfach so hier lassen. Und was wir hier sagen, ist hey, ich habe einen Satz. Aber ich möchte auch die Variable von Katze eins da drin setzen, also was auch immer das sein wird, es ist zufällig Zephyr. Aber es könnte ein anderer Name auf der Welt sein. Und vielleicht wurde es 100 Mal über geschrieben. Wir wissen es nicht. Was auch immer das Endergebnis ist, wir werden es hier reinbringen, und dann werden wir einen weiteren Teil des Satzes kontaminieren, nur das Wort Ende. Und dann, mit dem Pluszeichen, werden wir Nate Henry zusammenbauen. Wir sind auch nur Katze, auch nur Katze, also lasst uns weitergehen und Satz eingeben und du siehst, dass ich zwei Katzen habe, Zephyr und Henry. Darüber hinaus könnten wir auch noch tiefer in das eingehen. Wir könnten Dio unseres Alters eins. Sagen wir mal, Age of Cat One wird vier und unser zweites Alter sein. Das ist eine Katze für was auch immer dieses Alter sein wird. Wir wissen, dass es Henry ist. Ich weiß, dass sein Alter derzeit auch ist , also haben wir eine vierjährige und eine zweijährige Katze. Jetzt wollen wir tatsächlich Kapitän acht in eine andere kann koffeinierten Satz bereits so Satz bereits definiert wurde, und wie Sie sehen können, kann ich dies in meine Konsole nehmen und es sagt mir, irgendwie in verblasst Text aus. Ich habe zwei Katzen, Zephyr und Henry. Gehen wir weiter und sagen, Satz ist gleich Satz plus, also wird es diesen Wert nehmen, und wir können Katze etwas darüber brauchen? Also wollen wir Ach, Periode ganz am Ende hier setzen und sagen wir, und sie sind etwas Jahre alt, also etwas und etwas Jahre alt, also vier in das ist, was wir hier reinkommen wollen. Also hilft es mir immer, wenn ich gelernt habe, wie man sich zusammensetzt. Nate ist einfach wie Unterstriche da drin. Und dann können Sie einfach Ihre lustige Verkettung Art von Stil hier in tun, wo Sie schließen Zitat plus Zeichen und dann hier könnten wir Alter eins plus Zeichen Zitat setzen und Sie können sehen, es ist eine entgegengesetzte Reihenfolge. So geht Zitat plus Zeichen, und dann wieder in Sie tun plus ich in Zitat, und wir werden das gleiche tun hier drüben. Und das ist nur so, dass ich zwei Jahre alt sein werde, und lass uns voran gehen und schlagen. Geben Sie ein. Oh, und übrigens können wir Semikolons am Ende setzen. Aber das müssen wir nicht unbedingt tun, weil unser Konsul oder Chrome in diesem Fall weiß, dass jeder Befehl sein eigener Befehl ist, also müssen wir dies nicht als Semikolon tun. Aber auch hier ist es nur eine gute Übung, in die man einsteigen kann. Da Javascript älter wird, verwenden wir Semikolons viel weniger und cool. Sie haben wahrscheinlich auf dem Bildschirm geschrien und sagen, Caleb, Alter zu existiert nicht. Es wird Alter eins genannt. Das können Sie hier sehen. Ich nannte es nicht im Alter von zwei Jahren. Ich habe es gerade Richter genannt. Und so lassen Sie uns weitermachen und das wiederholen. Wir könnten auch einfach eine Variable namens Age Two neu definieren oder einfach definieren, und dies würde es beheben. Lasst uns weitermachen und uns in Alter verwandeln. Und da gehen wir. Und jetzt steht da, ich habe zwei Katzen, Zephyr und Henry, und sie sind vier und zwei Jahre alt. Und wenn ich also vorgehe und das klar mache und wieder Satz nehme, um das größer zu machen, habe ich zwei Katzen, deren F 100 sie vier Jahre alt sind. Also habe ich hier Altern. Wir wissen, Alter zwei, wir haben Alter eins ist, denn wir wissen, dass wir eine Katze eins haben. Wir haben Katze zwei und dann haben wir einen Satz. Also haben wir hier eine Reihe von Variablendeklarationen gemacht. Wir haben Variablen definiert und sie in einem Satz zusammengeführt. Und dann tauchen wir es noch einmal in diesen Satz auf. Also das ist im Grunde alles, was es gibt, um Nation zu bilden. Nun, Sie werden dies überall sehen, weil Javascript eine Sprache ist, in der SieIhre Webseite, Ihren HTML und sogar Ihr CSS ändernkönnen Ihre Webseite, Ihren HTML und sogar Ihr CSS ändern , und Sie werden schließlich eine Variable nehmen und ersetzen etwas Text auf Ihrer Seite mit was auch immer dieser Variablenwert sein wird. Und so ist das, wie wir Cat Nation tun. Nun, wenn Sie daran interessiert sind, dies eine Chance zu geben, können Sie genau das tun, was ich in dieser Variablen getan habe, und sagen: Hey, Hey, mein Name ist wie auch immer Ihr Name ist. Ich habe eine Katze oder einen Hund oder ich habe wie viele Bücher haben Sie? Vielleicht hast du 1000 Bücher und du könntest so etwas tun. Es ist immer gut, da rein zu gehen und uns eine Chance zu geben. Vergiss es nicht. Wenn Sie jemals Fragen haben, bin ich hier, um Ihnen zu helfen. Sie können immer einen Kommentar oder eine Frage unten hinterlassen 7. Console: Okay, Willkommen zurück. In der letzten Lektion sprachen wir Buch und Katze Nation. Und diese Lektion werden wir über nicht ausgezahlte Nation sprechen. Wir werden uns tatsächlich einen besseren Weg ansehen, Variablen an unseren Konsul zu drucken, anstatt Alert zu verwenden. Also, bis jetzt haben wir Alarmtest gesagt und dann, wenn wir unsere Seite aktualisieren, ärgert es uns einfach damit. Und jedes Mal, wenn wir schlagen aktualisieren, Es ärgert uns damit. Und weißt du, zuerst, wenn du JavaScript startest, ist das keine große Sache. Aber Sie sehen diese Funktionalität nicht wirklich in der Wildnis. Die Leute benutzen keine Alarme mehr zu oft. Es sei denn, du , hast angefangen,einen Beitrag zu schreiben und dann den Zurück-Knopf zu drücken. Bist du dir sicher? Weil, willst du wirklich gehen? Das ist eigentlich eine ganz andere Sache . Sieht einfach gleich aus. Also hier drin, was wir tun wollen, ist, etwas zu unserem Konsul hier einzuloggen. Und was auch immer Javascript wir hier drin sind, alles. Es könnte buchstäblich alles sein. Wir wollen es nur in die Konsole bringen, dass wir sehen können, was es ist, und dies ist eine sehr, sehr nützliche Möglichkeit, Ihr JavaScript zu debuggen. Also lassen Sie uns voran und erstellen Sie eine Variable. Und ich werde sagen, mein Name ist Caleb Tallinn und unser Beruf. Ich bin ein Lehrer von Handel. Ja, das stimmt eigentlich ganz. Auch Web-Entwickler, So Lehrer und Web-Entwickler. Und lasst uns diese Warnung loswerden. Und sagen wir, Sie müssen nur Ihre Phantasie Hut hier für eine Sekunde anziehen. Aber sagen wir, wir haben 10.000 Zeilen JavaScript und wir wissen nicht, was der Wert des Namens derzeit ist. Und so haben wir eine Stadt mit Code, und was wir tun werden, ist, dass wir einfach so tun werden, als wäre es irgendwo hier oben, und wir können nicht wirklich leicht darauf zugreifen, aber wir wollen sehen, was es ist. Also, ja, wir könnten Alarmnamen machen, und wenn ich hier rüber gehe, wird es mir sagen, was es ist. Aber das ist ärgerlich. Und wenn Sie zufällig in einer Schleife sind, werden wir später über Schleifen sprechen. Dies könnte für 100 1000 Generationen ausgeführt werden. Es wird Sie nur immer wieder alarmieren und immer und immer und immer und immer. Ihr Browser könnte sogar davon abstürzen. Wer weiß es? Das ist kein guter Weg, um dein Leben zu leben. Ein besserer Weg, um dein Leben zu leben, als wir hier reingehen und sagen wir, Konsul Dot Log. Und dann könnten wir alles, was wir wollen, hier reinbringen. Also sagen wir Name und dann ein Komma und lassen Sie uns die Namensvariable in Jahr setzen, so dass Name Colon tatsächlich gesetzt ist, und so können Sie sehen, dass dies eine Zeichenfolge ist und das ist eine Variable. Lassen Sie uns Ihre Seite hier aktualisieren, und ich werde das etwas kleiner machen müssen. Danke. So können wir den Namen Caleb Tallinn sehen, und es führt online. 29 der Datei namens 60 Unterstrich Konsole Unterstrich log dot html Und wenn ich darauf klicke, wird es mir genau sagen, wo dies ausgeführt wird. Dies ist eine gute Möglichkeit, Ihren Code zu debuggen. In der Tat ist dies eigentlich nur eine wirklich gute Möglichkeit, herauszufinden, was im Code vor sich geht. Im Allgemeinen gehen wir voran und geben Beruf in hier und wieder. Ich habe gerade ein Komma hinzugefügt und wir können hier sehen. Es steht. Mein Name ist Caleb Tallinn und Lehrer und Web-Entwickler ist mein Beruf so vorwärts? Wir werden wahrscheinlich das Konsolenprotokoll viel öfter verwenden, als wir verwenden werden. Alert Alert ist nur ein wenig widerlich, und es saugt Art, in sie die ganze Zeit klicken. Und es ist wie, Hey, hier ist wachsam. Okay, hier ist ein weiterer Alarmklick. OK, hier ist eine weitere Warnung klicken Sie auf OK, und nur wird es ein wenig Manana als ein wenig zu viel, besonders wenn Sie anfangen, mehr und mehr Code zu schreiben. Und die helle Seite daran ist, wenn Sie Code schreiben, der auf einer Live-Website geht, wird er nur in Ihrer Konsole angezeigt. Also, wenn ich diesen Rat hier loswerde und ich mich einfach erfrischen würde, passiert nichts. Lisa sieht so aus, als wäre nichts passiert. Aber wenn ich mit der rechten Maustaste klicke, inspiziere gehe in meinen Rat, das geht weiter. Und so wirklich nur ein Entwickler jemals gehen, um dies zu sehen. Und wenn Sie also etwas in der Produktion auf einer Live-Website testen, können Sie diese Methode immer verwenden. Jetzt gibt es ein paar andere, die Sie verwenden können, damit wir Konsolenpunkt warnen Warnung, Fremde Gefahr, die in Kleinbuchstaben ging und ich will Großbuchstaben Ah, dieser geht gelb Warnung. Fremde Gefahr. Und das könnten wir auch tun. Konsul, lassen Sie uns diesen Kleinbuchstaben Counsel Dot Fehler machen, und wir werden das immer und immer wieder tun. Und weil diese alle in ihren neuen Zeilen sind, brauchen sie kein Semikolon. Aber lasst es uns sowieso reinwerfen. Und jetzt sehen wir eine Warnung, ein normales Konsolenprotokoll und einen Fehler. Und da ist es. Wir haben eine Warnung. Fremde Gefahr. Mein Name ist Caleb, nennt ihn einen Lehrer, einen Webentwickler, und auch Fehler, Fehler, Fehler, Fehler, Fehler und auch die entsprechenden Zeilen, die sie alle online stattfinden. 28 9 29 und Linie 30. Das ist also ein besserer Weg zu leben. Ihr JavaScript-Leben ist die Verwendung von Konsolenprotokoll. Sie werden nicht zu oft Konsolenkonsole War Council Fehler verwenden. Im Allgemeinen verwenden wir nur Konsolenprotokoll. nun Wenn Sienunaus einer anderen Programmiersprache kommen, ist dies der Druckfunktion sehr ähnlich. Wenn Sie zum Beispiel Python verwenden , ist das wie Print. Wenn Sie von einem riesigen P-Hintergrund kommen, ist es wie Echo etwas zu sagen und der Javascript-Weg wird einfach abgelehnt. Hat es getan. Ah, Konsul Dot Logbuch. Also wieder vorwärts, wir werden Konsolenprotokoll viel mehr verwenden, also sollten Sie sicherstellen, dass Sie wissen, wie Sie diesen Konsul wieder auf Ihrer Seite öffnen können. Das ist sein Rechtsklick. Gut inspizieren. Öffnen Sie im Allgemeinen zuerst Ihre Elemente, und Sie müssen nur klicken. Konsul. Manchmal müssen Sie hier reingehen und auf Konsul klicken, je nachdem, wie groß Ihr Bildschirm ist. Ah, aber da ist immer ein Konsul Tab drin, und Sie können das immer öffnen und sehen, was der Code tut, wenn er Ihnen Warnungen, Protokolle oder Fehler gibt. 8. HTML-Elemente auswählen: Hallo und willkommen zurück in dieser Lektion. Wir werden in einige der tatsächlichen Gründe zu bekommen, warum wir JavaScript lernen und das ist, HTML-Elemente zu ändern. Und das erste, was wir tun wollen, ist, dass wir ein Skript-Tag erstellen wollen. Wir brauchen immer das Skript, um direkt über dem Körper zu sein. Oh, übrigens, der Grund, dass es über dem Körper liegt und nicht in ihrem Kopf. Nun, wir haben Javascript in den Kopf gesetzt, aber jetzt setzen wir Javascript am Ende ihrer Seite, so dass alle zusätzlichen HD-Milch entladen. Zuerst setzen wir es am unteren Rand der Seite, so dass, zum Beispiel, wenn wir und h ein in hier hallo Welt haben und wir nur Ihre Seite aktualisieren, wir sehen hallo Welt. Und im Grunde, wenn wir irgendwelche Elemente und JavaScript verwenden, muss dies zuerst existieren. Der HTML-Code muss vorhanden sein, bevor das JavaScript geladen wird. Und in einigen Fällen, wenn Sie Javascript darüber setzen, wird das Javascript geladen. Es wird dann versuchen, nach einem H zu suchen namens Hello World oder hat einen Hallo World-Text darin und es wird es nicht finden, weil es nicht geladen wurde. Und ja, ja, eine Zeile kann einen Unterschied machen. In den meisten Programmiersprachen läuft in der Regel ein Programm von oben nach unten. JavaScript ist nicht anders. Es verläuft von oben nach unten. Und so werden wir Hallo World hier reinbringen. Ah, und lassen Sie uns das ein I d. Also das ist nur ein grundlegendes HTML und ich habe einen HTML-Kurs, wenn Sie einen schnellen kleinen HTML-Refresher benötigen , der den ultimativen HTML-Entwickler genannt wird. Und so lassen Sie uns das einfach ein I d Test geben. Jetzt. Wenn wir uns speichern und auffrischen, wird das nichts tun. Es wird nicht eine einzige Sache für uns tun. Und was wir tun müssen, ist, dass wir lernen müssen, wie man dieses Element tatsächlich auswählt und dann Lage sein, es ein wenig zu modifizieren. Und so ist JavaScript weitgehend bekannt für die Arbeit mit HTML und X HTML Markup im Grunde alles, was Tags wie diese hat. JavaScript ist ziemlich gut im Arbeiten mit, fast so, als ob es entworfen wurde, um so zu funktionieren. Es gibt also viele verschiedene Möglichkeiten, ein HTML-Element oder eine Gruppe von Elementen oder wie alle H auf einer Seite auszuwählen . Aber das werden wir nicht tun. Wir bleiben nur bei etwas Grundlegendes namens get element von I D. und so sieht es so aus. Das ist Ah, bewegen Sie das nach oben. Dokumente dot get element by i d. Und dann setzen wir einfach die Idee hier rein, und so passt das i d Test, und das ist da oben. Und wenn wir uns wieder retten, werden wir nichts sehen. spielt keine Rolle, wie oft Sie aktualisieren, alles, was es tut, ist, diese Elementnote zu greifen. Dies wird also ein Knoten genannt. Wir müssen dies tatsächlich in einer Variablen speichern. Also lassen Sie uns voran und legen Sie dies in eine Variable namens test. Und noch einmal, wenn wir Ihre Seite aktualisieren, wird nichts passieren. Aber was passiert, wenn wir in unseren Konsulat Typentest gehen? Oh, sieh dir das an, sagt H. Einer mit einer Vorstellung von Tests. Und es wählt es tatsächlich für uns aus. Sieh dir das an. So nach unten gezogen. Nichts bewegt sich nach oben, und es hat es für uns ausgewählt. Jetzt können wir Dinge tun. Also, wenn wir Dot hatten, können wir hier alle möglichen verschiedenen Dinge sehen und hier wird JavaScript sein. Eine sehr, sehr große Welt. Es gibt so viele Dinge tatsächlich, bisher betrachten wir Ereignis-Listener, mehr Ereignis-Listener , mehr Ereignis-Listener, mehr Ereignis-Listener. Und es geht einfach weiter und geht und geht weiter. Wir können diesen Stil ändern. Wir können das Titel-Tag ändern. Wenn wir es animieren wollten, könnten wir ihm einen Klassennamen geben oder einen Klassennamen entfernen. Wir könnten alle möglichen Dinge hier drinnen erledigen. Aber lasst uns voran gehen und herausfinden, was die Texas und das ist nur Punkt inneren Text und das wird uns nur die Steuer geben. Wir können dies auch mit HTML tun. Wir tun Punkt innere HTML und so können wir sehen, dass dies sagt jetzt hallo Welt, zu wissen, dass wir jetzt hier gehen und sagen Test dot inter html und das ist, wenn wir HTML schreiben wollen , so könnten wir sagen, uh, tun eine zugrunde liegende Obwohl das veraltet ist. Lassen Sie uns eine zugrunde liegende nehmen sowieso seit zwei wie niedrig Slash Sie Welt und lasst uns voran gehen und uns retten und sehen, was passiert. Verdammt! Sieh dir das an. Es hat es für uns unterstrichen. Aber wenn wir gehen und tatsächlich die Seitenquelle sehen, gibt es keine Unterstreichung. Das ist alles. JavaScript. Also, was Javascript tat, wurde gesagt, Hey, schnapp dir den Knoten. Schnappen Sie sich dieses H ein Element, dieses hier genau und ändern Sie den Inter html. Nun, was wir tun könnten, ist, dass wir auch das alte Zeug speichern könnten, also könnten wir sagen, dass der Inter HTML hoch sein wird. Willkommen bei JavaScript-Boden-Anfängern, aber lassen Sie uns voran und speichern Sie die alten Sachen. Lassen Sie uns unseren alten Text machen. Lassen Sie uns machen, dass camel case gleich test dot inter html ist, und das wird nur dieses inter HTML greifen und es in einer Variablen speichern und über eine Konsole darauf zugreifen können . Also lasst uns voran gehen und das speichern. Hallo, Willkommen bei JavaScript für Anfänger. Und wenn wir versuchen, auf diese sehr Bowling hier genannt alten Text zugreifen, sollten wir nur in der Lage sein zu schreiben. Lasst uns das größer machen. Nun, ich hab, hallo. Da ist es. Das ist das alte Zeug. Wir haben das alte Zeug in einer Variablen gespeichert, bevor wir es geändert haben. Und jetzt können wir es auch wieder ändern, weil wir immer noch Zugriff haben, um als Knoten zu testen. Lassen Sie uns voran und ändern Sie den inneren Text in den alten Text. Und jetzt verwenden wir Variablen ziemlich effizient an dieser Stelle. Und zur gleichen Zeit packen wir auch diese ganze HTML-Elemente diesen Knoten und wir sagen, Hey, ja, Hey, ja, ich verstehe, dass du Hallo sagen wolltest, Welt, aber, hey, wenn die Seite geladen und gegen das JavaScript tatsächlich etwas Magie funktioniert und es für uns ändert , das ist, was Javascript für uns getan hat. Nun wieder, es gibt viele verschiedene Dinge, die wir auf einem HTML-Knoten tun können, so dass wir Testschlagpunkt eingeben und dann könnten wir buchstäblich einfach für Tage und Tage und Tage und Tage und Tage und Tage und Tage scrollen . Und Sie können sehen, dass diese Liste einfach weitergeht und weiter und auf und auf ihn. Und so ist JavaScript eine wirklich große Welt in allen. Ehrlich gesagt, wir werden nicht von jedem einzelnen Ding hier lernen, weil wir für eine sehr, sehrlange Zeit hier sein werden für eine sehr, sehr . Meine Lehrmethodik ist es, Ihnen beizubringen, wie man effizient lernt, so dass, wenn Sie auf dem Weg in einem Unternehmen arbeiten und sie etwas namens Scroll to Well verwenden, Sie wissen, wie Sie auf Scroll zugreifen können und Sie wissen, wie Sie herausfinden, was das ist. Auch wenn wir es jetzt nicht in diesem Kurs lernen, werden wir in diesem Kurs viel lernen. Aber es gibt einfach keine Möglichkeit, jede einzelne Sache zu lernen. Also, was ich möchte, dass Sie als, ah, wenig Test ein wenig, ein wenig Hände auf Erfahrung neue HTML-Datei erstellen und einfach jedes Tag erstellen Es muss nicht in einer Kirche sein. Man gibt ihm ein Ni de von etwas. Es spielt keine Rolle, was diese Ideen, solange es diesem Wert hier entspricht. Nicht diesen hier. Dies ist der Name unserer Variablen. Aber dieser hier und dieser hier, die müssen übereinstimmen. Erstellen Sie also dieses Element und wählen Sie dann den Knoten mit get Element von I d Remember, wir verwendeten Dokumente dot get Elemente von Idee. Wir werden mehr darüber sprechen, was dieser Punkt auf der Straße bedeutet, wenn wir in fortgeschritteneres Javascript gelangen und dann einfach den inneren HTML-Code ändern, vielleicht unterstrichen, vielleicht kursiv formatieren, vielleicht fett machen. Sie tun alles, was Sie mögen, was Sie schreiben beliebiges HTML, das Sie dort wollen, solange Sie inter html verwenden . Und wenn Sie jemals nur die Inter Tax ändern, könnten Sie immer nur inneren Text. Und dann muss Ihr Browser nicht eine Reihe von JavaScript oder nicht JavaScript-HTML analysieren und rendern . Es könnte einfach normalen Text machen, was eigentlich viel effizienter ist. Geh weiter, gib dem eine Chance. Wenn Sie stecken bleiben, lassen Sie eine Frage unten und ich bin glücklich, Ihnen zu helfen. Andernfalls lasst uns zur nächsten Lektion gehen. 9. Eine Möglichkeit zum Teilen von Code: Okay, lassen Sie uns über einen Weg sprechen, mit dem Sie Ihren Code teilen können. Das ist relativ einfach. Wenn Sie also nicht verwenden, wenn Sie nicht wissen, dass ich Hub bekomme oder bekomme, werde ich das jetzt nicht auf Sie zwingen . Es ist gut zu wissen, aber im Moment, aber im Moment, wenn Sie das nicht wissen, nur wissen, dass es einen besseren Weg gibt, HTML CSS und JavaScript zu teilen, und das ist in Form von Code-Stift. Also, wenn Sie gehen, um Stift dot io Code und Sie können klicken Sie auf die Schaltfläche, dies hat nur beginnen Beschichtung. Und wirklich, all dies wird für uns tun, ist drei Abschnitte zu erstellen, in denen wir HTML, CSS und JavaScript haben , und wir können buchstäblich jedes HTML CSS und JavaScript in Ihrem, das wir wollen, korrigieren. Und dann können wir all diesen Code speichern, und dann können wir ihn mit jemand anderen teilen, damit sie den Code auch sehen können. Also lasst uns voran, und ich werde jeden hier reinsetzen und Hallo sagen, mein Name ist Caleb, und was ich eigentlich tun werde, ist, dass ich das ein bisschen Javascript mache, aber ich D Span ist gleich dem Namen, so dass html nicht aussieht verschieden. Ah, die CSS. Lasst uns die Spannweite ändern. Lassen Sie uns diese Spanne ändern, um eine Textdekoration des zugrundeliegenden Und im JavaScript gehen wir voran und wählen Sie den Namen als I d und ändern Sie ihn. Wir werden eine Variable erstellen. Wir werden es nennen Name ist gleich dem Dokument Punkt Get, Eigentlich, ändern wir seine Ansicht. Ich mag diese Aussicht nicht wirklich. das Ja, hier ist ein bisschen besser, und wir können das auch ein bisschen besser machen, aber wir müssen die C s nicht mehr sehen. Okay, das sieht ein bisschen besser aus. - Ja. Da gehen wir hin. Ok. Dokument. Erhalten Sie Element nicht durch i d es ist Kamelfall. Jedes Wort, das nicht das erste Wort ist, hat einen Großbuchstaben. Wir wollen Namen bekommen, der dieser Idee in hier Namen Punkt Innere Text entspricht und sagen wir, dies wurde von meiner Katze namens Zephyr entführt. Und lasst uns weitermachen und dem einen Safe geben. Und Ono bittet mich, mich anzumelden. Sie können sich vollständig anmelden, um die Anzahl zu erstellen. Es ist völlig kostenlos. Okay, also habe ich mich gerade eingeloggt, und los geht's. Wir wollen nur den Text ändern, so dass wir ihn speichern und Sie können in meinem sehen Ihre L sagt Code Stift dot io Schrägstrich Caleb Holley und Schrägstrich Stift und dann etwas Hash, und Sie können tatsächlich nur kopieren und fügen Sie den gesamten Code an jemand anderen. Also, wenn ich das in einem neuen Tab öffne, wird es meinen ganzen Code hier speichern. Das ist ziemlich cool. Und so ist das eine gute Möglichkeit, Ihren Code zu teilen. Sie können es auch ändern. Also der Name wurde von meiner Katze geändert. Und wenn eine erfrischende hier, es änderte auch den Namen Dort, da ist es. Nun, wenn Sie zu irgendeinem Zeitpunkt mit Konsul arbeiten, können Sie auch diesen Konsul hier öffnen. Und Sie könnten conta wirklich alles protokollieren, was Sie wollen, so konnten wir con so neue Konsole Dot Log-Test tun , und es zeigt sich in ihrem kühlen, so dass Sie speichern zu jedem Zeitpunkt sammeln können. Sie können sogar jemanden Code nehmen und ihn verzweigen, was im Grunde bedeutet, Sie eine Kopie in Ihrem Konto ihres Codes erstellen, damit es seinen Code nicht alles ändert , aber es wird in Ihrem Konto gespeichert und Sie können wie es und Sie tun alle möglichen Dinge. Sie ändern Ihre Ansicht, aber vor allem können Sie annehmen, dass Sie l. und Sie können kopieren und einfügen. Es sind zwei Freunde. Sie können eine Frage mit einem Mädchen mit Ihrem Beispielcode hier wie ein Caleb stellen. Warum funktioniert das nicht? Und du könntest deinen ganzen Code dort reinlegen. Das ist eine super großartige Möglichkeit, Code zu teilen und um Feedback zu bitten und um Hilfe zu bitten. Und schließlich, wenn Sie ein Projekt erstellen, wenn Sie möchten, können Sie immer Code-Stift verwenden und einfach den endgültigen Bildschirm teilen. Sie könnten einen Screenshot des endgültigen Bildschirms machen und den Codestift teilen, den Sie in Ihrem Skill-Share-Projekt sehen. Natürlich, wenn Sie keinen Code-Stift verwenden möchten, wenn Sie kein Konto erstellen möchten, müssen Sie es auch nicht. Sie können weiterhin HTML-Dateien und JavaScript-Dateien verwenden und Screenshots erstellen. Das ist völlig in Ordnung, einfach wieder. Vergessen Sie nicht, Sie können Ihr Projekt immer mit dem Rest der Gruppe und vor allem mit mir teilen . Ich werde einen Blick auf Ihren Code und Ihr Endprodukt werfen, und Sie wissen, wenn Sie Feedback wünschen, kann ich Ihnen auch Feedback geben. Aber Sie müssen dieses Projekt auf Fertigkeiten teilen zuerst machen und vorwärts bewegen. Es ist definitiv eine gute Idee, jeden Code, den Sie schreiben, hier zu setzen. Ah, in einem Skill-Share-Projekt, damit ich Ihnen Feedback dazu geben kann. Ich werde den Code-Stift während des restlichen Kurses nicht zu sehr verwenden. Ich dachte nur, dies wäre eine gute Möglichkeit, Ihnen zu zeigen, wie Sie Ihren Code auf eine nette und saubere Art und Weise teilen können . 10. JavaScript #1: In Ordnung, schauen wir uns unser erstes Mini-Projekt an. Es ist Zeit zu beginnen, einige der Dinge, die wir gelernt haben, zu praktizieren, denn welcher bessere Weg, um Erfahrungen in die Hand zu bekommen, als sie tatsächlich zu erleben? Also haben wir bisher einiges gelernt, und wir werden nur ein paar der Stücke verwenden, die wir gelernt haben. Und was wir tun wollen, ist, dass wir in diesem Mini-Projekt angeboren eine Zeichenfolge und Variable zusammen. Und dann möchte ich, dass Sie diese Zeichenfolge auf die Seite dieser endgültigen Variablen ausgeben. Ich möchte, dass Sie das auf der Seite ausgeben, indem Sie ein Element auswählen und den inneren HTML-Code ändern. Also lasst uns das schnell schreiben. Nummer eins. Erstellen Sie ein Skript. Sie können eine Zeichenfolge und eine Variable zusammen Nummer zwei abfangen, mit dot inter html und Element von I d erhalten. Ändern Sie den inneren html eines Elements, um das zu sein, was Ihre Variable ist. Das ist es also wirklich. Es scheint zunächst nicht viel zu sein, aber Sie wollten dies immer und immer und immer wieder in Ihrer Web-Entwicklungskarriere tun. Und so ist das wirklich, wirklich gute Praxis direkt an der Manschette. Nun, wenn Sie die Lösung sehen wollen, schauen Sie sich einfach dieses Video an und ich zeige Ihnen genau, wie ich es mache. Andernfalls, wenn Sie es einen Schuss geben möchten, ist jetzt die Zeit, das Video zu pausieren und dies selbst zu versuchen, was ich Sie dringend auffordere. Versuchen Sie definitiv, dies zuerst selbst zu tun. Aber weißt du was? Wenn Sie nicht das Vertrauen haben, all das zu tun, nur noch Hey, ist das OK. Sie können meine Lösung beobachten, und dann können Sie sie nach, wenn Sie wollen. Also werde ich hier ein H erschaffen. Nur ein großer Text, und ich werde sagen, meine Lieblingskatze ist und dann hier drin werde ich eine Spanne von Katzennamen setzen, eine Vorstellung von Katzennamen hat, und es wird mit dem Namen Zephyr beginnen. Und wenn ich meine Seite hier aktualisieren, können Sie sehen, meine Lieblingskatze ist Mühe. Nun, was ich tun möchte, ist, dass ich seine Bemühungen gegen etwas anderes austauschen möchte. Jetzt werde ich hier einen etwas komplizierteren Weg nehmen, und ich muss mit meinem Skript beginnen, richtig? Also beginne ich mit einem öffnenden und schließenden Skript-Tag, und ich muss den Katzennamen auswählen. So variable Katze Name ist gleich Dokumente Punkt Get Element von I. D. Cat name. Und wenn ich speichere und aktualisiere, wirst du sehen. Hey, es ist nichts passiert. Das wird erwartet. Alles, was wir getan haben, war eine Notiz in eine Variable zu setzen. Und wenn wir das tun, wenn wir den Namen der Katze eingeben, können Sie tatsächlich sehen, dass es Jahre ausgewählt wird. Also lasst uns Scharniere. Katzenname und es ist nur die Auswahl Zephyr. Das war's. Jetzt ist das Ziel, im Grunde nehmen eine Schnur und kann Katyn acht auf diese Saite. Also lassen Sie uns voran und tatsächlich tun ist ein wenig kompliziertere Methode. Und nennen wir diese Variable namens Zephyr, und wir werden den Katzennamen Punkt inneren Text bekommen. Und wenn wir Konsul Dot Log ist jemals und unsere Seite hier aktualisieren, sagt es Aufwand einfach so . Genau da drin. Es ist ein wenig quetschig, aber hey, das ist OK, weil das sowieso nur zum Debuggen dient, also haben wir seine Mühe dort drin, und das ist der aktuelle Text. Das ist der aktuelle innere Text. Aber für dieses Mini-Projekt wollen wir zusammenbauen. Benötigen Sie eine Zeichenfolge und eine Variable. Also haben wir hier ein sehr Mobbing. Also lassen Sie uns Cat benannte die Zeichenfolge, um sie. Also lasst uns tatsächlich ändern. Lass es uns überschreiben. Lassen Sie uns tun Zephyr ist gleich Zephyr und lassen Sie uns abspritzen Kabinett eine Schnur, um es. Also wird es sagen, meine Lieblingskatze ist Zephyr ist gleich Zephyr, was auch immer das ist. Also ist es zufällig dieser Text hier drin und Henry, jetzt wird dieser Satz keinen Sinn ergeben, weil ich im Plural bin. Izing es. Aber das ist in Ordnung. Wir müssen es jetzt nicht sinnvoll machen. Wir müssen nur dafür sorgen, dass das funktioniert. Und so lassen Sie uns voran und geben Sie Katze Namen auf dem Punkt inneren Text oder inneren HTML ist gleich leiden, und so wird dies ein wenig chaotisch. Aber hey, lassen Sie uns erfrischend sagen, dass meine Lieblingskatze jemals ist und Henry jetzt, eigentlich, eigentlich, ein besserer Weg, dies zu tun, ist nicht notwendigerweise überschreiben dies. Das war nur ein Beispiel. Wir würden wahrscheinlich eine neue Variable für diese sogenannten Katzen wollen, und wir würden uns auch zwei Katzen ändern. Also werden wir eine neue Variable erstellen, die heißt, was auch immer seine Bemühungen immer seinen Namen hat Plus und Henry. Also, wenn wir durch diese rückwärts arbeiten, haben wir Katzen ist gleich Zephyr. Was bedeutet jemals Zephyr gleich der Katze namens inneren Text? Nun, das verwendet eine Variable namens cat name. Wir wissen, dass das dieses Element hier oben ist und diesen Intertext bekommt. Also wissen wir, Zephyr ist im Grunde dieser Wert genau hier. Das ist ziemlich genau das, was es ist. Eigentlich ist es genau das, was es ist. Und so ist es so, als würde man Zephyr, Katyn, acht und Henry sagen Katyn, . Und wenn man die zusammensetzt, sieht es so aus. Und so ist das, was in ihren H e Mails sein wird, wird dein innerer HTML jetzt ein Zephyr und Henry sein. Und so funktioniert es irgendwie. Und wenn Sie jemals Variablen durch hart beschichtete Strings oder andere Werte ersetzen müssen, ist das völlig in Ordnung. Ehrlich gesagt, was dir hilft, das auf deine eigene Art zu lernen, ist okay, also lass uns voran gehen und uns retten. Aktualisieren. Und wir können sehen, dass Katze Name ist immer noch hier Cat Name und seine mag alles cool und das ist, wie wir es ersetzen. Jetzt. Wenn wir dies überprüfen wollten, konnten wir immer die Seitenquelle anzeigen. Und aus unserer Sicht, Seitenquellen sagen, meine Lieblingskatze ist Zephyr. jedoch Wenn Sie esjedochtatsächlich mit aktiviertem JavaScript anzeigen, heißt es, meine Lieblingskatze ist jemals und Henry. Okay, so würden wir das machen. Vergessen Sie nicht, dass Sie immer einen Codestift erstellen können, und Sie können ihn auf Skillenfreigabe in Ihrem Projekt freigeben. Oder Sie können einfach im Grunde Ihren ganzen Code nehmen. Sie können es dort kopieren und einfügen. Sie könnten einen Screenshot machen, wie das funktioniert. Sie können irgendwie tun, ah, ah, Visual Studio auf der linken Seite und dann die endgültige Ausgabe auf der rechten Seite. Sie können einen großen Screenshot davon machen und das einfach in Ihrem Projekt sagen, und ich kann es mir ansehen und Ihnen Feedback und Hass geben. Wenn du dran bleibst, vergiss es nicht. Sie können immer Fragen, Kommentare und Bedenken unten hinterlassen , und ich werde sie so schnell wie möglich 11. String: Hey, da. Ich hoffe, Sie haben das viele Projekt genossen. Wir werden noch ein paar von denen auf der Straße machen und, ah, ah, wir werden irgendwie ein paar Sachen dazwischen lernen, damit wir, wissen Sie, ein wenig Übung lernen können, ein wenig üben lernen können, ein wenig üben lernen, ein wenig üben. wenig. Ich denke, das ist eine wirklich gute Möglichkeit, JavaScript zu lernen. Und so werden wir in diesem Video über String-Manipulation lernen, und es klingt schick, aber wirklich nicht. Es ist eigentlich super üblich in JavaScript, so dass String-Manipulation im Grunde ist, dass wir eine Variable nehmen, die wie ein Satz oder vielleicht eine Zahl ist, und wir haben manipuliert. Wir ändern es. Wir zwingen es, etwas anderes zu sein, und es gibt verschiedene Möglichkeiten, uns zu tun. Aber in diesem Video werden wir nur ein paar von ihnen durchgehen. Also gehen wir zu Kleinbuchstaben zu Großbuchstaben, teilen verbundenen Slice und Sub-String. Es gibt viel mehr davon, aber ich denke, das ist ein wirklich, wirklich guter Weg. Gewöhnen Sie sich irgendwie daran, wie wir einige Daten manipulieren können? Also in erster Linie, lassen Sie uns ein H mit einem i d Satz erstellen und gehen und etwas Lauren Ipsum hier rein. Und wenn ich das sage, wird es einfach ziemlich langweilig aussehen. Und das ist okay. Wir versuchen nicht, das jetzt schön aussehen zu lassen. Wir versuchen einfach, Javascript zu machen. JavaScript bedeutet nicht unbedingt, dass Dinge schön aussehen. CSS bedeutet, dass die Dinge gut aussehen. JavaScript bedeutet, dass die Dinge funktional sind. Und so machen wir weiter und erstellen hier ein Skript. Und wir wollen den ganzen Text hier einpacken. All diese Laura MIPs. Ähm, also könnten wir wissen, dass unsere Sätze gleich sind und dann könnten wir mit niedrigeren MIPs umgehen, ähm da drin. Oder wir könnten es auf Javascript-Weise tun und sagen, Dokumente erhalten Elementelement durch i d Satz. Nennen wir diesen Satzknoten, und ich bin genug, um das kleiner zu machen. Hoffentlich ist das immer noch in Ordnung. Und dann lassen Sie uns unsere Sätze machen. Adler zu Satz Knoten Punkt inneren Text und lassen Sie uns voran. Nur Konsolenprotokoll dieses Council Dot Log Der Satz wird Satz sein. Und wenn wir aktualisieren und mit der rechten Maustaste klicken, überprüfen Sie jeden Klick, inspizieren und gehen Sie zu unserem Rat. Ah, da ist es. Wir sehen all diesen groben Text hier drin, und dieser könnte eigentlich besser sein, wenn wir die Ansicht in „Lasst uns a nach unten ändern“ ändern. Und so haben wir hier einen Satz und es ist ein Haufen Lauren Ipsum Zeug, damit wir weitermachen können , dieses Konsolenprotokoll loswerden. Wir wissen, dass das funktioniert und dass unser Satz tatsächlich eine Zeichenfolge ist . Woher wissen wir, dass es eine Schnur ist? Nun, wir könnten immer Art von Satz sagen uns, es ist eine Zeichenfolge, die ziemlich cool ist. Wir können auch nur Satzsatz eingeben und weil es ein Zitat um ihn herum hat, wissen Sie, es ist eine Zeichenfolge, also lasst uns das einfach klar machen und setzen wir Satz wieder da rein, und Sie können sehen, dass es irgendwie , die sich dort hervorhebt. Aber es macht noch nichts. So cool. Wir haben jetzt unseren Satztext. Was, wenn Sie das Großbuchstaben machen wollten? Lassen Sie uns var Oberer Satz ist gleich in Anfang zu Großbuchstaben senden. Das ist buchstäblich alles, was wir tun müssen, und wir können das auch in unserem Konsul testen, damit wir das Gestüt nach oben schicken können, und Sie können sehen, dass es Auto Gefühl für mich ist und dann die Klammer öffnen und schließen. Und was das sagt, ist, dass dies eine Funktion ist. Wir werden mehr über Funktionen auf der Straße erfahren. Aber im Grunde genommen nimmt das unseren Satz, den Lauren Ipsum Text, und er wird etwas damit tun, und das ist es, was das bedeutet. Diese öffnenden und schließenden Klammern oder diese Klammern bedeuten, dass es etwas damit tun wird. Gehen wir voran und treffen, betreten und schauen wir uns das an. Es ist jetzt alles Großbuchstaben, alles. Also wissen wir, dass das funktioniert, und wir können das einfach da drin behalten. Wir können auch von unserem unteren Satz tun und gehen wir voran und tun Satz Punkt zu Kleinbuchstaben. Und übrigens erstellen wir hier neue Variablen basierend auf dem, was auch immer diese Zeichenfolge ist diese Variable. Also überschreiben wir nicht immer und immer wieder das Urteil. Wir nehmen den gleichen Satz, das ist dieser Wert hier drin, die Laure MiPs um und wir sagen, hey, mach es Großbuchstaben. Das wird auch nicht funktionieren. Hey, mach es in Großbuchstaben. Und dann auch hey, mach es Kleinbuchstaben und so im Grunde kopieren wir die Daten immer und immer wieder, ohne sie wirklich zu überschreiben. Wenn du also jemals sehen willst, dass das funktioniert, könnten wir weitermachen. Lassen Sie uns das einfach kopieren. Schnappen Sie sich die ganze Sache Copy Paste und lassen Sie uns niedrigeren Satz eingeben. Jetzt können wir sehen, dass es alles Kleinbuchstaben ist. Das erste l sollte Großbuchstaben sein. Ist es nicht. Es ist niedriger. Fall ist genau hier. Sollte Großbuchstaben sein. Ist es nicht. Es ist Kleinbuchstaben. Und so hat das funktioniert. Was, wenn wir nur die ersten 10 Zeichen eines Satzes bekommen wollten ? Aus welchem Grund auch immer, wir wollen nur die 1. 10 und das ist eigentlich seltsam nützlich. Sie würden nicht denken, dass Sie etwas wie nur die 1. 10 oder die 1. 4 verwenden würden, aber ja, wir verwenden es ziemlich viel in JavaScript. Also lassen Sie uns voran und erstellen Sie eine Sub-Zeichenfolge. Also werden wir nennen diese 1. 10 Chars ist gleich, dass steht für Zeichen Satz Punkt Substring, und das wird zwei optionale Parameter hier nehmen, wirklich von den ersten. Nicht wirklich Option. Also lasst uns einfach 10 machen und lasst uns das hier nicht machen. Gehen wir weiter und machen es direkt hier, wo wir experimentieren können, damit wir sehen können, was hierher zurückkehrt, sagt M. Dolar. Setz dich. Weglassen. Also, todo m Dollar es, ähm, es Also, was das tut, ist zu sagen, Hey, Hey, beginne bei Charakter 10 und schnapp dir alles andere. Also haben wir 123456789 10. Also dauerte es diese ersten 10 Zeichen und völlig ignoriert sie, und es begann hier M dolar sitzen Weglassen, wahrscheinlich Schlachten, dass Latein, übrigens. Und das können wir tatsächlich sehen. Das ist es, was es hier zurückgibt. M dolar Setz dich hinein. Cool. Und so verwenden wir Sub-String. Das ist ziemlich cool. Ich wusste nicht wirklich, dass der Rat das tun würde, aber es gibt mir von einer optionalen Länge. Wie viele Zeichen wollen wir, damit wir beim 10. Zeichen beginnen können und sagen wir, wir wollen nur die nächsten 10 Zeichen. Es gibt 10 11 12 13 14 15 16 17. Wir könnten das nächste machen. Das ist eine 30. Da gehen wir. Wir haben also zwischen Charakter 11 und 30, die hier drin auftauchen. Und das ist, was Sub-String tut. Und das ist wirklich nützlich. Weil manchmal, weißt du, vielleicht ein Benutzer eingibt, dass du, Earl, und sie nicht www davor stellen. Und vielleicht erfordert Ihre Website das oder http, um es in einen richtigen Link zu verwandeln. Hier machen wir so etwas. Also lasst uns weitermachen. Das werden die ersten 10 Charaktere sein. Machen wir Null und 10 und lassen Sie uns Null und 10 hier machen, weil dies im Grunde eine Live-Vorschau ist . Null und 10. Wir sehen Laura Ipsen können Sie 11 Lauren Ipsum 1. 10 Und weil diese Variable sagt 1. 10 Zeichen, lassen Sie uns zuerst 11 Zeichen. Okay, diese nächsten beiden werden einen neuen Datentyp einführen. Also wissen wir über Strings und wir wissen über Zahlen. Wir haben nicht wirklich viel Zahlen verwendet, aber wir wissen jetzt von ihnen. Was passiert, wenn wir alle einzelnen Wörter hier reinbringen wollten? Nun, in Javascript haben wir diese Methode namens Split, und im Grunde können wir sagen, dass sie alles teilt. Also teilen Sie hier alles auf und wir können sagen, worauf wir aufteilen sollen. Also sagen wir aufgeteilt auf jeden Satz. Was das tun wird, ist, jeden einzelnen Raum hier zu nehmen, wie das, was wir hier haben. Also wird es einfach übereinstimmen, was da drin ist, und es wird dies in eine Liste verwandeln, um es in ein Array zu verwandeln. Gehen wir also voran und lassen Sie uns ein Live-Beispiel machen. Machen Sie nicht Satz Punkt Split und teilen wir es auf jedem einzelnen Raum. Und lassen Sie uns Worte machen ist gleich und schauen Sie sich das an. Wir haben all die verschiedenen Worte in Ihrem und wenn ich das größer mache, haben wir all die verschiedenen Wörter und wir können das wirklich öffnen und schließen und es wird uns alle Worte zeigen. Also haben wir jetzt eine Liste. Jetzt nannte diese Luft einen Raise und JavaScript diesen Anruf und ein Strahl ließ mich das austippen. Es wird ein Array Eile Array genannt, und so wirklich, alles in Array ist eine riesige Liste von Zahlen oder Strings oder Objekten, über die wir nicht gelernt haben, oder alle Arten von anderen verschiedenen Arten von Daten und Datentypen, die wir haben noch nichts davon gelernt. Und es kann sie alle in einer Liste halten, und es wird diese Reihenfolge beibehalten. So können wir sehen, Florham Ipsum Dolar sagte, ich traf mich so weiter und so weiter und so weiter und so weiter. Also, jetzt können wir hier reingehen und wir können sagen, Vier alle Wörter sind gleich Satz Punkt Split und teilen Sie es auf jedem einzelnen Raum. Und lasst uns weitermachen und konsul dot protokollieren alle Wörter. Ich habe das nicht aktualisiert und dieses Konsolenprotokoll für mich gegeben und das gab mir alle Worte. Nun, wo ist das nützlich? In den USA ist dasnicht sehr nützlich. In den USA ist das Aber auf der Straße könnte das sehr, sehr nützlich sein . Wir können eine Sache verwenden, die eine vier Schleife und Schleife durch jede einzelne genannt wird und in Aktion auf ihnen ausführen . Wir werden noch nicht darauf eingehen, weil das ein wenig komplizierter ist als das, was wir normalerweise am Anfang von JavaScript tun. Ich habe das Gefühl, dass das einige Leute überwältigen könnte. Es hat mich sicherlich überwältigt, als ich damals JavaScript lernte. Und so würde ich es gerne behalten, wissen Sie, schön und einfach. Lernen Sie Schritt für Schritt, aber okay, also haben wir all diese verschiedenen Worte hier drin und sagen wir, sagen wir, aus welchem Grund auch immer, wir wollten die alle wieder zusammen in Frieden bringen. Aber wir wollten ihn nicht wieder zusammen mit einem einfachen Raum. Wir wollen nicht, dass der Satz wie ein normaler Satz aussieht. Vielleicht wollten wir Klammern um jedes einzelne Wort setzen. Nun, könnten wir tun. Wir könnten weit machen. Wir werden die Worte hier klammern, und wir werden uns all das anschließen. Also werden wir alle Worte nehmen, nicht Satz. Wir wollen das hier nehmen, denn das ist die Liste. Alle Wörter verbinden sich nicht und dann dauert es eine Zeichenfolge. Woran wollen wir uns anschließen? Nun, wenn wir das tun und das ist eigentlich nur speichern Sie das und mal sehen, welche Klammerwörter aussehen ein Blick auf diese Klammer Wörter hat all die verschiedenen Klammern um sie herum, bis auf die 1. 1 in der letzten. Nun, rate mal was? Wir können einige String und Katze Nation hier tun, so können wir eine Klammer dort hinzufügen und wir können eine Klammer hier und erfrischend machen . Lassen Sie uns Klammer Worte und ha ha! Sieh dir das an. Alle unsere Worte haben Klammern um ihn herum. Und nur zum Spaß. Was ist, wenn wir Satz Knoten Punkt in ihrem Text getan haben, ist gleich Klammern Wörter. Hey, sieh dir das an. Also, jetzt machen wir tatsächlich etwas mit unserer Seite. Das ist ziemlich cool. Also werde ich das entfernen, weil ich das noch nicht ändern möchte. Und es gibt noch eine, über die ich reden möchte. Und so, wirklich, wenn wir uns das und das ansehen, haben wir uns gespalten und mitmachen. Split wird also einen Satz nehmen und ihn aufteilen, basierend auf dem, was Sie ihn teilen möchten . In diesem Fall benutzten wir nur ein normales Leerzeichen, und dann nahmen wir, was auch immer diese Liste von Wörtern war, und wir sagten, sie alle zusammen mit etwas anderem. Und so sieht das etwas seltsam aus. Wir müssen nicht wirklich öffnende schließende Klammern wie diese verwenden. Wir könnten, wenn wir eine Reihe von Leerzeichen verwenden wollten, und das ist los, aktualisieren und geben Sie Klammerwörter und schauen Sie sich das an, damit wir das auch tun können. Und so verbinden und teilen in der Regel zusammen arbeiten. Und hier drin ist noch eins. Was, wenn wir weitermachen, uns tatsächlich auffrischen. Und lasst uns alle Worte machen. Wir haben diese Liste von Wörtern hier. Was, wenn wir nur die ersten 3 Worte wollten? Also lassen Sie uns voran und geben Sie alle Wörter Punktscheibe und es wird sagen, dass dies eine Funktion ist. Das ist es, was das F bedeutet. Es ist eine Funktion. Wo soll es anfangen und wo soll es enden? Beginnen wir bei Null, denn wenn es um Computer geht, fangen wir an, bei Null zu zählen. Als Menschen fangen wir an zu zählen. 12345 Computer. Geht der Computer nicht? 012345? Denn für einen Computer ist Null eine Zahl für einen Menschen. Null bedeutet nichts. Da ist buchstäblich nichts. Also Nummer Null und gehen wir zu Nummer drei. Und das wird uns die ersten 3 Worte geben. Laura, ähm, Epsom Dolar So? Und dann können wir in unserem Code voran gehen, und wir können weit sagen, ersten drei Wörter sind gleich Satz. Nein, das ist nicht richtig. Ich habe mich schon getäuscht. Alle Worte Punkt Scheibe und nehmen Sie einfach die 1. 3 Nur schnappen Sie sich ein Stück davon. Also wollen wir das nur in Scheiben schneiden. Wir sagen, Hey, wenn das ein Riesenkuchen war, wollen wir drei Stücke. Alternativ könnten wir auch dio Wörter Punktscheibe. Und was passiert, wenn wir hier anfangen? Also sechs gingen eins zu viele. Ich schätze, da habe ich sie nicht gezählt, sagt Ahmed. Alle Wörter Punktscheibe beginnen bei Nummer fünf und gehen bis zum Ende, so dass Sie hier sehen können. Ah, es gibt 20 Artikel in dieser Liste. Jetzt werden wir mehr über Listen auf der Straße sprechen. sind sie super nützlich Eigentlichsind sie super nützlich. Auch nicht super kompliziert, , aber es wird bei Nummer fünf beginnen, also wird es auf 012345 beginnen und das ist derjenige, den wir gesagt haben, dass er anfangen soll. Beginnen Sie auf Consekutive Tour sollte wahrscheinlich Wörter verwendet haben, die ich tatsächlich lesen kann. Äh, ja, da ist es. Es beginnt auf einer aufeinanderfolgenden Tour, und jetzt können wir sagen, Hey, Hey, wir wollen eigentlich nur jedes Wort zwischen dem fünften Wort und dem 10. Wort. Wir wollen sie alle und wir wollen es in einen Satz setzen. Also, jetzt können wir tatsächlich etwas Ordentliches damit machen. Also lasst uns weitermachen. Lasst uns weit mittlere Wörter greifen ist gleich allen Wörtern Punktscheibe und wir wollen Nummer fünf bis Nummer 10 greifen und dann können wir von unserem Ich nenne es nicht macht Satz mittlere Wörter Punkt verbinden und lassen Sie uns sie mit einem nur ein regelmäßiges Leerzeichen verbinden. Und dann gehen wir weiter und machen Satz. Knotenpunkt innerer Text ist gleich Satz zu machen, und das ist nur geben Sie diesem eine Aktualisierung und beobachten, wie es dauern wird, wahrscheinlich von hier nach hier ish ich vermute, weil ich die Wörter nicht zähle und es wird diesen Text ersetzen mit diesen mittleren . Tutta einfach so. Es ersetzte sie für uns und wieder ein letztes Mal. Wenn wir in der Ansicht unserer Seite Quelle Schauen Sie sich das an. Wir haben alles hier drin. Aber hey, Javascript sagte nein. Schnappen Sie sich den Satzknoten, greifen Sie diesen Intertext, so dass wir mit uns als Variable arbeiten können. Und so haben wir hier eine Kopie des Satzes. Eine Kopie des Satzes hier, eine Kopie des Satzes hier, hier und dann mit diesen, können wir verschiedene Dinge tun, wenn wir wollten, und wie am Ende, wo wir im Grunde genommen diesen Satz genommen haben, haben wir diese Satz. Wir haben all diese Worte genommen und wir haben es auseinandergebrochen, basierend auf Abständen. Und dann verwandelten wir all diese Worte in Klammern. Es gab also keine Leerzeichen mehr, nur Klammern überall. Und das ist, wo verlassen, weil wir nichts damit gemacht haben. Dann sagten wir: „ Schnapp dir die ersten 3 Wörter und wir sagten: Okay, nun, nun, es gibt hier eine Liste von Wörtern, die durch den Raum auseinander gebrochen sind. Das ist es, was Spaltung hier ist. Und wir sagten, schnappen Sie sich einfach die 1. 3 Also packten wir Laura Ipsum Dolar, und das waren die ersten 3 Worte. Und dann sagten wir: Wir werden nichts damit machen. Nehmen wir die mittleren Worte. Nehmen wir alle Worte nochmal. Das sind all diese Split auf dem Raum, Schnapp Nummer fünf. Also 012345 und dann greifen bis zum 10. Wort. Also 12 drei oder 89 und dann fertig. Und dann sagten wir: Hey, Hey, du weißt, was die 10 Worte ergriffen hat und sie wieder in einen Satz gesetzt, damit wir keine Liste von Dingen wollen . Wir wollen nur einen regulären Satz und dann sagten wir, ich ändere diesen Text, ändere ihn, um was auch immer diese fünf Worte sind. Und da ist es. Wir haben diese fünf Worte genau so. Dies ist also eine grundlegende Einführung in die String-Manipulation. Nun, zu diesem Zeitpunkt denkst du wahrscheinlich, Hey, das ist überhaupt nicht nützlich. Aber in den kommenden Lektionen werden wir einiges davon nutzen. Es ist also wirklich, wirklich gut zu wissen, dass diese existieren, auch wenn man sie nicht jeden Tag benutzt, ist gut zu wissen, dass sie existieren. Jetzt habe ich als Entwickler einen Full-Stack-Entwickler, der das Front-End enthält. Ich benutze diese fast jeden Tag. Aber, hey, wenn das nach viel Druck klingt, lernt ihr immer noch. JavaScript. Denken Sie daran, dass Sie immer noch lernen. Sie sind ein Student von JavaScript. Du musst nicht der Beste sein. Du brauchst das alles nicht von oben zu wissen. Dein Kopf kann es immer googeln Pro Tipp. Alle seine leitenden Entwickler, Wir Mädchen Dinge nonstop den ganzen Tag. Also fühle dich nicht schlecht, wenn du es jemals googeln musst und dann schließlich nicht das Gefühl hast, dich an alles zu erinnern, denn, ehrlich gesagt, du tust es ehrlich gesagt, nicht. Sie müssen nur wissen, dass diese Arten von Funktionen existieren. Es ist also, als ob Sie all Ihre Worte nehmen und ihn Großbuchstaben machen wollten, müssen Sie sich nicht wirklich daran erinnern, dass es von Punkt zu Großbuchstaben ist. Sie müssen sich nur daran erinnern, wie Sie darauf zugreifen können. Und so zum Beispiel könnten wir zum BeispielSatzpunkt machen und ich tippe einfach Leute für Großbuchstaben und sieh dir das an. Es gibt mir Großbuchstaben, und alles, was ich tun muss, ist Klammern um ihn herum hinzuzufügen, und es tut es für mich. Und so ist es die ganze Zeit wie eine kleine Erinnerung. Es ist immer da, und man muss nicht den Druck spüren, alles sofort zu wissen. Nun, ich würde es wirklich schätzen, wenn du das hier eine Chance geben könntest. Gehen Sie einfach durch jede von ihnen, schreiben Sie es von Hand aus. Ich weiß, dass es saugen kann, Dinge von Hand zu schreiben, aber wenn Sie es von Hand schreiben, werden Sie Muskelgedächtnis schaffen. Und eines Tages, wenn dein Gehirn verwirrt wird und du dich nicht mehr daran erinnern kannst, weißt du, was deine Finger gerade anfangen würden zu tippen und sie wissen, was sie tun. Du denkst an etwas anderes und deine Finger lüften nur die Arbeit, und es funktioniert tatsächlich so. Also geh weiter, gib das einen Schuss, und dann werden wir die nächste Lektion weitermachen, wann immer du bereit bist, und lasst uns lernen , etwas Benutzereingaben zu akzeptieren und davon Gebrauch zu machen. 12. Benutzereintrag: Hallo, Willkommen zurück. Hoffentlich habe ich dich nicht auf dem Video zur Streichmanipulation verloren. Ich weiß, es war ein bisschen lang. Es gibt eine Menge zu lernen, aber es ist auch sehr, sehr wichtig, in diesem Video zu wissen, werden wir lernen, wie man Benutzereingaben in Form einer Eingabeaufforderung akzeptiert . Und wenn wir eine Seite öffnen, kann sie nach Ihrem Namen oder einem Alter oder so etwas fragen, und dann können Sie tatsächlich damit arbeiten. Und dann können Sie es in Groß- oder Kleinbuchstaben oder so etwas verwandeln. Also habe ich hier nur eine HTML-Datei, und ich werde ein neues Skript erstellen. Und lassen Sie uns diese Art in der Mitte des Bildschirms hier verschieben und lassen Sie uns ein neues Skript erstellen und wir werden eine brandneue Funktion verwenden. Es sieht sehr nach Alarmbereitschaft aus, aber es ist nicht wachsam. Es heißt Prompt, und das wird nur jemanden zur Eingabe auffordern, damit wir prompt sagen können und wie ist Ihr Name? Und wenn ich auffrischen, sagt dies: Wie ist Ihr Name? Ich tippe Caleb ein. Nichts passiert. Das liegt daran, dass alles, was es getan hat, nach meinem Namen gefragt wurde. Ich habe es nicht in einer Variablen gespeichert. Ich habe den HTML-Code nicht gezwungen, sich zu ändern. Das Dokumentobjektmodell wurde nicht aktualisiert. Wir haben nichts getan. Wir haben gerade gesagt: Wie ist dein Name? Und das war's. Also, während das eine coole Funktion ist, ist es derzeit nicht nützlich. Also lassen Sie uns voran und machen es nützlich. Also lassen Sie uns speichern, unser Name ist gleich zu prompt, was ist Ihr Name? Und dann lassen Sie uns voran gehen und Konsolenprotokoll, dass Konsul Dot Log Ihr Name ist und Name aktualisieren. Setzen Sie Caleb noch einmal. Ha. Dein Name ist Caleb genau so. Und so fragst du jemanden nach wirklich jeder Art von Daten. Nun, die große Sache, die Sie hier beachten müssen, ist, dass, wenn Sie die Eingabeaufforderung verwenden, die Eingabe immer als Zeichenfolge zurückkommt. Wenn Sie also versuchen, Zahlen zusammen hinzuzufügen Wenn Sie also versprechen müssen, Sie Nummer eins ein und geben Sie dann Nummer zwei ein und geben Sie dann vielleicht Nummer drei ein, erhalten Sie möglicherweise nicht die Ergebnisse, die Sie suchen. Und als Beispiel, lassen Sie uns gehen und geben Sie name ein und wir können sehen, dass es Zitate um ihn herum hat, also wissen wir, dass es eine Zeichenfolge ist, aber wir können immer auch Typ des Namens eingeben, und das sagt mir, dass es eine Zeichenfolge ist. Also lassen Sie uns das loswerden und lassen Sie uns diese Änderung injizieren. Diese unterstreichen hier von benutzerdefinierten Eingaben bis hin zu welchem Wert auch immer der Wert war, den jemand dort hineinlegte . Also, wenn ich sage, wie ist dein Name? Und ich tippe Caleb, diese Unterstriche. Das sollte sich in Caleb ändern. Also zuerst. Wir müssen diesen Zettel schnappen. Lassen Sie uns voran, erstellen Sie eine neue Variable. Es heißt „H drei Note“. Ich denke, Dokumente haben Elham mit i d gemeint und wir werden wieder benutzerdefinierte Eingaben verwenden. Das passt einfach hier oben. Und dann könnten wir sagen, dass drei es nicht wissen. Niederländischer innerer Text ist gleich, was auch immer der Name ist. Lassen Sie uns fortfahren und erfrischen und sagen: Wie ist Ihr Name? Nun, mein Name wird Caleb sein. Ah, sieh dir das an. Dein Name war oder ist Caleb. Es ist ändern, was es ist, weil ich nicht verspannt bin. Ich bin angespannt. Jetzt. Was wäre, wenn wir eine Art String-Manipulation dazu machen wollten? Was wäre, wenn ich sicherstellen wollte, dass l die Eingabe alles immer Kleinbuchstaben ist. Nun, wir könnten zwei Dinge tun, wenn wir wissen, dass das immer, immer, immer, immer, immer, Kleinbuchstaben sein wird. Wir könnten es sofort ändern, weil ein Name gleich dem Namen Punkt in Kleinbuchstaben ist. Und wann immer wir Namen auf der Straße beziehen, wie hier, wird es immer Kleinbuchstaben sein. Also lassen Sie uns diesem ein Beispiel geben. Caleb in allen Kappen und ich traf OK und es erscheint in Kleinbuchstaben. Das erwarten wir jetzt. Wenn Sie nicht möchten, dass dies immer Kleinbuchstaben ist und Sie möchten, was auch immer die Benutzereingaben beibehalten und Sie nur Kleinbuchstaben haben wollten, nur wenn Sie hier Punkt zu Kleinbuchstaben machen könnten, und dann könnten wir alle wie ein Konsolenprotokoll schmoren, und wir können den ursprünglichen Namen protokollieren. Und das, was wir tun, ist zu sagen, Hey, was ist Ihr Name speichern Sie so unveränderlich. Dann schnappen wir uns die Note des dritten Alters. Das ist diese benutzerdefinierte Eingabe und wir sagen, Hey, lasst uns diesen Intertext packen und ihn ändern. Lassen Sie uns es ändern, was auch immer die Benutzer eingegeben haben. Aber lassen Sie uns tatsächlich sicherstellen, dass es immer Kleinbuchstaben ist und dann hat Let's Consul den Namen protokolliert . Nun, zu diesem Zeitpunkt, denken Sie, der Name wird alles Kleinbuchstaben sein, wenn wir ein Konsolenprotokoll machen? Wird der Name ganz Kleinbuchstaben sein? Weil wir gesagt haben, dass es hier ein Kleinbuchstabe ist, oder denkst du, es wird nicht Kleinbuchstaben sein weil wir es nur dieses Mal geändert haben? Nun, das ist eigentlich eine gute Frage, weil verschiedene Programmiersprachen in dieser Hinsicht unterschiedlich funktionieren. Also lasst uns damit experimentieren. Gehen wir weiter und setzen Caleb in alle Kappen und wir können alle Kleinbuchstaben sehen. Aber wenn wir Log trösten, ist es alles in Großbuchstaben. Das hat es also überhaupt nicht verändert. Also, was wir hier getan haben, um Kleinbuchstaben Es hat nicht wirklich den Namenswert geändert. Es hat es nur dieses eine Mal geändert. Es änderte nur den Wert dieser eine Zeit, aber es änderte nicht wirklich den gesamten Namen für immer. Und das ist, wo wir in viel mehr variable Manipulation, String-Manipulation, Dinge wie diese geraten. Denn jetzt können wir die Benutzereingabe beibehalten. Das ist der Name. Und wir können sagen, tatsächlich, wissen Sie, nur in diesem einen Fall, machen Sie es Kleinbuchstaben, aber in jedem anderen Fall, halten Sie es gleich, weil wir vielleicht etwas damit machen wollen. Dies ist also eine sehr einfache Möglichkeit, Benutzereingaben zu akzeptieren. Und in der Wildnis, in einer Live-Website sehen Sie dies nicht verwendet, Sie sehen Textfelder verwendet werden, Sie sehen Textbereiche Dropdown, Dinge wie das, und wir werden zu all dem kommen. Aber wir müssen lernen, wie man Benutzereingaben zu Beginn verwaltet, und das ist ein wirklich guter Schritt dafür. Also haben wir gelernt, wie man die Eingaben von jemandem akzeptiert, sie in einer Variablen speichert, einen Knoten greift und dann den Wert dieser Notiz so ändert, wie die Eingabeaufforderung war, unabhängig von der Benutzereingabe. Und diese Art von bereitet uns auf eine Sache vor, die Ereignis-Listener genannt wird, sind Ereignis-Listener, wie wir grundsätzlich sagen können, Hey, jedes Mal, wenn jemand in einen Textbereich tippt oder ein Auswahlfeld ändert, schwächen, tun etwas, das darauf basiert. Und es ist an diesem Punkt, dass unser Code tatsächlich ziemlich dynamisch wird, weil wir bisher keine benutzerdefinierten Eingaben akzeptieren konnten. Wir hatten Warnungen, die uns Dinge erzählen, aber wir waren noch nie in der Lage, irgendeine Art von Text oder variablen Informationen auf die Seite zu injizieren . Und jetzt können wir es. Und so denke ich, für die nächsten paar Videos gingen Toe, lernen, wie man irgendwie mit diesem ein wenig arbeitet, und das wird uns wirklich auf das zukünftige JavaScript vorbereiten. Wenn wir uns mit den Ereignis-Listener und mehr Benutzereingaben beschäftigen und wie das alles zu verwalten ist. Und nur als Auffrischung, lasst uns voran gehen und sagen wir Namen und lassen Sie uns den Namen der Warnung machen. Wie ist Ihr Name? Mein Name ist Kate Lubbe, und sie werden anklicken. Okay, es wird nur alarmieren. Mein Name ist Caleb. Mein Name ist Galeb, genau so. Und das ist alles, was es gibt, um zu informieren und zu warnen. Und jetzt bist du ein prompter und wachsamer Profi, um ganz ehrlich zu sein. Okay, also habe ich das einfach rückgängig gemacht. Was passiert, wenn Sie einen Standard haben wollen? Texan hier, sagen wir, du bastelst herum und du weißt, dass du experimentierst. Sie lernen, wie Sie mit Javascript spielen sollten, aber jedes Mal, wenn Sie die Seite aktualisieren, müssen Sie den Namen eingeben. Nun, irgendwann wirst du anfangen zu tippen und solche Sachen, die nicht super nützlich sind. Geben wir ihm einen Standard. Lassen Sie uns voran und der zweite Parameter der Eingabeaufforderung wird sein. Ich setze nur meinen Namen ein. Wie ist Ihr Name? Caleb? Und wenn ich mich erneuere, wird es automatisch für mich ausgefüllt. Und eine andere Sache zu beachten, ist, wenn wir aktualisieren, Lassen Sie uns das loswerden und klicken Sie auf OK, und lassen Sie uns hier gehen und sagen Was ist Name? Name ist eine leere Zeichenfolge. Da ist jetzt nichts drin. Was passiert, wenn Sie Abbrechen drücken, anstatt es leer zu lassen, während es sagt, Mein Name ist null, Also lasst uns voran gehen und sehen, welcher Name ist. Name ist eine Zeichenfolge namens Nein oder so scheint es. Lassen Sie uns überprüfen, ob Sie den Namen eingeben, und es ist eine Zeichenfolge, und so ist im Grunde nichts hier drin. Im nächsten Video werden wir über diese Dinge lernen, genannt Vergleichsoperatoren, um sicherzustellen, dass unsere Eingabe tatsächlich das ist, was wir erwarten und wenn nicht, tun Sie etwas anderes, und dies ist, wie wir Computern Befehle basierend auf Benutzereingaben geben. Lassen Sie uns also über das nächste Video springen, in dem wir über Vergleichsoperatoren erfahren, und hier wird alles, was wir bisher gelernt haben, in Riel-Programmierung 13. Einführung in Vergleichsoperationen: Okay, wir einen Blick auf Vergleichsoperatoren. Operatoren sind die kleinen Stücke der Logik in einem Programm, die uns sagen, etwas zu tun oder uns sagen, etwas nicht zu tun. Grundsätzlich ist es, wie wir basierend auf einem variablen Wert Maßnahmen ergriffen haben. Hier werden Variablen wirklich sehr wichtig, nicht nur um Alarmierung von Dingen oder Konsolenprotokollierung, darum, einem Programm eine bestimmte Aufgabe zu geben. Oder vielleicht nicht zu dio. Und so sieht ein Vergleichsoperator im Grunde so aus. Lass uns weitermachen und hier etwas Platz machen. Es steht im Grunde, wenn Ihr Name Caleb ist, tun Sie etwas anderes oder tun Sie etwas anderes, das im Grunde alles ist, was es ist. Und in der Welt von Python sieht es tatsächlich so aus. Sehr, sehr, sehr ähnlich. JavaScript hat eine andere Art von Syntax, so wie wir es aussehen lassen, lassen Sie uns voran und erstellen Sie hier ein Skript-Tag. Und schauen wir uns unsere erste if-Anweisung an. Also werden wir das hart codieren und dann werden wir es in eine Eingabeaufforderung verwandeln, wo wir tatsächlich Benutzereingaben akzeptieren können . Also lassen Sie uns weit Name ist gleich Caleb. Wir werden es hier kleiner machen müssen. Und dann könnten wir sagen, wenn Klammern? Weil es Taten macht, richtig? Wenn es eine Aktion ausführen wird, brauchen Sie einige Klammern dort drin, wenn Name gleich Caleb Opening Curly Klammer schließt lockige Klammer einfach so. Und das ist eine if-Anweisung. Also sagen Sie, Hey, Hey, wenn eine Variable gleich dem ist, was Sie erwarten, dass sie alarmiert ist, tun Sie etwas und lassen Sie uns fortfahren und aktualisieren und es steht: Tun Sie jetzt etwas, warum haben Sie das getan? Weil man wirklich sehen kann, dass der Name Caleb gleich ist. Und wenn der Name gleich Caleb ist, gibt es einen Vorbehalt hier ist, dass wir Gleichheitszeichen verwenden. Ein Gleichheitszeichen bedeutet, dass dies die Variable ist. Variable ist gleich, was auch immer dieser Wert ist. Das ist ein Gleichheitszeichen für Gleichheitszeichen. Bedeutet, hey, ist der Name Caleb sind , den wir überprüfen, um sicherzustellen, dass es tatsächlich der richtige Name ist. Dieser wird also als Zuweisungsoperator bezeichnet, und dieser ist ein Vergleichsoperator. Jetzt gibt es mehrere andere Vergleichsoperatoren da draußen, aber wir werden wirklich nur über diese 1. 1 Für jetzt lernen, um es schön und einfach zu halten. Also lassen Sie uns das jetzt ändern, um zu fragen, wie ist Ihr Name? Und jetzt kann ich aktualisieren wird sagen Was ist Ihr Name? Und wenn ich einen anderen Namen eintippe, werde ich für einen Moment meine Katze sein. Sein Name ist Zephyr. Ich tippe Zephyr ein. Nichts passiert. Und das liegt daran, wenn wir hier reingehen und den Namen eingeben, können wir ihn sehen. Zephyr. Und wir sagen, Hey, Hey, wenn der Name gleich Caleb ist, tun Sie etwas, Es ist nicht Derzeit sagt es seine Anstrengung, Aber wenn wir aktualisieren und ich in Caleb mit einem Großfall eingeben, so dass es diesem Wert richtig entspricht da, sagt er, mach etwas Cooles. Also, jetzt haben wir tatsächlich etwas zu arbeiten. Hier können wir sagen, Hey, fragen Sie den Benutzer nach Informationen, und wenn diese Informationen mit dem übereinstimmen, was wir erwarten, schwächen, tun Sie etwas anderes. Also jetzt lassen Sie uns das ein wenig Spaß machen oder lassen Sie uns ein H hier machen, das ich d gleich ist, um einfach Willkommen anzurufen . Und lassen Sie uns dies in acht Knoten unseres Willkommensknotens verwandeln ist gleich Dokumenten dot Get Element durch Idee, es füllt sich automatisch für mich Das ist netter Name. Machen Sie es kleiner. So passt es auf eine Linie. Und jetzt haben wir das hier drin, und wir können sagen, Hey, wenn der Name Caleb ist, Welcome Note Punkt Innerer Text ist gleich willkommen auf deiner Website, Caleb. Und bevor wir das eine Chance geben Ah, Ich habe gerade bemerkt, dass wir Dokument haben, ich bekomme l Element von i d. Es ist nicht der Name. Willkommen. In meinem Anfall der Aufregung war ich ein wenig zu vor mir selbst und, weißt du, lustige Tatsache, die uns allen passiert. Also, jetzt werde ich schlagen, aktualisieren und sagen: Wie ist dein Name? Ich werde sagen, mein Name ist Caleb. Und jetzt steht es: Willkommen auf Ihrer Website, Caleb. Und wenn ich einen anderen Namen sage, wenn ich sage, mein Name ist nein, nicht Zephyr. Lass uns Batman sein. Mein Name ist Babin tut nichts. Batman sollte nicht hier sein. Und Snow, wir haben eine Logik und etwas passiert, basierend auf der Tatsache, dass mein Name Caleb ist. , Was wäre,wenn wir das etwas akzeptierender machen müssten? Denn gerade jetzt brauchst du ein Kapital K. Wenn ich Caleb mit einem Kapital R, A Kleinbuchstaben K eintippe , passiert nichts. Okay, nun, jetzt müssen wir das wirklich ändern. Wir müssen sagen, ob der Name Caleb gleich ist ,mit einem Kleinbuchstaben K , ... Und das und das und das und das. Das sind alle verschiedenen Variationen und mischen und passen sie, Natürlich. Was wir also tun können, ist, dass wir sagen können, wenn sie in Kleinbuchstaben benannt werden. Also nehmen wir, was auch immer der Name in Kleinbuchstaben umgewandelt wird, und vergleichen dann den Kleinbuchstaben . Gehen wir weiter und machen das. Hier können Sie alle Großbuchstaben Caleb. Und dann sagen wir okay und sagt: Willkommen auf Ihrer Website, Caleb. Und das ist, weil wir gesagt haben, Hey, wenn der Name alle Großbuchstaben, Caleb, und dann zwingen wir es niedriger zu sein. Fall ist gleich Kleinbuchstaben Caleb. Und jetzt wird es auf jeden einzelnen passen. Wir könnten sagen, K a l o b. Verdammt. Es funktioniert immer noch. Und hier wird die String-Manipulation sehr, sehr nützlich. Also jetzt an dieser Stelle, müssen wir einen Blick auf die eigentliche if-Anweisung selbst werfen. Was diesen Auslöser macht, während es nicht nur die Tatsache ist, dass es Caleb passt. Ja. Es sucht nach einer Übereinstimmung mit der Logik dahinter steht: Ist diese Aussage wahr? Ist der Name Punkt auf Kleinbuchstaben gleich? Caleb? Nun, wenn jemand Caleb so eingeben würde, würde das übereinstimmen? Nein, diese Luft ist anders als ein Computer. Wir aber sprachen zu Kleinschreibung, das ist dasselbe wie zu sagen: Ist Kaleb gleich Kaleb? Und wenn ja, wäre das wahr, Ihr Computer sagt dann Yep. Das ist wahr. Logischerweise. Piep, Piep, Piep, Piep. Ja, das ist wahr. Machen Sie es etwas zu tun. Und so sollten Ihre if-Aussagen immer wahr zurückgeben. Und was passiert dann, wenn wir nicht zurückkehren? Stimmt, wie gehen wir mit etwas um, das das Gegenteil von wahr ist? Wie gehen wir mit etwas um, das falsch ist, oder wie gehen wir mit mehreren Szenarien um? Nun, das sind Dinge, auf die wir jetzt nur ein wenig eingehen werden, ich denke, wir sollten einfach einen einfachen Vergleichsoperator üben, nur um irgendwie den Dreck davon zu bekommen , denn hier können wir viel haben Spaß damit. Wir können an dieser Stelle alles mit unserer Website machen. basierend auf nur if-Anweisungen. Und dann, schließlich, lassen Sie uns noch einen kurzen Blick auf die Syntax hier werfen. Also haben wir, wenn Klammern und dann innerhalb dieser Klammern, also könnte ich das wirklich löschen, wenn was auch immer hier wahr ist, also wenn der Wert eins gleich dem Wert ist, dann haben Sie einige geschweifte Klammern. Sie haben eine lockige Klammer öffnen und im Schließen der geschweiften Klammer, machen Sie einige Sachen hier drin. Und wenn es nicht wahr ist, wenn sich Ihre if-Anweisungen nicht als wahr erweisen, wird dies überhaupt nicht ausgeführt. Es überspringt einfach dein Programm, sagt, dass es nichts gibt. Ich werde nichts damit machen. Und das ist im Wesentlichen der Kern jeder einzelnen Programmiersprache auf dem Planeten. Wenn Sie in künstliche Intelligenz gelangen möchten, wenn Sie in maschinelles Lernen einsteigen möchten, raten Sie, was das meiste davon eine Tonne ist. Wenn Anweisungen, ist es, wenn ein Datenpunkt mit einem bestimmten Wert übereinstimmt. Wenn ein Satz von Daten genau dem Ergebnis entspricht, das Sie erwarten. Wenn nicht, tun Sie etwas anderes, das wirklich alles ist. Selbst wenn Sie sich ansehen, wissen Sie, mehr Fantasy-Filme wie ich Roboter, Sie kennen die Maschine, Der Sunny war sein Name. Sonny wird sich umschauen und das ganze Bild analysieren. Und Sie werden sagen, wenn es eine Person gibt, sagen Sie hallo. Wenn es keine Person gibt, gehen Sie weiter. Das ist also eine if else Aussage. Und am Ende des Tages in der Programmierung läuft alles auf etwas, das Boolean genannt wird. Es ist entweder wahr oder falsch. Das ist es nicht wirklich eine ganze Menge Mittelweg gibt. Und das ist alles, was wir hier tun, ist, dass wir sagen: Hey, ist das wahr? Eine von dieser Aussage? Wenn diese if-Anweisung wahr ist, tun Sie etwas. Und wenn nicht, tun Sie vielleicht etwas anderes. Aber darüber erfahren wir in einer zukünftigen Lektion. Also, was ich möchte, dass Sie dies tun, ist, geben Sie einen Schuss, fragen Sie nach Ihrem Namen mit einer Eingabeaufforderung, und überprüfen Sie dann, ob dieser Name mit einem Wert übereinstimmt, den Sie suchen. Und wenn es diesem Wert entspricht, dann tun Sie etwas anderes. Schreiben Sie einfach eine if-Anweisung und gewöhnen Sie sich daran. Und vergiss nicht, du kannst experimentieren. Du wirst nichts kaputt machen. Du könntest es immer tun, wie hey, wenn mein Name Nathan ist. Wenn mein Name Zephyr ist , könnte er auch tun. Ich bezweifelte, dass Daten, anstatt Kleinbuchstaben, die Sie mit einem Vogelfall tun könnten. Du könntest so etwas tun. Du machst alle möglichen Dinge, also vergiss nicht, das zu basteln. Viel Spaß beim Experimentieren. Du darfst experimentieren. Und noch einmal, es gibt keine Möglichkeit, etwas auf Ihrem Computer zu brechen, nur wenn Sie dies schreiben, so dass Sie völlig sicher für Experimente nach Herzenslust sind. 14. Gegengesetzte Operatoren umgehen: Hallo und willkommen zurück. In der letzten Lektion haben wir über Vergleichsoperatoren gelernt. In dieser Lektion werden wir lernen, mit dem Gegenteil von etwas umzugehen, das wahr ist. Also, zum Beispiel, wenn wir ein Skript haben, das nach meinem Namen fragt und es sagt: Hey, Hey, wenn mein Name Caleb ist, heißen Sie mich willkommen. Was ist, wenn mein Name nicht Caleb ist? Was ist, wenn Sie nach einem Kurs fragen und es ist kein JavaScript für Anfänger? Gehen wir weiter und machen das. Nun sagen wir, var, die Eingabe aufgerufen wurde, ist gleich Eingabeaufforderung. Welchen Kurs nehmen Sie? Und dann könnten wir mit einer if-Anweisung sagen, ob der Eingabepunkt in Kleinbuchstaben gleich JavaScript für Anfänger ist und das nur sicherstellen, dass es egal ist, ob es Ah, Großbuchstabe oder kein Großbuchstabe gibt und dann lassen Sie uns diese kleineren geschweiften Klammern machen. Und dann könnten wir sagen, du weißt schon, was hier drin tun. Und so sind wir damit bereits vertraut. In der Tat könnten wir dies tatsächlich bereinigen, bis wir sagen könnten, Eingabe niedriger. Nennen wir es einfach, dass unserer Eingabe gleich sinkt, und wir werden einfach eine neue Variable erstellen, die aufgerufen wird, niedriger gesetzt, und das passt einfach zu dieser hier. Aber was ist, wenn der Kurs kein JavaScript für Anfänger ist? Was ist, wenn Sie einen anderen Kurs von mir namens Javascript-Essentials nehmen? Nun, du musst damit umgehen können. In der Tat, was ist, wenn jemand etwas eingibt, das nicht das ist, während Sie eine else-Anweisung benötigen ? Also, wenn etwas anderes etwas anderes tun und wirklich läuft es auf so etwas hinaus. Sie können das irgendwie wie einen Satz lesen, um uns hier Platz zu schaffen. Und man könnte sagen, wissen Sie, wenn der Kurs Javascript für Anfänger ist, etwas anderes tun oder sonst etwas anderes tun. Und in der Tat ist das interessant, denn wenn wir das sagen, ist das Python. Mrs. Python hat Syntax gesendet. Und so, indem Sie Javascript-Syntax hier bereits etwas vertraut mit Python-Syntax. Also nein, Ihre Fähigkeiten und Python oder Ihre Fähigkeiten und Javascript zahlen sich eher aus, weil Sie lernen, Logik in anderen Sprachen anzuwenden. Es sieht einfach ein bisschen anders aus, aber ja, so funktioniert es. Und so können Sie das tatsächlich als Satz lesen, wenn Kurse Javascript für Anfänger etwas tun . Aber wenn nicht, tun Sie etwas anderes. Das ist alles, was es ist. Und so besteht die Welt der Programmierung wirklich nur aus, wenn sonst Aussagen. Es ist eine Reihe von if-Anweisungen l Aussagen und ah, Hybrid von beiden aufgerufen und wenn anderswo, sonst f abhängig von Ihrer Sprache. Also, wenn dies JavaScript für Anfänger ist, lassen Sie uns hinzufügen. Ah, Willkommensnachricht. Und wenn nicht, sagen wir, du bist im falschen Kurs. Nun, wir brauchen hier etwas zu tun, also ist das ein H. Lassen Sie uns diesem einen Namen von Text und i d von Text geben und wir müssen einen Knoten hier greifen. Also lasst uns diesen Knoten greifen. Vier Text ist gleich Dokumenten dot get Element durch i d Text. Und dann, sagen wir, Text Punkt innere HTML ist gleich Es ist zu stark. Willkommen. Es ist so stark zu JavaScript für Lassen Sie uns einen weiteren starken Anfänger machen. Und jetzt schreiben wir etwas HTML in ihrem JavaScript. Und was, wenn es nicht ist? Richtig? Nun, wir könnten das tun und das einfach kopieren, denn ich will nicht noch einmal alles schreiben. Wir könnten einfach sagen, dass du im falschen Kurs bist und dir das ansehen kannst. Welchen Kurs nehmen Sie? Okay, nun, sagen wir, ich nehme einen anderen Kurs, den ich Javascript Essentials genannt habe. Ja, weil ich im falschen Kurs bin, weil wir nicht in Javascript-Essentials sind. In der Tat ist die, in der ich bin, JavaScript für und das ist wirklich vermasselt Einmal alles in Großbuchstaben oder das letzte Wort wird Großbuchstaben sein. JavaScript für Anfänger. Willkommen bei JavaScript für Anfänger. Und wenn wir unsere Quelle hier betrachten, wir nicht wirklich aus, als wäre sie mutig, aber es ist. Wir haben da ein starkes Element. Wir haben hier ein starkes Element und einen regulären Text. Also gehen wir hin. Und das ist, wie Sie in, wenn sonst Aussage tun . Also im Grunde sagen Sie, Hey, Hey, wenn das wahr ist, wenn wir tatsächlich in JavaScript für Anfänger sind, führen Sie dies aus, sonst spielt keine Rolle, was die Antwort ist. Wir sagen, jede andere Antwort auf der Welt, führen Sie diese Zeile aus. Also geh weiter. Gib dem einen Schuss. Sie werden wissen müssen, wie Sie dies für unser Mini-Projekt tun, das bevorsteht. Sie werden definitiv wissen müssen, wie man es macht, wenn sonst Aussage und zu diesem Zeitpunkt , wenn Sie damit stecken bleiben, vergessen Sie nicht, können Sie immer eine Frage unten lassen. Ich bin immer hier, um zu helfen 15. JavaScript #2: Willkommen zu Ihrem zweiten Mini-Projekt. Dieser hat mit Vergleichsoperatoren zu tun. Ich hoffe, Sie hatten die beiden vorherigen Videos in diesem vielen Projekt gesehen. Was ich möchte, dass Sie tun, ist fragen Sie den Benutzer nach einem Sie Earl, und überprüfen Sie dann, ob dieser Link mit http beginnt. Und wenn es nicht mit http beginnt, möchte ich, dass Sie diesen Link reparieren. Also korrigieren Sie die Variable und injiziert das dann als Link in die Seite. Und so, für Teil Nummer eins, werden Sie die Eingabeaufforderung für Teilenummer zwei verwenden wollen, Sie werden Substring verwenden wollen. Teil Nummer drei ist, dass Sie wollen, und wenn vielleicht, wenn sonst Anweisung oder Anweisungen und dann Teilenummer vier, werden Sie einen HTML-Elementknoten greifen und den inneren HTML-Zehe ändern wollen, mehr HTML darin haben. Ich werde dieses Projekt direkt vor Ihnen als auch im selben Video machen, aber ich denke, wäre das Beste, wenn Sie das Video jetzt pausieren und es einfach selbst fotografieren könnten . Gehen Sie so weit wie möglich und dann wissen Sie was? Wenn Sie stecken bleiben, einfach das Video fortsetzen und Sie können genau sehen, wie ich es am Ende mache. Gehen Sie also voran, klicken Sie auf Pause. Gib ihm eine Chance und ich sehe dich in nur ein paar Minuten, wenn du auf Resume klickst. Okay, der erste Schritt war, dass wir den Benutzer um Eingabe bitten mussten. Also lassen Sie uns hier ein Skript erstellen, in dem wir unser JavaScript setzen und das ist ein Feuer. Du, wo ich gleich der Eingabeaufforderung ist. Geben Sie ein u R l, was auch immer das sein wird. Und so machen wir das Stück für Stück. Hier werde ich mich erfrischen. Geben Sie ein, Sie sind raus und ich könnte Codierung für jeden tun dot com tut nichts wie erwartet. Also haben wir nur ein Mädchen in einer Variablen, aber wir haben nichts damit gemacht. Gehen wir weiter und gehen zu Schritt Nummer zwei. Mal sehen, ob es mit http beginnt oder wenn es nicht mit http beginnt, so können wir sagen, ob Sie eigene Punkt-Sub-Strings bis String 04 sind , also beginnt bei Zeichen Null, was in der Computersprache ist. Gehen Sie bis zum vierten Zeichen ist gleich http dann ist es gut und wir können Konsolenprotokoll, dass wir sagen können, Rat nicht loggen den Euro ist gut, Sonst müssen wir es beheben. Also Konsul Dot Warren und so schlecht Sie, Earl Bad, Bad. Du bist krank. Lasst uns weitermachen. Geben Sie das eine Chance, damit ich wieder voran gehe. Jede Art Codierung für jeden Dot com und es ist nicht warm geraten, wenn Sie auf dem Bildschirm schreien . Ja, Ja, das ist ein guter Anruf. Es ist abgenutzter Spaß. Fakt, uh, Codierung für jeden Dot Com ist, versuchen Sie es nochmal und sagt: Schlecht, dass Sie es sind. Nun, was ist, wenn ich die Seite aktualisieren und sagen H T p Golin Schrägstrich Beschichtung für alle Punkt com und sagt, das Mädchen ist gut? Okay, also haben wir hier eine funktionierende, wenn sonst Aussage. Wenn also das u. R L gut ist, brauchen wir gar nichts zu tun. Aber wenn das u. R L schlecht ist, müssen wir es reparieren. Also lasst uns weitermachen und das reparieren. U R l wir werden es jetzt beheben, indem wir sagen, die u R L ist gleich http Doppelpunkt Schrägstrich und dann werden wir nur den Rest des Mädchens kontaminieren . Ja, wir können diese Konsul Logs loswerden, wenn wir wollen. Tun sie nicht wirklich irgendetwas an. Der letzte Schritt war, dass wir ein HTML-Element durch seine i d auswählen und den inneren HTML-Code ändern müssen, um einen Link darin zu haben. Also lasst uns weitermachen und das tun. Lassen Sie uns nun einen Absatz erstellen. Nehmen wir an, das ist der Link und lassen Sie uns einfach eine leere Spannweite hier schaffen, die Link heißt , wird nichts da drin sein. Wenn wir die Seite aktualisieren, sehen Sie, dass sie abgebrochen wird. Es sagt nur, Dies ist der Link, den wir tatsächlich sehen können, dass sogar eine ungefangene Art Luft nicht die Eigenschaft Substring von Nein lesen kann , weil es nichts drin ist. Das ist, was passiert, wenn wir klicken. Abbrechen. An dieser Stelle sollten wir etwas von Arbeit haben. Sie gehen davon aus, dass Sie tatsächlich etwas eingeben, und dann müssen wir es hier reinlegen. Also lasst uns den Knoten schnappen. Lassen Sie uns var Link Knoten gleich ist oder ich denke, es ist eine Spanne Notizen. Oh SPAN-Note ist gleich Dokument. Ich bekomme Element von i D und nur Link genannt und lass uns voran gehen und span Knoten Punkt innere HTML ist gleich der URL, so dass wir fast da sind. Lassen Sie uns voran gehen und sagen Codierung für alle dot com. Es hat es für mich repariert. Cool. Aber letztendlich ist das nicht ganz, wonach wir suchen. Wir wollen eigentlich, dass dies ein Link zur Codierung für alle dot com ist. Also müssen wir das in etwas HTML einfügen und hier ist es, wo es trinken und Cat Nation kommt herein damit wir das auf ein paar verschiedene Arten tun können. Wir könnten alles in einer Zeile sagen. A h r E f ist gleich und dann schließen. Und dann könnten wir da reingehen und sagen, „Kontaminieren“ und wir könnten die UL hier reinbringen . Und dann können wir auch hier mit dem Mädchen kontaminieren. Und so wird das für jeden Dot com Beschichtung funktionieren. Und wenn ich darauf klicke und Sie können tatsächlich sehen, dass es sagt, zitiert für alle dot com, boom lädt die Website. Das ist ziemlich nett. Oder wenn Sie etwas saubereren Code schreiben wollten, könnten wir auch sagen, dass HTML eine neue Variable namens HTML erstellt und auf diese Weise haben wir unser HTML in einer neuen Zeile, und es sieht einfach nicht so überfüllt aus, so dass wir dasselbe tun können hier. Wir können nicht sagen, google dot com und nehmen Sie uns nicht zu http google dot com Es gibt tatsächlich eine Abkürzung. Ah, wir haben momentan eine leere if-Anweisung. Also wie, warum schreiben Sie das überhaupt? Also, was wir sagen könnten, ist, dass wir diese ganze Sache überspringen könnten. Lassen Sie uns die else Aussage loswerden und wir bekommen, sagen wir, wenn es nicht so ist, etwas zu vergleichen, um sicherzustellen, dass es wahr ist sagen Sie zu Gleichheitszeichen, etwas ist nicht wahr oder nicht dasselbe. Vielmehr, sagen Sie, Ausrufezeichen Gleichheitszeichen. Und das sagt nicht das Gleiche. Also lassen Sie uns einfach hineinzoomen und es sieht so aus, nicht das Gleiche. Und was wir sagen hier ist, wenn das Mädchen in den ersten 4 Zeichen nicht http ist, stellen Sie sicher, dass es http ist. Und dann haben wir die andere Aussage loswerden. Also, jetzt sagen wir, im Grunde, wenn es nicht mit http beginnt, muss es so den Euro überschreiben. Lassen Sie uns das eine Chance geben. Gehen wir rein, erfrischen wir uns . Letztes Mal, welche Seite wollen wir zu dir gehen? Gehen wir zu facebook dot com und bam, das funktioniert. Was ist, wenn wir bereits http dort einfügen? Sie wissen, eine Kopie und einfügen Sie sind alles, was bereits in ihrem http YouTube Elcom ist. Es funktioniert auch, also ist alles gut. Das funktioniert einwandfrei. Und so ist das ganze Viele-Projekt. Und das, was wir verwendet haben, ist prompt. Wir verwenden eine if-Anweisung. Eigentlich haben wir technisch eine else-Anweisung verwendet, und dann kombinieren wir diese irgendwie in einer Zeile. Wir werden später mehr darüber reden. Das hättest du nicht von deinem Kopf wissen müssen. Dann packten wir unser SPEN und injizierten dann HTML hinein. Darüber hinaus könnten wir das tatsächlich tun. Wir könnten auch sehen, ob jemand abgesagt hat. Was ist, dass du draußen bist? Nun, dass Sie l sind, ist gleich zu wissen, Typ der neuen URL ist ein Objekt. Und so wissen wir, dass dies eine Art Datentyp sein wird, und tatsächlich wissen Sie das vielleicht nicht und das ist okay. Sie müssen nicht wirklich wissen, dass ich Ihnen etwas ziemlich Cooles zeigen werde , meiner Meinung nach. Also könnten wir sagen, wenn das Mädchen gleich weiß Alert, stornieren Sie das schnell, weil wir nicht wollen, dass es ausgeführt wird. Also lasst uns weitermachen. Brechen Sie dies schnell ab, weil wir nicht möchten, dass es ausgeführt werden soll. Und so könnten wir tatsächlich sagen, wenn das Mädchen gleich wissen ist, dann stornieren Sie das andere und dann könnten wir alles andere in die andere Aussage einpacken, sagen wir jetzt , wenn im Grunde niemand auf Rat geklickt hat, sind wir gut. Aber wenn jemand einen schnellen Rat hat, werden wir darauf aufmerksam sagen, wir werden sagen, das schnell absagen. In der Tat, Tat, was wir tun könnten, ist, dass wir absolut nichts tun könnten oder wir könnten Konsolenpunkt jemals fehlende Eingabe tun . Andernfalls, wenn jemand etwas reingebracht hat, könnten wir dann eine if-Anweisung hier machen. Und dann könnten wir den Rest unserer Logik tun. Und so gehen wir weiter und geben uns einen Schuss. Abbrechen der fehlenden Eingabe genau so, wie wir es erwartet haben. Also, da gehst du hin. Das ist Ihr Mini-Projekt Nummer zwei. Ich habe hier drin ein paar Sachen gemacht, von denen ich nicht erwartet habe, dass du zum Beispiel weißt, ob du bist ich gleich weißt. Ja, das habe ich gerade aus einem Hut gezogen. Wusstest du noch nichts davon? Die if not -Anweisung. Das wussten Sie auch noch nicht. Das ist in Ordnung. Wir lernen die Dinge zusammen zur gleichen Zeit. Wir werden über all diese Dinge ein wenig später den Weg hinunter gehen und ich mag es, einige von ihnen einfach fallen zu lassen. Ich nenne sie Golden Nuggets. Nur diese kleinen Hinweise von etwas fortgeschritteneren Dingen im Code. Das macht schon Sinn. Du drängst dich ständig selbst. Du drängst dich nicht zu hart. , Vergiss nicht, du kannst das immer in einen Codestift stecken. Oder, weißt du, du könntest einfach einen Screenshot machen, wie ich hier habe. Sie haben Ihren Editor auf der linken Seite, und Sie haben Ihren Browser auf der rechten Seite, und Sie könnten Screenshots machen und es in Ihrem Skill-Share-Projekt teilen. 16. Sonderfälle umgehen: Okay. Wir wissen ein wenig über Vergleichsoperatoren und wie man mit etwas umgehen kann, das wahr ist . Und etwas, das falsch zurückgibt. Wir wissen, dass sie sind, wenn Aussagen und sonst Aussagen. Aber was, wenn wir mehr als das erreichen wollen? Was? Wir könnten so etwas tun. Wissen Sie, wenn unser Name Caleb gleich ist und dann könnten wir sagen, wenn der Name gleich Caleb ist, tun Sie etwas hier drin, okay? Und wenn es nicht Caleb ist? Nun, was ist, wenn der Name Zephyr ist? Nun, dann müssten wir tun, wenn der Name einem Zephyr entspricht. Skins jemals Aktion hier und dann haben wir eine andere Aussage. Und was, wenn der Name nicht Zephyr ist? Was, wenn es auch nicht Caleb Wars überhaupt ist? Was ist, wenn der Name gleich Henry Henry Action hier drin ist? Was ist, wenn der Name nicht Caleb Zephyr oder Henry ist? Und das geht weiter und weiter und weiter, und es wird wirklich eklig. Ich meine, selbst wenn ich das jetzt anschaue, ist es irgendwie ein wenig verwirrend für das bloße Auge. Sieh es dir einfach an und du gehst. Das ist eine Menge Verschachtelung, und das könnte für immer und ewig weitergehen. Zum Glück gibt es einen besseren Weg, damit umzugehen. In der Welt von JavaScript gibt es tatsächlich zwei Möglichkeiten, dies zu tun. Ich werde dir den Hauptweg zeigen. Der gebräuchlichste Weg. Sie würden dir keinen anderen Weg zeigen. Das ist ein wenig weniger üblich, aber auch ein super nützlich. Also, was wir tun können, ist, wenn der Name gleich Caleb ist. Großartig. Wissen Sie, der Rat meldet sich nicht großartig. Okay, wir können auch anderes tun, wenn der Name Zephyr gleich ist, und dann bekommen wir, sagen wir, sagen wir, Council Dot Log Nr. Und dann können wir sonst sagen, wenn der Name Henry Consul gleich ist, das Protokoll wenig ich. Oh, weil er ein kleines Kätzchen ist. Und schließlich, wenn es nicht Caleb oder Zephyr oder Henry Council ist, hat Dot Warren so etwas nicht gehandhabt. Und lassen Sie uns voran und geben dies eine Auffrischung, und wir können sehen, dass es großartig in Ihrem lassen Sie uns das kleiner machen. Und wenn wir diesen Namen in Zephyr ändern, sagt ich. Oh, wenn wir diesen Namen in Henry ändern, wissen wir, dass er den kleinen Meo sagen wird, weil wir das geschrieben haben. Ein wenig meo und wenn wir es zu irgendjemandem ändern, lasst es uns in Hund ändern. Oh, Hund, es wird nicht gehandhabt. Und so kommen wir davon weg, wenn Anweisungen innerhalb von if-Anweisungen innerhalb von if-Anweisungen innerhalb von if-Anweisungen zu verschachteln , können wir sie so schön und flach halten. Und in der Tat mein Editor und die meisten Redakteure Ihnen erlauben, dies zu tun, weil Sie hier geschweifte Klammern haben , an denen Sie sie tatsächlich schließen können. Und so sieht es jetzt tatsächlich viel sauberer aus. Sie können das tatsächlich lesen. Wenn der Name Caleb gleich ist, wird er etwas tun. Wenn es Zephyr gleich ist, tun Sie etwas, Henry, tun Sie etwas, oder wenn es etwas anderes ist, tun Sie etwas anderes. Und wenn du jemals eine Menge Code durchschaust, bist du wie, Ah, Ah, was passiert, wenn der Name Zephyr ist? Du öffnest einfach die Konsolen-Blog Mahlzeit. Und so ist, wie wir weg von einem verschachtelten. Wenn Anweisungen jetzt in Javascript, gibt es eine andere Möglichkeit, dies zu tun, und viele andere Sprachen haben dies auch. Es wird eine switch-Anweisung genannt. Sie sehen es nicht mehr zu oft, aber es ist definitiv eine Sache, auf die Sie sich verlassen können, wenn Sie viele, wenn sonst if-Aussagen haben . Also sagst du einfach switch und du gibst ihm eine Variable, was auch immer das geschweifte Klammern sein wird und dann gibst du ihm einen Fall. Der Fall wird also Caleb sein. Und dann, wenn der Fall Caleb ist, könnte man sagen, Council Dot Log äh, Caleb. Und dann sagen wir „Pause“. Und das ist wie eine if-Anweisung, die Onley anstelle von geschweiften Klammern verwendet, einen Doppelpunkt verwendet hat. Und anstelle dieser geschweiften Klammer verwenden wir den Wortumbruch. Wir werden das Wort tatsächlich viel mehr brechen sehen, wenn wir zu Drahtschleifen kommen. Vier Schleifen für jede Schleifen, Dinge wie die dort könnten wir ihm einen anderen Fall geben. Einen anderen Namen, den wir sagen könnten, Nathan Konsul Dot Log. Hallo, Nathan brach. Und dann könnten wir so weiter sagen und so weiter und so weiter. Oder wenn wir nur ein anderes Szenario fangen wollten, könnten wir einfach sagen, Standard-Rat Punkt warnen nicht behandelt und brechen. Gehen wir weiter und lassen Sie uns vom Namen ändern. Das sind Änderungen an Familienmitgliedern. Und lassen Sie uns Var erschaffen. Familienmitglied ist gleich mit Caleb zu beginnen, ich werde ich sein und sagt, Hallo, Caleb. Und dann, wenn ich es in Nathan Hi geändert habe, Nathan. Und was, wenn ich es in Wade ändere? Nicht behandelt auf 9 22 so, nicht behandelt Zeile 22. Das ist also im Grunde genau die gleiche Art zu tun. Und wenn sonst Aussage einige Leute wie diese Weise, einige Leute mögen die wenn sonst wenn Weg, persönlich, persönlich, ich lehne mich auf die wenn sonst, wenn sonst Weise, es scheint nur ein wenig expliziter. Und nicht jeder weiß von der Switch-Funktionalität. Es kann also ein bisschen schwieriger für jemanden sein, der noch nie eine switch-Anweisung wie diese gesehen hat , herauszufinden, was vor sich geht, während jeder Programmierer, auf den Sie stoßen, darüber weiß, ob sonst if und else Anweisungen. Und so ist eine Sache, die hier zu beachten ist, zu versuchen, den ersten Fall zu entsprechen und zu stoppen. Also, was wir hier sagen, ist, wenn das Familienmitglied Caleb ist, Konsole, Log High, Caleb, und dann aufhören. Tun Sie keines der anderen, genau wie hier unten. Wenn der Name gleich Caleb ist, dann führen Sie einfach diesen aus. Aber das ist es nicht. Dann wird es versuchen, es zu tun. Das stimmt nicht überein? Nein. Dann wird es versuchen, das zu tun. Passt das zusammen? Nein. Dann wird es die else-Anweisung machen. Und diese L-Anweisung ist eigentlich optional. Sie müssen nicht, dass in ihrer Sie sagen können, wenn der Name Caleb Words, die für, oder Henry Maßnahmen ergriffen haben. Und wenn es etwas anderes ist, tun Sie überhaupt nichts. Du könntest völlig Recht haben, dass das, was ich möchte, dass du hier für ein paar Erfahrungen machst , richtig ist. Und wenn sonst gesagt wird, dass es nicht groß sein muss, muss es nicht komplex sein, weißt du, genau wie etwas. Was ich hier habe, nur eine Reihe von Konsolenprotokollierung. Das ist völlig okay. Ich möchte nur, dass Sie etwas Erfahrung mit der else if Syntax sammeln und wirklich, wenn es auf diese intakt kommt, sieht es so aus, als ob jemand eine If-Anweisung wie diese hier oben und in ihrer else-Anweisung ergriffen hat , sie haben es einfach eingefügt. Das ist alles, um dem eine Chance zu geben. Vergessen Sie nicht, etwas Spaß damit zu haben, und wenn Sie damit fertig sind, gehen wir weiter zur nächsten Lektion. 17. Code: Okay, Willkommen zurück zu einer anderen Lektion zum Lernen von JavaScript. Wir werden jetzt über Code-Kommentare sprechen, im Allgemeinen in einem Kurs habe ich in einem KursCodekommentare zuerst gestellt, aber ehrlich gesagt sind sie langweilig. Leider sind sie auch super nützlich, und es macht Sinn, sie zu lernen. Und so wollte ich das irgendwie verschieben und zu einigen der Spendersachen kommen, bevor wir in Dinge kommen , die nicht so lustig sind, wie Code-Kommentare. Also, an diesem Punkt, wenn Sie nicht wissen, was ein Code-Kommentar ist, sollten Sie Caleb fragen. Was ist ein Code-Kommentar? Nun, ein Codekommentar ist im Grunde eine Möglichkeit, einen Code zu nehmen, den Sie geschrieben haben, und Ihrem Browser mitzuteilen, dass er ihn nicht ausführen soll. Also habe ich hier ein Beispiel. Kommentar zum Konsolenprotokoll Ein Ende und wenn ich meine Seite aktualisieren, werden wir nur Kommentar sehen. Eins und zwei. In der Tat, lassen Sie uns zwei zeigen vier Mal zu einem Kommentar eins und dann 222 und zwei. Nehmen wir also an, wir haben hier einen Haufen Code in einer Zeile und wir wollen nicht, dass er überhaupt ausgeführt wird . Wir sagen, Hey, Hey, Javascript, führen Sie es nicht aus und alles, was wir tun, ist, dass wir einen Schrägstrich mit einem anderen Schrägstrich zusammen setzen, und das erzeugt einen einzeiligen Kommentar. Also, wenn ich das speichere und den Kommentar aktualisiere, erscheint hier nicht mehr einer. Nun, wenn es um mehrzeilige Kommentare kommt, können Sie die meisten Editoren wie ein Befehl Schrägstrich Shorts wie CMD plus Slash treffen. Oder wenn Sie unter Windows sind, ist es normalerweise Steuerschrägstrich so etwas, und Sie können alle diese Zeilen auswählen und Sie können sie alle gleichzeitig auskommentieren . Aber das ist kein mehrzeiliger Kommentar, der jede einzelne Zeile einzeln auskommentiert. Also, wenn wir alle von ihnen loswerden wollten, würden wir Schrägstrich und dann ein Sternchen tun, und dann am Ende würden wir ein Sternchen und dann einen Schrägstrich machen, und dies wird alles zwischen diesen beiden Punkten kommentieren. Und wenn du also den Raum entfernst, wirst du sehen, dass mein Code grau wird, und das wird immer und immer und immer weitergehen. Also, wenn ich Rat mache, können Sie sehen, dass mein Code immer noch grau Jahr Konsul Dot Log ist. Tauche ich auf und lass uns das loswerden? Oh, sieh dir das an. Es gibt tatsächlich einen Syntaxfehler, weil der Kommentar nie geschlossen wurde. Aber wenn wir Sternchen machen und dann einen Schrägstrich gleich nach dem Sprichwort, Hey, alles dazwischen hier hat gerade auskommentiert. Also sparen Sie Erfrischung. Tauche ich auf? Ja, das tust du. Du tauchst auf, weil alle anderen Zeilen Air auskommentiert hat. Also lassen Sie uns unsere Seitenquelle sehen und wir können sehen, dass es hier einen Kommentar gibt, und es gibt einen Kommentar, einen mehrzeiligen Kommentar hier, der alle Nummer zwei loswird. Sie können auch das Ende einer Zeile auskommentieren. Also, anstatt nur einen Kommentar am Anfang zu haben, könnten Sie einen Kommentar danach haben, damit Sie unseren Namen speichern können, ist gleich Caleb. Und dann, wenn Sie einen Code machen wollten, notieren Sie einen Code-Kommentar, wenn Sie danach zwei Schrägstriche setzen und sagen: Dies ist mein Name und das wird auch nicht ausgeführt. Aber als jemand als ein anderer Entwickler schaut auf Ihren Cohen sagt Var Namen. Was soll das sein? Was für ein Name soll das der Name einer Person sein und sagen, das ist mein Name? In Ordnung, nun, ich weiß, dass das jetzt der Name der Entwickler ist, also kann ich mich auffrischen. Und es steht nur jedes Mal, wenn ich mich erneuere, tauche ich auf? Ja, du tauchst auf. Und wenn ich diesen var-Namen aktualisiere, ist Caleb und lassen Sie uns sicherstellen, dass es immer noch funktioniert, das geht hier und gibt einen Namen ein. Der Name ist Caleb ha ha. Sieh dir das an. Und alles, was hier rechts neben deinen doppelten Schrägstrichen liegt, wird nicht auftauchen. Das wird auskommentiert werden. Also, wenn Sie vorwärts gehen, werden Sie sehen, wie ich viel mehr Codekommentare mache. Dies ist eine wirklich gute Möglichkeit, eine Reihe von Code zu schreiben, der nicht wirklich ausgeführt werden muss , und es ist auch eine wirklich gute Möglichkeit, genau wie Dinge zu testen. Also, wenn Sie einen Konsul lange etwas wollen und Sie nicht sicher sind, ob Sie gehen, um es später zu verwenden , nur auskommentiert oder einen Kommentar ungewöhnlich Kommentar Kommentar zu kommentieren. Das ist alles, was es gibt, um Kommentare zu codieren, die nicht super interessant sind als Thema zu lernen , aber sehr , sehr wichtig sind, und Sie werden dies überall in jeder einzelnen Programmiersprache sehen, Sie werden überall Codekommentare sehen 18. Einführung in die Arithmetik: In Ordnung, reden wir ein wenig über Arithmetik. Also im Grunde, das ist nur ein schickes Wort für Mathematik. Sie wissen schon, Multiplikationsteilung Addition, Subtraktion auf. Dann haben Sie Dinge wie Module, die Rest und Exponenten sind, und das ist wirklich alles, was es gibt. Und dann, weißt du, gibt es ein paar zusätzliche Funktionen, in die wir eingehen könnten, weißt du, gibt es ein paar zusätzliche Funktionen, in die wir eingehen könnten, um zu unterzeichnen und zu unterschreiben. Und ich mache nur ein Scherz. Wir werden das nicht alles machen. Wir werden vorerst nur mit den grundlegenden Sachen arbeiten. Eigentlich ist das alles, mit dem wir überhaupt arbeiten werden, denn wenn es um Codierung geht, wenn es um die Programmierung geht, stellt sich heraus, dass die meisten von uns Luft programmieren. Eigentlich sind wir irgendwie faul, und wir sind nicht daran interessiert, alle möglichen komplizierten Mathematik zu schreiben. Wir wollen nicht in Kalkül und Algorithmen und solche Dinge geraten. Ja, Algorithmen sind ein Schlagwort, und es macht Spaß, darüber zu sprechen. Aber am Ende des Tages wollen wir acht Stunden am Tag damit verbringen, zu schreiben, die ehrlich gesagt wissen, dass die meisten von uns es nicht tun. Und das Gute an der Beschichtung ist, dass Sie es nicht tun müssen. Sie können mit einer einfachen, einfachen Mathematik davonkommen . Und so werden wir in diesem Video etwas mehr erfahren. Wissen Sie, einige der grundlegenden Arithmetik hinter JavaScript und wirklich, wir bleiben einfach bei Multiplikation Addition, Subtraktion und Division. Okay, also lass uns voran gehen und lass uns hier eine Variable erstellen. Also haben wir Variable Nummer eins ist gleich 100, dann haben wir Variable. Zwei ist gleich, ich weiß nicht, sagen wir 33,5. Ich erfinde ehrlich gesagt nur Zahlen an dieser Stelle. Jetzt. Wenn wir wollen, sagen wir, teilen wir diese Zahlen, sagen wir, wir wollten 100 durch 33 teilen. Wir könnten taub machen, geteilt durch taub zu und Sie können tatsächlich sehen, dass mir die genaue Zahl hier unten geben wird . Und so ist das Spaltung. Es ist nur eine Schärpe. Das ist alles, was es ist. Und wenn wir diese Zahlen multiplizieren wollten, ist es nur das Sternchen. Also tun Sie, Ah, Shift und dann die Nummer acht und Sie bekommen ein Sternchen, obwohl auf einigen Tastaturen, die ein bisschen anders sein könnten. Aber auf einer Standardtastatur ist es Verschiebung acht, um dieses Sternchen zu bekommen, und du wirst Multiplikationssubtraktion machen, ist nur ein Bindestrich, und Addition ist nur ein Pluszeichen, und das ist alles, was es dazu gibt. Und ehrlich ist es sehr, sehr selten, etwas Fortgeschritteneres als das zu verwenden. Gelegentlich kommen wir in etwas wie Modul ISS, das Ihnen den Rest von etwas geben wird. Also, wenn wir 10 Modul ISS drei gut, 10 geteilt durch drei geht dreimal und dann gibt es einen Rest von denen, die 369 und dann 10. Minus neun ist eins. Also im Grunde ist es nur erinnern, Long Division. Nun, so ist es. Und dann ist das der Rest. Und dann haben wir auch Exponenten, das ist nur, um Zeichen zusammen zu multiplizieren. Jetzt gibt es eine Regel. Wenn Sie mit größeren Formeln arbeiten, möchten Sie auch im Auge behalten. Ah, die Regel der Bettenmasse und es ist eigentlich eine andere Abkürzung für verschiedene Bereiche der Welt. Aber die Art, wie ich mich daran erinnere, ist Bettenmasse. Sie haben Klammern, Exponenten Division und dann Multiplikation, und dann zusätzliche Addition, Schrägstrich Subtraktion, je nachdem, was zuerst kommt sub. Ich weiß nicht, wie man diese scheinbar Unteranziehung buchstabiert, und so ist die Idee hier, wenn man fortgeschrittene Mathematik hat. Es ist nicht wirklich fortgeschritten, aber es ist ein wenig fortgeschrittener. Ich schätze. Es gibt eine Reihenfolge von Operationen und es ist Bett-Chaos. Also, wenn du Klammern siehst, mach zuerst deine Klammern, mach zuerst die Mathematik innerhalb dieses zuerst, dann die Exponenten innerhalb dieser Klammern, dann Division und Multiplikation, je nachdem, was zuerst von von links nach rechts und dann Addition oder Subtraktion, je nachdem, was zuerst von links nach rechts kommt. Ein Beispiel dafür wäre, wenn wir herausfinden wollten, was 30 Grad Celsius in Fahrenheit ist , so dass wir tun können, Celsius ist gleich 30. Und dann, um herauszufinden, was die Antwort ist. Nun, Sie könnten dio sehen die Zeit 1.8 plus 32 und tatsächlich loswerden See, Das sollte Vorschau für uns. Da gehen wir. Also ist es 86 F jetzt. Die Reihenfolge der Operationen, bei denen dies wichtig wird, ist, dass wir dies rückwärts plus 32 mal , 1,8 getan haben , . Wir hatten eine etwas andere Zahl, und obwohl das keine große Sache ist, sind es nur 1,6 Grad Unterschied bei und obwohl das keine große Sache ist,sind es nur 1,6 Grad Unterschied bei normalen Wettertemperaturen. Wenn Sie 1,6 Grad in einem Kreis entfernt waren, könnte das deutlich anders sein, besonders wenn Sie versuchen, ein Teleskop auf einen bestimmten Stern zu zeigen . Nun, das wirst du viel vermissen. Und so ist dies nur ein einfaches Beispiel. Aber Ihre Reihenfolge der Operationen ist wichtig. Und das ist das gleiche wie, du weißt schon, zuerst deine Klammern zu machen. Also hast du C, das 30 multipliziert mit 1,8 plus 32 ist. Und so wird es das zuerst tun und dann, was auch immer das ist, es wird 32 darüber hinzufügen. Und so ist das ein super schneller Crashkurs in die grundlegende Algebra. Seien Sie einfach einfach Reihenfolge der Operationen. Und wieder, Sie brauchen wirklich nicht zu viel darüber zu wissen, weil wir in den meisten Fällen nicht viel Mathematik machen, bis wir in Sie brauchen wirklich nicht zu viel darüber zu wissen, weil wir in den meisten Fällen nicht viel Mathematik machen,bis wir in die wirklich knackige Dreckigkeit von etwas Super-Komplexes geraten. Und für die meisten von uns passiert das nicht. Das war also deine Einführung in die Arithmetik. Genau wie eine kurze Zusammenfassung. Hier hast du num eins geteilt durch taub, also hast du hier ein Divisionszeichen. Multiplikation ist Ihr Sternchen. Subtraktion ist nur ein Bindestrich. Nur das subtrahierte Zeichen und dann das hinzuzufügende Pluszeichen. Und wenn Sie Modul iss wollten. Du könntest das Prozentzeichen benutzen. Und wenn du es und Exponenten willst, habe ich keine Ahnung, was das nützen wird. Ja, als eine wirklich große Zahl. Sie verwenden zwei Sternchen nebeneinander, so dass es aussieht wie multiplizieren, multiplizieren, was Exponenten sind. 19. Boolean Logik: In Ordnung, lassen Sie uns einen neuen Datentyp namens Boolean vorstellen, und Sie sehen, dass dies hier und wieder nur ein ausgefallener Programmierbegriff ist, weil entweder etwas wahr ist oder falsch ist. Das war's. Es ist entweder eins oder Null, wahr oder falsch, oder aus schwarz und weiß Tag und Nacht. Es gibt nichts dazwischen. Und Sie wissen, wie die Leute immer denken, dass Roboter oder Maschinen immer nur in Schwarz-Weiß denken . Nun, sie sind nicht ganz falsch, weil eine Menge Logik kommt auf wahr und falsch, und es gibt nicht viel geben zwischen ihren jetzt schwächen. Wissen Sie, wenn es um maschinelles Lernen geht, können wir eine Antwort wie 0,6 geben, und das neigt sich mehr zu wahr als falsch, und wir können damit arbeiten. Aber das ist nicht dasselbe wie die boolesche Logik. Wir wissen, dass 0.6 eine Zahl ist, und Boolesche Logik ist wahr oder falsch, so dass wir mit uns auf verschiedene Arten arbeiten können. Aber in erster Linie lassen Sie uns ein Skript erstellen, und in diesem Skript lassen Sie uns eine boolesche Variable erstellen. Also ist es kreativ. Variable ist cat gleich true. Und so reden wir einfach über meine Katze Zephyr. Und wir können sagen: Ist meine Katze eine Katze wahr oder falsch? Und so könnten wir in einem Vergleich sagen Operator ist Katze, und so können wir das tatsächlich tun. Ein paar Möglichkeiten, wie wir tun können, ist Cat ist gleich wahr, was die explizitere Art, es zu schreiben ist. Aber das ist irgendwie unnötig, denn wenn Sie irgendeine Art von Vergleichsoperator machen, wird immer überprüft, ob sich diese Anweisung schließlich als wahr erweist. Und während das schon wahr ist, so könnten wir diese abkürzen und einfach sagen, ist Katze. Es war ein Konsolenpunktprotokoll. Zephyr ist eine Katze, und lassen Sie uns gehen und Inspektoren und öffnen unseren Rat Rat Rat Rat. Es ist tatsächlich unten geschaltet. Los geht's, und da steht Zephyr ist eine Katze, und wenn wir wollten, dass das falsch ist, könnten wir einfach sagen: Hey, weißt du, was Katze falsch ist? Vielleicht habe ich einen Hund und nannte ihn auch Zephyr. Und nichts wird auftauchen, Jedoch, Jedoch, weil wir über die sonst Aussage wissen, können wir jetzt sagen, Council Dot Log ist keine Katze und da gehen wir. Und jetzt können wir nur über wahr und falsch sprechen ist eine Katze ist keine Katze. Wir könnten damit sogar viel komplizierter werden, wenn wir wollten. Und wir könnten den Benutzer nach einem Namen fragen, damit wir sagen können, dass unser Name gleich Aufforderung ist und ihr Name Wenn der Name Punkt in Kleinbuchstaben gleich ist, lassen Sie uns machen, dass kleiner ist jemals Katze gleich wahr ist . Gehen wir heute Abend in einen Virus. Nun, sonst werden wir retten, dass unsere Katze gleich falsch ist und ich schmeiße hier fast Semikolons rein. Sie sind nicht notwendig, aber eine gute Praxis, um in sowieso zu sein, weil alles JavaScript, sobald in die Produktion kompiliert wird, Min ified und zerquetscht wird, und alles wird zu einer Zeile von Javascript und so setzt es schließlich Semikolons hinein sowieso, so ist es eine gute Praxis zu haben, aber nicht immer notwendig. Und dann könnten wir hier drin sagen, sagen, , im wirklichen Leben hätten wir eine andere Logik und hier, basierend auf der Variablen, ist Katze. Und dann könnten wir sagen, ob Katze alarmiert ist. Du bist ein Katzenkätzchen. Und wir haben jetzt ein Immunsystem gegen Miami. Alarmierung. Du bist keine Katze. Du bist kein Kind. Er hat es überhaupt geschafft. Okay, also aktualisiere ich. Und wenn wir durch das gehen, wird mich um den Namen in deinen Namen bitten. Okay, ich werde in Zephyr tippen. Ich werde es buchstabieren, richtig? Diese Anstrengung, und es wird diesen Namen Kleinbuchstaben nehmen und überprüfen, ob es übereinstimmt. Niemals in Kleinbuchstaben. Also habe ich geschlagen. Okay, und da steht, dass deine Katze sagt, geht weiter. Er sagt, er ist okay, da drin ist variabel. Ist Cat ist gleich wahr. Hat einige Logik einige andere magische Sachen hinter den Kulissen und dann mit einer anderen If-Anweisung , wenn es eine Katze Alarm ist, sind Sie eine Katze. Und das ist Ihre grundlegende Einführung in die boolesche Logik. Jetzt gibt es einen anderen Weg, wie wir das tun können. Wir können die If und Ellis abkürzen. Also lasst uns weitermachen. Und weißt du was? Ja, lassen Sie uns das behalten. Das gefällt mir. Das ist da drin. Das macht unsere Programme ein wenig komplizierter, so dass wir auch die if else Aussage abkürzen können. Also, wenn Wir nur überprüfen wollten, ob etwas falsch war. könnten wir tun. Wenn es so ist. Katze ist gleich falscher Alarm, keine Katze. Also lassen Sie uns voran, und ich werde dies auch einen Standard geben, also muss ich das nicht immer und immer wieder übernehmen. Zephyr. Du bist eine Katze, die hier unten Zeile 21 ausführt. Und nichts, weil es nicht falsch war, so dass das nicht ausgeführt wurde. Aber was, wenn wir Henry sagen, meine anderen Katzen? Es sagt, Sie sind keine Katze, die Linie ausgeführt 23 es wird auch Linien ausführen 27 bis 29 sagt keine Katze. Das ist genau hier. Jetzt können wir dies auch auf die gleiche Weise abkürzen wie wir es getan haben. Wenn Katze ist, können wir das Gegenteil tun, indem wir sagen, Ausrufearbeit ist Katze. Das sagt falsch. Also lasst uns weitermachen. Und was ich hier tun werde, ist, gehen wir weiter und setzen sie in getrennte Zeilen. Lass uns das nach oben bewegen, damit du es wirklich sehen kannst. Das wird also auch falsch sein. Also das heißt im Grunde, wenn Katze falsch ist, lassen Sie uns das herausnehmen. Wenn ja, Katze ist falsch. Das ist, was das hier sagen könnte man auch, wenn man wollte, Man könnte sagen, Wenn Katze nicht gleich wahr ist, es wird nur immer wahr oder falsch sein. Also, wenn dies falsch ist als dies, ist der falsche Block auszuführen, auszuführen. Und so gibt es mehrere verschiedene Möglichkeiten, dies zu tun. Im Allgemeinen ist die häufigste Art und Weise, dass Sie gehen, um dies in der Wildnis zu sehen, wenn Katze ist, weil das falsch ist . Es ist der kürzeste Weg nach rechts, wenn es keine Katze ist, und wenn wir dann zu unserem Rat hier gehen, haben wir eine Variable namens Is Cat. Es ist falsch. Und wenn wir tun Art von ist Katze, wir werden sehen, es ist ein boolescher Wert jetzt. Eine Sache, die ich übersprungen, dass ich nicht wollte, überspringen war, wenn Sie einen Boolean, wo wir hören, VAR ist, Katze ist gleich wahr oder falsch. Wir setzen es nicht in Zitate wie diese, weil das eine Zeichenfolge ist, die nicht die gleiche wie wahr oder falsch ist. Eine Zeichenfolge kann eine beliebige Anzahl von Buchstaben sein, die sie mischen und Leerzeichen und Sonderzeichen übereinstimmen kann , und alles, was Boolean nicht ein Boolean kann, kann immer nur wahr oder falsch sein . Und so ist dies ein, denke ich, ein ziemlich guter Crashkurs in die boolesche Logik. Es wird wirklich nicht komplizierter als das. Der komplizierteste Teil ist, wenn Sie sehen, ob Anweisungen wie diese. Also, wenn ist Katze, wenn Sie das erste Mal betrachten, wenn Sie noch nie eine if-Aussage gesehen haben, denken Sie wahrscheinlich, was bedeutet das? Nun, das heißt, es ist wahr und wenn Sie jemals sehen, ob Ausrufezeichen Katze ist, ist das dasselbe wie zu sagen, ob die Katze falsch ist, damit Sie es wissen, nett und einfach so. Was ich möchte, dass Sie tun, , ist,dass Sie wissen, einfach daran basteln, bekommt eine Vorstellung davon, wie boolesche Logik funktioniert und einfach ein paar, wenn sonst Anweisungen mit boolescher Logik erstellen , , um jeden Tag Milliarden zu sehen. Es ist der schnellste Weg, um eine Ja oder Nein Antwort zu bekommen. Und noch eine Sache, bevor wir gehen. Boolesche Logik kann auch durch Einsen und Nullen dargestellt werden. Ich habe fast vergessen, dass das hier ein wichtiger ist. Scrollen wir hier runter, machen etwas Platz. Wir könnten auch sagen, weit ist Katze gleich eins ist, also ist dies das gleiche wie wahr, und Var ist Katze gleich Null. Das ist falsch, und das funktioniert in fast jeder einzelnen Programmiersprache. Wenn es Cata ist, weil das wahr sein wird. Oder Sie könnten auch sagen, Wenn ist Katze und das wird falsch sein, etwas in dieser Richtung und das wird völlig für Sie funktionieren. Also vielleicht auch eine Chance geben. Versuchen Sie, eine Variable zu true oder false zuzuweisen, und versuchen Sie dann, die Variable 21 oder Null zuzuweisen und einfach mit einigen if else Anweisungen zu spielen . 20. Listen mit Arrays erstellen: Hallo und willkommen zurück in diesem Video, wir werden über etwas sprechen, das ein Array genannt wird. Jetzt, mit allen Dingen Entwickler-bezogen und Array ist nur ein schicker Begriff für ah Liste. Das ist alles, was es ist. Wir werden nur ah erstellen, Liste der Variablen kann, ah, ah Liste der Strings, boolesche Ins sein. Wir könnten eine Liste von Listen erstellen, wenn wir wollten. Und in einigen Sprachen, wie Python, nennen wir es sogar eine Liste. Aber in JavaScript wird ein Array genannt. Also lassen Sie uns voran und machen dies größer, weil ich denke, wir können all dies tun, ohne tatsächlich Code in eine Datei zu schreiben. Und so ist ein Array wirklich, wirklich einfach zu erstellen, also gibt es ein paar verschiedene Möglichkeiten, ein Array zu erstellen, aber wir könnten einfach sagen, wie eine R r Variable, ein R ist gleich. Und dann haben wir eine öffnende und schließende harte Klammer, und drinnen setzen wir vielleicht werde ich meinen Namen und dann ein Komma setzen und dann, weil es eine Zeichenfolge ist, setzen Sie Zitate um und dann den Namen meiner Katze Zephyr und dann Akama. Und wenn ich es wollte, könnte ich hier als Boolean wahr sein, aber falsch. Und es gibt einen Boolean, den ich mein Alter reinlegen könnte. Ich könnte Zephyrs-Agent dorthin bringen. Jetzt ist nichts davon abgebildet, also ist es nicht wirklich verständlich, worauf sich all diese Daten tatsächlich beziehen. Aber wenn wir irgendwie ändern all dies und sagen, sie sind nein, nicht so genannt ein sind, nennen wir es Namen ist gleich einer Liste von Namen, die wir sagen könnten, Caleb Zephyr, Henry und ein Hund Oh, gehen Sie nicht dorthin wir gehen und nur Hit, Enter. Und selbst wenn wir versuchen, wieder darauf zuzugreifen, haben wir hier eine Liste und es steht in Klammern, dass es vier gibt. Das bedeutet, dass es vier Dinge gibt, die wir sehen können. Und hier haben wir diese Dinge, die Indizes genannt werden. Diese Luftnummern. Es ist Ihr Indexwert. Es beginnt also bei Null, weil der Computer beginnt, bei Null zu zählen. Also Null Caleb eins ist Anstrengung, Henry drei Hund. Oh, jetzt können wir nicht nur all diese verschiedenen Werte durchlaufen, und Sie wissen, Leistung oder Untätigkeit auf sie, wir können jeden einzelnen auch einzeln greifen. Also könnten wir Var sagen. Caleb ist gleich Namen und dann, wenn ich einen greifen wollte, könnte ich einfach greifen. Sagen wir Null. Nun, wenn das ein wenig verwirrend ist, können Sie dies immer auch in Ihrer Konsole testen. Also sind es Namen, und dann hast du deine harte Klammer und dann deine Indexnummer, also will ich die Zahl Null. Diese Null hier wird also genau hier mit dieser Null übereinstimmen und wird sagen, Caleb, und wenn ich einen Hund will, würde ich Indexnummer drei verwenden und wieder Computer beginnen, bei der Zahl Null zu einem Menschen zu zählen , die Zahl Null bedeutet nichts. Es gibt nichts an einem Computer, Computer sagen, Oh, die Zahl Null ist eigentlich eine Zahl, weil ein Computer das Konzept von nichts nicht versteht . Technisch gesehen versteht es nur, dass es eine Zahl gibt und es Null ist, also beginnt es bei der Zahl Null. Also, wenn wir einen Hund wollen Oh, würden wir den Namen der Array-Hard Bracket und dann die Indexnummer und dann eine schließende harte Klammer verwenden. Und wir könnten das anrufen, wenn wir es wollten. Da Go ist gleich, und dann könnten wir tun, was wir wollen, mit Douglas tun, um uns Großbuchstaben zu machen. Oh, in allen Kappen einfach so. So erstellen wir im Grunde ein Array. Es gibt eine andere Möglichkeit, ein Array zu erstellen. Wir könnten ein Array von Zahlen machen. Nennen wir es taubs ist gleich, und wir können ihm einfach ein tatsächliches Array geben. Wir riefen Array mit einem Großbuchstaben A an und dann konnten wir 1 99 Ich weiß nicht, 23 und Sie können sehen, dass es genau das gleiche Objekt erstellt hat. Also weißt du, du hast hier die harten Klammern. Wir haben Indizes hier drin, damit wir Tauben machen können. Das wird ein wenig verwirrend, aber auch betäubt. Wenn wir den Variablennamen taubs gemacht haben und wir den Index von zwei darin setzen, wird auf die Zahl 23 so, sicher genug, es tut. Es ist jetzt auf die Nummer 23 zugeschrieben. Okay, lasst uns das klar machen und mit Namen arbeiten. Wenn wir Namen nehmen, sagt uns unser Rat automatisch, dass es vier Gegenstände gibt. Was ist, wenn wir überprüfen wollen, ob es tatsächlich vier Elemente gibt? Nun, wir könnten Namen Punktlänge tun und dies ist eine Eigenschaft auf dem Namen Objekt wird mehr über Eigenschaften und Objekte und Methoden und alle möglichen komplexen Dinge ein wenig auf der Straße sprechen über Eigenschaften und Objekte und Methoden und alle möglichen komplexen Dinge ein wenig auf . Aber im Moment können Sie wissen, dass, wenn Sie Punktlänge machen, Sie die Gesamtzahl der Elemente in Ihrem Array erhalten werden. Und das ist Kraft, dass vier hier übereinstimmen, dass für ihre jetzt haben wir auch eine Variable namens Hund. Oh, und das ist eine Schnur. Das ist also etwas außerhalb des Geltungsbereichs dieser Lektion. Aber wir könnten auch Länge auf DA Go verwenden, um die Gesamtzahl der Zeichen zu erhalten. Also gibt es hier einen Unterschied. Der Unterschied ist Name ist ein Array, und hier ist es, wo Datentypen es wirklich wichtig, dass wir wissen, mit welchem Datentyp wir arbeiten. Ihre Namen sind ein Array, und wenn wir Punktlänge verwenden, wird die Gesamtzahl der Elemente in ihrem während Hund oh ist eine Zeichenfolge zu erhalten . Und wenn wir Punktlänge verwenden, bekommt es uns die Gesamtzahl der Zeichen dort drin. Und nur damit wir wissen, mit ihrem Hund zu arbeiten Oh ist eigentlich Dogg. Oh, also gibt es fünf Charaktere und deshalb hat es jetzt fünf zurückgebracht. Okay, das ist cool. Das ist ein Array. Also wissen Sie, wir haben zwei verschiedene Möglichkeiten, ein Array zu erstellen, das wir tun könnten. A R ist gleich einem Array mit unseren Gegenständen drin. Oder wir könnten einfach die Kurzform machen und harte Klammern benutzen. Ich benutze gerne die harten Klammern, aber gelegentlich verwende ich eine R K Warum nur super explizit zu sein, abhängig von dem Code, an dem ich gerade arbeite. Aber das liegt wirklich an dir, wie du es tun willst. Keiner der beiden ist falsch. Keine Art und Weise, wahr? Okay, schauen wir uns an, etwas zu einem Array hinzuzufügen. Also haben wir ein Array namens Namen, und wir wollen hier eine weitere Person hinzufügen oder einen weiteren Namen oder vielleicht ein weiteres Haustier. Lassen Sie uns voran gehen und sagen Namen dot push und wir wollen etwas in dieses Array schieben. Setzen wir das Wort Papagei hinein, und Sie werden sehen, dass es automatisch die Anzahl der Elemente im Array zurückgibt , und wenn wir wieder Namen nehmen, können wir sehen, dass es Calebs jemals Henry-Hund gibt. Oh, und der neue Elternteil und die Gesamtzahl der Gegenstände ist jetzt fünf, wenn wir etwas hier rauskriegen wollen. Was können wir schneiden? Also lassen Sie uns sagen, wir wollten Ah, die ersten 2 Elemente hier, die wir tun konnten, zwei Elemente ist gleich Namen Punkt Scheibe Wo zu beginnen, wo zu enden begann? Null. Und das auch. Und los geht's. Wir bekommen zwei Gegenstände, die wir bekommen, Caleb beendet die Mühe. Und so hat es einfach Array ausgeschnitten und sozusagen gesagt, Sie wissen was, schneiden Sie es direkt nach unten diese Art von Mittellinie. Du bist fast Mittellinie und entfernst Henry Dog ein Elternteil. Eigentlich, was er sagt, ist Copy Caleb in Zephyr und das in ein neues Array namens zwei Items. Wenn wir nun nur den allerletzten Punkt bekommen wollten und Sie diesen auch viel sehen werden, auch viel sehen werden, haben wir Dot Pop verwendet, und das ist dasselbe in mehreren Programmiersprachen. Es ist klar, dass wir hier Namen haben und Parrot wollen. Lassen Sie uns voran und erstellen Sie eine neue Variable namens Parrot ist gleich Namen dot pop, und das ist es nur Punkt Pop mit Klammern um sie herum und beobachten Sie diese Perritt ist jetzt gleich Papagei. Wenn wir den Typ des Elternteils gemacht haben, und dies wird eine Zeichenfolge sein, weil es kein Array zurückgegeben hat. Es hat gerade diesen letzten Artikel im Jahr zurückgegeben. Aber interessanterweise, was es tat, war, wenn wir Namen eingeben, wurde es tatsächlich von den Eltern befreit. Was es tat, war, das letzte Element im Array zu packen, es tatsächlich aus diesem Array zu entfernen und es irgendwo hineinzulegen. Nun müssen wir das auch nicht unbedingt in einer Variablen speichern. Wir könnten Namen Dot Pop machen, und das wird nicht den letzten irgendwo speichern. Also der letzte ist derzeit Hund. Oh, es kehrt zurück, Hund. Oh, aber wir haben nicht angefangen und variabel, also ist es für uns nicht mehr zugänglich. Und wenn wir Namen eingeben, haben wir nur drei Namen. Und so ist dies eine gute Einführung in eine Raise A Raise. Werden Sie wirklich, wirklich mächtig, wenn wir Maurin Zehenschlaufen bekommen. Also, zum Beispiel, für jeden Namen in Namen, die wir sagen Hallo. Mein Name ist Caleb. Hallo. Mein Name ist immer Hallo. Mein Name ist Henry. Wir kommen direkt in drei Zeilen, die immer und immer wieder. Und wenn dieses Array 100 Elemente lang wäre, müssten wir immer noch nur drei Codezeilen schreiben im Gegensatz zu müssen, dass wir jetzt Rat dieses Protokoll sagen müssen. Mein Name ist Caleb und dann Konsulat Logbuch. Mein Name ist immer Log betrachten. Mein Name ist Henry Constant Log. Mein Name ist Dog. Oh, du verstehst den Punkt. So weiter und so weiter. Wir werden viel mehr über eine Erhöhung auf der Straße sprechen. Aber jetzt sind Sie jetzt vollständig in die Welt einer Erhöhung des neuen Datentyps namens Array eingeführt. Und genau wie eine kurze Zusammenfassung des Wichtigsten, das Sie jetzt über ein Array wissen können , sind die Indizes. Also, wenn wir das taten, öffnen wir das. Wenn wir seine Mühe bekommen wollten, welche in C würden wir verwenden? Wir würden Nummer eins verwenden. Es ist nicht der erste Gegenstand, denn der erste Gegenstand ist Caleb. Es ist der zweite Gegenstand. Und so setzen wir jede Zahl um minus eins, weil Computer anfangen, bei Null zu zählen. Das ist der Schlüssel, der hier weggenommen wird. Also würde ich sehr empfehlen, dass Sie ein wenig Erfahrung beim Schreiben einer Gehaltserhöhung bekommen. Du musst nicht viel mit ihnen machen. Sie könnten einfach ein einfaches Array mit Namen erstellen und dann vielleicht nur das mittlere mit einem Index bekommen . Andernfalls, wenn Sie sich damit schon ziemlich wohl fühlen, gehen wir weiter zur nächsten Lektion. 21. Variable Typen überprüfen: Alles klar. Bisher haben wir über Strings, Zahlen, Arrays, Boolesche Ins gelernt Zahlen, Arrays, Arrays, , und es gibt noch ein paar mehr, die wir auf der Straße lernen werden. Aber vorerst möchte ich eine bestimmte Funktion erklären, die ich verwendet habe, um Ihnen zu zeigen, ob etwas ein boolescher oder eine Zeichenfolge oder ein Array oder eine Zahl ist. Nun, hinter all diesen, diese verschiedenen Arten von Variablen ist diese Sache, die ein Datentyp oder, in einigen Sprachen, eine Datenstruktur genannt wird in einigen Sprachen, . Also lasst uns voran gehen und uns ein paar davon ansehen. So ist es schaffen von unserem Alter ist gleich 30. Okay, wir wissen, dass dies eine Nummer ist, aber was denkt Javascript, dass es ist? Glaubt es, dass es eine String-Nummer ist? Irgendwas wie das? Lassen Sie uns eine andere in Ihrem Vyron-Namen erstellen ist gleich JavaScript. Vier Anfänger. Was denkt JavaScript? Diese Variable ist? Var. Du weißt, dass wir das schon gemacht haben. Seine Katze, wahr oder falsch? Und lassen Sie uns eine weitere unserer Autos ist gleich Leuten Wagon Lambeau und Audie Audio. Audie. So etwas. Lass uns ja, lass uns das nochmal auf eine Zeile setzen. Und wenn wir Ihre Seite aktualisieren, werden wir nichts sehen. Wir haben eine Reihe von Variablen deklariert, aber wir machen nichts mit ihnen. Lassen Sie uns voran gehen und jede Konsole protokollieren. Also Konsul Dot Log-Alter ist. Und hier drin werden wir eine Funktion namens Typ Of verwenden und es wird einfach nur sagen Alter und dann, was es tatsächlich ist. Lass uns weitermachen und uns retten. Wir werden sehen, Alter eine Zahl, die der Variablentyp oder der Datentyp ist. Lass uns weitermachen und ein weiteres schaffen. Sagen Sie, der Name ist der Name dieses Kurses ist, was auch immer das sein wird, ist Katze wird zu tun sein. Zu tun ist cata. Und schließlich haben wir Autos. Sind die Daten todo Autos? Okay, also bevor ich meine Seite aktualisiere, werde ich hier tatsächlich etwas Platz machen, damit das tatsächlich etwas einen Ball vorbeiziehen aussieht , wissen wir, dass das Alter eine Zahl ist, JavaScript hat uns gesagt, es ist eine Zahl. Was meinst du? Name ist von Was denken Sie, Katze ist und was denken Sie, Autos ist? Wir haben irgendwann alle diese durchgemacht, aber wir haben ihre Datentypen noch nicht vollständig erforscht. Ich meine, wir haben irgendwie, in gewissem Sinne, aber nicht ganz so. Wenn ich auf, Aktualisieren auf dieser Seite wird uns speichern und drücken Sie Aktualisieren. Wir werden sehen, dass Alter eine Zahl ist. Name ist eine Zeichenfolge ist Cat ist ein boolescher Wert und Autos ist ein Array, also Alter ist eine Zahl. Name ist eine Schnur Katze ist ein 1.000.000.000 Autos ist Oh, was ist das? Es ist kein Array. Nun, das ist interessant. Obwohl wir gesagt haben, dass es ein Array sein soll, ist es eigentlich dieses Ding, das ein Objekt genannt wird. Und interessanterweise, selbst wenn wir das tun, tun, tun, tun, tun, tun, tun, tun, machen wir gehen weiter und ändern uns in das Wort-Array. Wir werden sehen, dass dies nicht ändert Hit, aktualisieren, aktualisieren, und es immer noch sagt, Autos sind ein Objekt. Was ist damit? Nun, in JavaScript und in vielen anderen Sprachen, objektorientierte Programmiersprachen. Wir haben diese Idee von einem Objekt, und ein Objekt ist wirklich nur eine Datenstruktur, die es Ihnen erlaubt, mehrere Komponenten darin zu haben . Während ein Alter in diesem Fall eine Zahl nur eine Zahl ist. Sie können nicht wirklich viel damit tun, dass Sie es nicht in Groß- oder Kleinbuchstaben umwandeln können. Sie können es nicht ausblenden, so dass Sie nicht loswerden können, wissen Sie, das letzte Element, weil es nur ein Element hier drin ist. Es ist nicht einmal eine Liste oder ein Array. können wir gar nichts machen. Wir können nicht zu viele benutzerdefinierte Funktionen hinzufügen. Es ist nur eine Zahl, während mit der Variablen Autos genannt wird, es ein Objekt ist und wir tatsächlich viel mehr mit Objekten machen können. Lassen Sie uns voran gehen und werfen Sie einen Blick auf diese echte schnelle Autos Punkt und alles, was ich tun muss, Sie können sehen dass es sagt, Cat Array hier ist Hit Punkt und dann einfach nach unten scrollen und Sie können all diese verschiedenen Dinge, die ich auf diesem durchführen bestimmten Objekttyp. Jetzt werden wir in Objekte viel tiefer auf der Straße zu bekommen. Sie müssen sich also keine Gedanken darüber machen, den Unterschied zwischen einem Array und einem Objekt jetzt zu kennen , denn ja, nun, das in diesem Kurs vollständig abdecken. Aber die Sache, auf die ich Sie aufmerksam machen wollte, sind verschiedene Datentypen, die den Funktionstyp eines Typs Autos verwenden , und es gibt uns ein Objekt. Warum ist das wichtig? Nun, lassen Sie uns einen Blick auf den Unterschied zwischen einer bestimmten Eigenschaft werfen. Also, wenn wir altern, Punktlänge, was wir nicht alt haben, Liebling. Weil es eine Nummer gibt. Es gibt keine Länge zu einer Zahl. Ich meine, in menschlicher Hinsicht gibt es. Aber zu einem Computer gibt es nicht. Es sagt nur, dass die Nummer. Ich meine, was willst du für mich? Und die Zahl ist die Zahl, und so sind die Zahlen ziemlich einfach. Wenn wir sagten, Name Punktlänge, wir wissen, dass dies eine Zeichenfolge ist. Wenn wir Punktlänge genannt haben, wissen wir, dass dieser eine insbesondere eine Zeichenfolge ist, also wird es die Anzahl der Zeichen in ihm zählen. So J a v A S e r I p t Platz für Leerzeichen b e g i N e. R s 22 Zeichen jetzt, was, wenn wir tun, ist Katze Punktlänge undefiniert. Es hat nicht einmal eine Eigenschaft namens length. Dasselbe mit Zahlen hat keine Eigenschaft namens wir das nicht verwenden können, aber mit Autos, weil es ein Objekt ist oder wie wir es derzeit als Array kennen, können wir Punktlänge machen und dies wird drei zurückgeben. Wo das wichtig zu wissen ist, wenn ich das falsch gemacht habe, wenn wir das getan haben, wenn wir Autos Punktlänge gemacht haben, werden wir drei als die Gesamtzahl der Autos bekommen, die wir haben. Volkswagen, Lambo und Audie. Aber wenn wir Punktlänge nennen, ignorieren Sie diejenige, die ich da oben mit dem Tippfehler durcheinander gebracht habe. Wenn wir nicht Spiel Punktlänge, werden wir die Gesamtzahl der Zeichen zu bekommen, und so ist das sehr anders. Und wenn Sie versuchen, eine Punktlänge auf einer Zeichenfolge im Vergleich zu einer Punktlänge in einem Array zu machen, erhalten Sie verschiedene Antworten. Und das könnte Ihre Logik auf der Straße ändern, könnte man sagen, wenn das Array fünf Namen hat und etwas tut. Aber wenn Ihre Logik sagt, wenn die variable Punktlänge gleich fünf ist und jemand nur ein Wort mit fünf Buchstaben eingibt, wird das auch ausgelöst. Und so ist das der Unterschied zwischen Datentypen ist, wissen Sie, einige von ihnen haben bestimmte Funktionen oder Eigenschaften, die wir verwenden können, und einige von ihnen nicht und so werden Sie unweigerlich auf diese Straße hinunter laufen, wo Sie wie, oh Punktlänge auf Name ist 22, aber Punktlänge auf Autos ist drei. Warum ist das? Denn wenn ich Autos zähle, gibt es auch. Plus fünf ist sieben plus vier ist 11. Also denken Sie, dass Rückkehr 11. Aber nein, tut es nicht. Es gibt drei Ursachen drei Elemente darin. Jetzt wirst du das nicht sofort brauchen. Aber es ist sehr gut zu wissen, und ich habe Ihnen hin und wieder die Funktion gezeigt, die die Art von genannt wird, nur um Ihnen zu zeigen , was das ist. Wenn Sie also jemals darüber besorgt sind, was eine bestimmte Variable ist oder was der Datentyp ist, könnten Sie immer einfach den Funktionstyp von verwenden, Ihren Variablennamen mit Klammern um sie herum einfügen und sieht einfach so aus. Und es wird dir sagen, Oh, ich bin ein Boolean. Oh, ich bin ein Objekt. Ich bin eine Nummer. Es gibt also nichts, was du mit dieser Lektion zu tun hast. Ich wollte Ihnen das nur zeigen, damit Sie sich bewusst sind, weil Sie dieses Thema auf dem Weg begegnen werden, und ich wollte nur, dass Sie darauf vorbereitet 22. Variables Casting: Alles klar, wir haben uns die Überprüfung von Variablentypen angesehen. Wir haben uns verschiedene Datentypen oder Variablentypen angesehen. Wir wissen über Zahlen, boolesche Strings, Arrays, solche Dinge. Aber gelegentlich werden Sie dieses Ding namens Typecasting tun wollen. Also, wenn Sie zum Beispiel ahhaben , ah ist das variable Alter gleich 30 und Sie möchten, dass dies eine Zahl gut ist, derzeit ist dies eine Zeichenkette. Lassen Sie uns Rat nicht protokollieren Art von Alter, und es sagt, es ist eine Zeichenfolge, aber es ist tatsächlich eine Zahl, hat nur Zitate um sie herum. Was wir also können, ist dieses Ding, das Typ Casting genannt wird, wo wir im Grunde eine bestimmte Variable nehmen und wir versuchen, es sehr kräftig in eine andere Art von Variablen zu verwandeln . So, zum Beispiel, Alter wir könnten uns als Zahl eingeben, indem wir Zahl mit dem Kapital Ende und dann Alter eingeben. Und wenn wir das auffrischen, heißt es jetzt, dass es eine Nummer ist. So würden wir in der Zahl typecast. Nun, wo das wichtig wird, ist, sagen wir, Sie fragen nach jemandem Alter so weit, Alter ist gleich, wie Ihr Alter ist, und das ist tun Council Dot Log Art von Alter, und wir werden hier sehen, Ich tippe 30 ein und es wird sagen, es ist eine Schnur. Was wir in einer Nummer nehmen. Wir haben keine Stärke eingegeben, aber weil es nicht weiß, was Sie in Buchstaben oder Zahlen oder wahr oder falsch setzen werden ,geht , es nur davon aus, dass es eine Zeichenfolge sein wird. Wenn wir also „true“ eingeben, ist es immer noch eine Zeichenfolge. Aber was wir tun können, ist, dass wir dies jetzt schreiben können, damit wir sagen können, dass das Alter gleich dem Zahlenalter ist, und wenn wir dies tun, wird das funktionieren. Allerdings gibt es hier einen kleinen Vorbehalt, wenn wir versuchen, dies erneut zu tun und lassen Sie uns das Wort Stunden eingeben. Aber mein Name Caleb sagt, es ist immer noch eine Nummer, die cool ist. Aber was ist das für eine Nummer? Lass uns tippen und altern, sagt Nan. Dies ist ein anderer JavaScript-Datentyp, und A N bedeutet keine Zahl. Es ist keine Nummer. Er weiß nicht, was damit zu tun ist. Und wenn wir Ihre Seite aktualisieren und einfach 123 eingeben und das Alter hier überprüfen, heißt es 123, also wird es entweder funktionieren oder es wird nicht funktionieren und Sie müssen wirklich wissen, was Ihre Daten sein sollen. Wenn Sie nach dem Alter eines Menschen fragen, können Sie immer sagen: Ist die Alterszahl tatsächlich? Und jetzt können wir versuchen, das zu testen. Wir können sagen,, Wenn Alter alarmiert, Sie haben eine richtige Nummer. Gehen wir weiter und geben dem eine Chance, also ist es Typ in Caleb, und das wird nicht für mich funktionieren, richtig? Aber was, wenn wir 30 machen? Es steht, dass Sie eine richtige Nummer haben, und das liegt daran, dass diese Nummer tatsächlich eine richtige Nummer ist. Und so, als wir über Milliarden lernten, ist im Grunde eine beliebige Zahl in JavaScript, die nicht die Zahl Null ist, in einigen wahr. andere Sprache ist, dass es die Gegensätze sein könnte. Aber in Javascript, es sei denn, es ist explizit Null, wird es immer als wahr angesehen. Nan gilt als falsch. Es ist keine Nummer, aber wenn du ihm eine andere Nummer gibst, ist es wahr. Also, das funktioniert so schön. Jetzt können wir sagen, dass wir hier eine richtige Nummer haben. Wir können erkennen, ob es sich um eine tatsächliche Zahl handelt. Okay, jetzt haben wir eine richtige Nummer. Also, was wir jetzt tun können, ist, dass wir tatsächlich erkennen können, ob die Zahl etwas ist. Jetzt haben wir noch nicht in mehr Vergleichsoperatoren geraten, und das ist ein bisschen eine Vorschau auf das nächste Dutzend. Aber wir könnten sagen, wenn das Alter größer als oder gleich 18 Council dot log, Sie können abstimmen. Jetzt wird mich das nach meinem Alter fragen. Ich werde sagen, dass ein Agent es ausgeben wird, als eine Nummer sagen wird, ist das eigentlich Nummer? Oh, es ist eigentlich Nummernalarm, dass Sie eine richtige Nummer haben und dann sagen wird, Hey, Hey, wenn Ihr Alter über die Zahl von 18 ist, können Sie wählen und so sagt, dass Sie eine richtige Nummer haben. Und sicher genug, können Sie abstimmen und auch Konsolenprotokolle, die Art des Alters, die eine Zahl ist, die wir auch nehmen können. Wirf in die andere Richtung. Er muss nicht von einer Zeichenfolge zu einer Zahl sein. Wir könnten von einer Nummer zwei Saiten gehen. Nehmen wir an, unser Alter ist gleich einer Zeichenfolge. Nein. Nancy, der falsche Weg in unserem Alter ist eine Zahl von 30 und wir wollten eigentlich sagen, dass das Alter eine Zeichenfolge sein wird, die uns gezwungen hat, ein String und Konsul Dialog zu sein. Lassen Sie uns das Alter und die Art des Alters hineinlegen. Es ist jetzt eine Schnur. Das Schöne daran ist, weil es jetzt eine Zeichenfolge ist, die wir Alter Punktlänge machen können. Wir können sehen, dass es zwei Zeichen gibt, während wir mit einer Zahl das vorher nicht tun konnten. Und so gibt es Vorteile für Typecasting. Wir können dies auch mit wie Boolean und solchen Dingen tun. Also lasst uns das versuchen. Das ist se var ist Cat gleich seiner eine Zeichenfolge, Aber lasst uns voran und wirf dies als Boolean. So ist Cat gleich Boolean von Is Cat, Also überschreiben wir uns nur mit sich selbst als Boolean. Mal sehen, was hier passiert. Das ist kopieren Sie das hier und ungewöhnlich. Das und lassen Sie uns das Alter ändern zu ist Cat. Sieh dir das an. Es ist tatsächlich wahr, und es hat verstanden, dass wahr als Wort tatsächlich als wahr bestätigt werden könnte wie ein Boolescher. Und so können wir jetzt sagen, ob Katze ist oder ob keine Katze ist, okay, okay, und lasst uns noch einen hier drinnen machen. Lassen Sie uns Var Kurs ist gleich Js für Anfänger. Jetzt wissen wir, dass dies bereits eine Zeichenfolge ist, weil wir es als String deklariert haben. Sobald ich Leerzeichen hatte, setzten wir Zitate um sie herum. Nehmen wir an, wir wollen dies in ein Array verwandeln. Was wir tun könnten, ist natürlich gleich Array. Natürlich. Also, wenn ich jetzt die Seite aktualisiere und wir tun, uh huh Sieh dir das an. Es ist jetzt in einem Rennen. Es hat nur einen Artikel drin. Es hat wirklich nur die in Desy oder Index für Heather. Ah, aber es ist ein Array. Und so jetzt könnten wir tun, zum Beispiel, Kurs Lehrlänge und bekommen, wie viele Gegenstände sind hier drin? Nun, es gibt nur diejenige, die nicht dasselbe ist wie die Länge einer Zeichenfolge zu bekommen, die über 10 sein würde , was auch immer diese Zahl sein wird. Und tatsächlich könnten wir das tun. Natürlich. Null darf nicht lang sein. Es ist 16 und schwächen so Typecast in grundsätzlich jeden anderen Datentyp in Javascript. Alles, was wir tun müssen, ist zu sagen, Hey, das ist ein Boolean. Hey, das ist eine Schnur. Hey, das ist ein Array oder hey, das ist eine Zahl und wenn wir mehr Datentypen lernen, können wir auch neue erstellen. Und so im Grunde, so werfen wir Variablen, und das ist wirklich alles, was es gibt. Und es hilft Ihnen wirklich, wenn Sie bestimmte Eigenschaften oder Methoden verwenden oder versuchen, herauszufinden , wie Sie mit bestimmten Datentypen wieder arbeiten. Dies wird immer relevanter, wenn wir diesen Kurs durchlaufen, und es wird immer relevanter in modernen JavaScript. Also ist es gut zu wissen, auch wenn Sie es nicht jeden Tag im Moment benutzen, werden Sie es schließlich ziemlich viel auf der Straße benutzen. 23. Weitere Vergleichsoperationen: schon. Werfen wir einen Blick auf einige weitere Vergleichsoperatoren. Bis jetzt haben wir wirklich nur mit gearbeitet ist gleich oder ist ungleich. Und wenn etwas wahr ist oder wenn etwas falsch ist, gibt es tatsächlich viel schwächener Dio, zum Beispiel können wir sehen, ob etwas nicht gleich ist, in das wir irgendwie getäuscht haben, aber nicht formal. Also schauen wir uns das in ein bisschen an. Wir haben auch ist größer als oder gleich ist größer als kleiner als kleiner oder gleich Teoh. Und dann haben wir schließlich einen strengen Vergleichsoperator , der am Ende dieses Videos weiterkommen wird. Erste Dinge zuerst. Schauen wir uns den Operator ist nicht an. Gehen wir weiter und kommentieren das, und so müssen wir in der Lage sein, zu vergleichen. Irgendetwas ist nicht. Wir haben uns das schon einmal angesehen, aber lassen Sie uns jetzt offiziell einen Blick darauf werfen. Also haben wir eine Variable. Und sagen wir, der Kurs ist gleich einem JavaScript-Kurs oder etwas, wissen Sie, einfach zu vergleichen. Und wir könnten sagen, wenn der Kurs gleich Js Council dot log ist J s Kurs. Und lasst uns weitermachen, das etwas kleiner machen und unsere Seite aktualisieren. Und es steht, ist ein J. S Kurs regelmäßig. Okay, kein Problem damit. Aber was ist, wenn was, wenn es nicht ist? Nun, das wird nichts tun. Aber lassen Sie uns voran gehen und das ändern. Nehmen wir an, wenn der Kurs kein Js Kurs ist, sagen wir, wenn der Kurs jetzt kein PHP-Kurs ist, macht diese Logik nicht wirklich viel Sinn. Aber es ist ein gutes Beispiel dafür, wie man das Gegenteil benutzt. Ein Vergleichsoperator. Wir sagen im Grunde genau hier. JavaScript. Die Zeichenfolge JavaScript ist nicht gleich PHP. Sind sie anders? Es ist richtig. Diese Aussage ist korrekt, daher gibt sie true zurück. Und was der Computer hinter den Kulissen sieht, ist Yep. Wenn es wahr ist, was es wahr ist, führen Sie dies aus. Und so kommen wir so zu diesem Punkt mit dem Operator „not“ oder dem „not equals -Operator. Eher als nächstes haben wir mehr als so lassen Sie uns voran und schaffen ein Zeitalter. Alter ist gleich 17 und wir können sagen, wenn das Alter größer als 10 dann Konsolenpunktprotokoll können Sie Fußball oder etwas in dieser Richtung spielen. Lass uns voran gehen und erfrischend. Da steht, dass du jetzt Fußball spielen kannst. Was das hier tut, ist wieder. Grundsätzlich können wir dieses Sprichwort ersetzen 17 größer als die Zahl 10. Ja, das ist es. Diese Aussage erweist sich also als wahr, und weil es wahr ist, wird sie diesen Codeblock ausführen. Was passiert, wenn wir sagen: Oh, Oh, um wirklich Profifußball zu spielen, musst du 18 oder älter sein. Du kannst wieder Profifußball spielen. Machen wir das einen Schritt kleiner und lassen Sie uns das sparen. Nichts passiert, weil dies false zurückgibt. Das heißt, wenn das Alter 17 ist größer als 18 war 17 eine größere Zahl als 18? Nein, dies stellt sich heraus, dass es falsch ist, daher wird es nicht ausgeführt. Denken Sie daran, ob Aussagen immer diesen endgültigen Abschluss benötigen, um wahr zu sein. Als nächstes können wir das Gleiche tun, aber wir können sagen, ist größer als oder gleich. Wann sollten wir das jemals benutzen? Angenommen, dein Alter ist 18 Jahre alt und du musst mindestens 18 Jahre alt sein, um abzustimmen, kannst du abstimmen. Wir können auch eine else if Aussage hier tun. also größer als 21 ist, Wenn das Alteralso größer als 21 ist,setze ich uns absichtlich wegen Scheiterns auf, und ich zeige Ihnen in nur einer Sekunde, Sie können Alkohol trinken. Da steht, dass du abstimmen kannst. Aber das ist auch wahr. Das Alter ist auch größer als 21 jetzt. Wir haben das vor einiger Zeit gelernt, aber es ist immer gut, die Grundlagen und JavaScript zu retuschieren. Es läuft von oben nach unten und sagt: Ja, Ja, das ist wahr. Dies ist die if-Anweisung, mit der wir eine Verbindung herstellen möchten, und machen Sie sich keine Sorgen um etwas anderes darunter . Also diese andere, wenn Anweisung ignoriert wird. Aber was wir tun können, ist, wenn wir das Andere loswerden und einfach eine andere erschaffen. Wenn Aussage, es immer noch sagt, können Sie nur abstimmen. Aber wenn wir das getan haben, heißt es, Sie können wählen und Alkohol trinken. Und wieder, wo benutzt man so etwas? Nun, wenn Sie das Alter von jemandem überprüfen, dürfen 18-Jährige abstimmen. Es sind nicht Menschen, die größer als 18 sind oder Menschen, die größer als 17 sind. Im Leben, sagen wir, dass Menschen, die 18 oder älter sind, dürfen wählen, Personen, die 21 oder älter in den Vereinigten Staaten sind, dürfen Alkohol trinken. Wir können auch im Grunde das genaue Gegenteil tun, also könnten wir sagen, aber das ist eine Variable. Lass uns hier etwas anderes machen. Der lange Name ist gleich Caleb Tallinn, also wird das mein vollständiger Name sein. Lasst uns nicht lange gebrauchen, denn das ist kein langer Name. Aber lasst uns den vollständigen Namen machen. Und wir könnten sagen, wenn der vollständige Name Punkt Länge größer als 10. Vertrauliches Protokoll, langer Name. Und da steht, ich habe ein langes Spiel. Okay, nun, das haben wir schon gemacht. Aber was ist, wenn es weniger als weniger ist, als wir sagen könnten Dies ist ein kurzer Name, Es ist jetzt können wir sagen, Hey, wenn dieser Name 012345678 oder neun Zeichen darin hat, weil es kleiner ist als die Zahl 10 wird dies sagen Kurzname. Das hat es nicht. Gehen wir weiter und verkürzte meinen Namen nur auf meinen Vornamen und es sagt Kurzname. Das ist also ein weniger als-Operator. Wir können auch weniger als oder gleich tun, wenn wir wollten. Lassen Sie uns haben, dass unser Name John Smith gleich ist, was wir hier drin haben. Wir haben 10 Charaktere hier drin. Das ist eigentlich ein perfekter Name . Sollte im ersten Beispiel verwendet werden, das wir tun könnten. Wenn der Name Punktlänge kleiner oder gleich 10 Council Log Gesamtlänge kleiner oder gleich 10 ist . Und lasst uns weitermachen. Und lasst uns das auch auf neue Zeilen setzen, denn wir können. JavaScript bekommt uns, gibt uns alle möglichen Leerräume. Setzen Sie dies als der zweite Parameter in hier und, sagen wir, Name Punkt Länge Gesamtlänge ist kleiner als 10 und wir können sehen, dass der tatsächliche Wert hier 10. Welche anderen müssen wir durchmachen? Ah, ich denke, wirklich. Der wichtigste, den wir hier haben, ist der strenge Vergleich. Also all diese anderen Luft wirklich grundlegende Mathematik ist etwas größer als weniger als gleich Wirklich , das ist alles, was es ist. Wo es ein wenig seltsam wird, ist das dreifache Gleichheitszeichen in JavaScript. Dies ist ein strikter Vergleich, was bedeutet, dass nicht nur der Wert übereinstimmen muss, sondern auch der Datentyp muss übereinstimmen, und das ist tatsächlich viel mehr Leistung. Es funktioniert viel besser auf Ihrem Computer. Es ist viel schnellerer Code, weil es nicht versuchen muss, wirklich irgendwelche anderen Faktoren zu bestimmen . Es steht nur, Hey, ist das ein richtiger Datentyp? Ja. Ist dies der richtige Wert im Datentyp? Ja, gehen Sie vorwärts. Es muss nicht versuchen, Zeh zu versuchen , sagen wir , Oh, drei die gleichen wie drei? Ich meine, JavaScript weiß das nicht. So versucht es herauszufinden oder ist wahr. Weißt du, das gleiche wie wahr. Einer ist eine Zeichenfolge, die man ein boolescher Wert ist, und es muss das irgendwie herausfinden. Während, wenn Sie das mit einem strengen Vergleich, Ihren Programmen, loswerden können, werden Ihre Skripte tatsächlich viel schneller sein. Es ist nicht merklich schneller für das menschliche Auge. jedoch Wenn Siejedochmit großen Programmen zu tun haben, fangen Sie vielleicht an, viele Daten zu knirschen. Wie das, was Netflix tut. Vielleicht willst du diese Art von Leistung. Egal, Sie werden einen strengen Operator in der Wildnis ziemlich viel sehen, weil es in modernem JavaScript ziemlich üblich ist . Also schauen wir uns das an. Dies ist die größte, die zur Notiz genommen wird. Alter ist gleich Lassen Sie uns sagen 30 und beobachten Sie dies. Wenn das Alter gleich 30 Konsul Dot Log ist, sind Sie 30 und sicher genug, es heißt, Sie sind 30. Obwohl das Alter eine Zeichenfolge ist und dies eine Ganzzahl oder eine Zahl ist, sind dies zwei verschiedene Datentypen, und so funktioniert es immer noch. Es versteht immer noch, dass Hey, ja, das könnte immer noch eine Nummer sein, als auch. Das bedeutet also, dass JavaScript eine lose getippte Sprache ist. Es bedeutet, dass Sie irgendwie damit umgehen können und einige der allgemeinen Regeln brechen , die Sie in Programmiersprachen wie C oder Python finden würden. Was passiert nun, wenn wir einen strikten Vergleich machen? Wenn wir den Streifenvergleich mit drei Gleichheitszeichen machen, machen wir diese größeren drei Gleichheitszeichen. Dies wird nicht ausgeführt. In der Tat, lassen Sie uns an einer else-Anweisung Konsole Punkt tun, warnen, falschen Datentyp, und lassen Sie uns das kleiner machen. Lasst uns weitermachen. Speichern Sie diese und Aktualisierungsseite und es sagt falscher Datentyp. Warum ist es der falsche Datentyp? Nun, es ist, weil wir ihm eine Zeichenfolge gegeben haben und wir sagen im Vergleich zu einer Zahl, also was das sagt, ist, String 30 ist gleich der Zahl 30. Das ist nicht das Gleiche in der Welt der Datentypen. Sie sind nicht die gleichen. Der Wert ist für einen Menschen gleich. Es ist das Gleiche mit einem Computer. Es ist anders. Und so können Sie sich das irgendwie vorstellen, als Zeichenfolge gleich Zahl ist. Nun, die funktionieren nicht dasselbe. Sie können eine Zeichenfolge nicht mit einer Zahl vergleichen, die so ist, wie es ist, eine Wassermelone mit einem Felsen zu vergleichen . Ah, ja, ihre Form mag die gleiche sein, aber im Grunde sind sie anders. Das sind ganz andere Dinge. Und so werden Sie diesen strengen Vergleich viel in freier Wildbahn sehen, und ich möchte nur, dass Sie darauf vorbereitet sind. Lasst uns weitermachen und das anrühren. Lass uns voran gehen und sparen. Aktualisieren sagt. Falscher Datentyp. Und wenn wir dies in eine ganze Zahl oder eine Zahl ändern, wie es in genannt wird, sagt JavaScript, Sie sind 30. Selbst wenn ich es täte, sagt 0.0 immer noch, dass du 30. Wissen Sie, wenn Sie aus einer anderen Programmiersprache kommen, sind Sie wahrscheinlich mit Dezimalstellen oder Gleitkommazahlen in JavaScript vertraut, Dezimalstellen, Gleitkommazahlen und ganze Zahlen sind alle gleich, es ist gleich einem -Nummer. Lassen Sie uns das auch auf eine neue Zeile werfen, damit wir das in unseren Notizen behalten können. Und so ist das eine kurze kleine Einführung, schätze ich. Und so war dies die mehr Vergleichsoperatoren Lektion. Wo wir sahen nicht gleich ist größer als oder gleich ist größer als kleiner als kleiner oder gleich n ein strikter Vergleich ist. Dies sind die häufigsten Operatoren, die Sie finden, ist sehr selten, dass Sie jemals etwas anderes als diese finden. Und als ein letztes Beispiel hier mit dem strengen Vergleich, Lasst uns einfach voran und lasst uns das zurückdrehen. Weißt du, was ich meine? Eine Kopie, diese ganze Sache, weil ich dieses Beispiel so mag, wie es ist. Also ist es üblich ausgestorben. Kopieren Sie das hier eingefügt eher und lassen Sie uns 30. Das wird uns also einen falschen Datentyp geben. Nun, in der letzten Lektion haben wir über Typisierung oder Variablen-Casting gesprochen. Gehen wir weiter und zwingen uns, eine Nummer Nummer Bam zu sein. Es funktioniert. Also hatten wir ursprünglich eine Schnur und wir sagten: Oh, Oh, das ist eine Schnur. Wir erwarten, dass es eine Nummer ist, die sich vorwärts bewegt. Wir wollen immer, dass das eine Nummer ist. Also haben wir über die Variable namens Age geschrieben. Wir geben es als eine Zahl und der Parameter für die Zahlenfunktion, die wir hier sehen, ist im Grunde, dass und Ausgabe 30 als Zahl. Und jetzt, wenn wir den strengen Vergleich machen, funktioniert es. Das ist alles, was wir für mehr Vergleichsoperatoren haben. Nehmen Sie sich auf jeden Fall ein paar Minuten aus Ihrem Tag und basteln Sie mit diesen, vor allem die letzte mit strengen Vergleichen. Das ist ein sehr wichtiger. Alle anderen, ich denke, die meisten Menschen können sie zum größten Teil bekommen. Preeti schnell. Es ist wirklich nur Hey, ist eine Zahl größer als die andere Zahl? Oder stimmt eins mit etwas anderem überein? Sie müssen an dieser Stelle kein Profi sein, Sie müssen nur etwas vertraut sein, damit im nächsten Mini-Projekt, wenn Sie aufgefordert werden, einen strengen Vergleich zu erstellen oder Sie aufgefordert werden, Code für einen Kunden oder Ihre nächste Arbeitgeber und du siehst so etwas, du gehst nicht. Was ist das? Können Sie sagen? Oh, ich weiß genau, was das ist. Also gehen wir los und setzen Sie für den Erfolg ein. Wenn Sie fertig sind, lassen Sie uns über die nächste Lektion gehen und tatsächlich denken, die nächste Lektion wird ein Mini-Projekte sein. Also lasst uns etwas Spaß damit haben. 24. JavaScript #3: Willkommen bei vielen Projekten. Nummer drei in dieser kleinen Herausforderung, was ich möchte, dass Sie tun, ist, den Benutzer nach einer Zahl zu fragen und dann diese Zahl auf eine tatsächliche Zahl zu setzen, weil wir wissen, was als String zurückkommen wird. Also wirf es als eine Zahl und stelle dann sicher, dass die Zahl gültig ist. Es kann nicht N a n sein und n bedeutet keine Zahl. Stellen Sie sicher, dass es tatsächlich eine Zahl ist. Und dann, wenn diese Zahl über 18 oder 21 ist, was auch immer Sie wollen, und ändern Sie den Text auf dem Bildschirm, um Ja zu sagen, sind Sie erlaubt. Also als ein paar Hinweise hier, Also Schritt Nummer eins fragte nach der Benutzernummer. Ich habe den Benutzer nach einer Nummer gefragt, die Sie verwenden werden, um die Eingabe in eine Zahl umzuwandeln. Sie werden Nummer mit einem Großbuchstaben verwenden. Stellen Sie sicher, dass die Nummer gültig ist. Also wirst du eine if-Anweisung brauchen, und dann, wenn diese Zahl über 18 ist, überprüfen oder ändern Sie einen Text auf der Seite, um Glückwünsche zu sagen . Du bist über 18 oder ja, du kannst abstimmen oder, weißt du, eine bestimmte Aktion machen. Also weiß ich, dass dieses Mini-Projekt ein wenig trocken ist, aber es ist wirklich, wirklich gute Praxis, weil Sie Dinge wie diese die ganze Zeit im wirklichen Leben verwenden werden. JavaScript. Jetzt, wie immer, werde ich Sie mit meiner Lösung und mit vielen Dingen im Leben versorgen. Es gibt verschiedene Möglichkeiten, dies zu erreichen, aber ich werde Ihnen zeigen, wie es geht. Aber ich würde gerne, wenn du in nur ein paar Sekunden dieses Video pausieren und es selbst fotografieren könntest. Und wenn Sie stecken bleiben, dann wissen Sie, nehmen Sie das Video wieder und Sie können meine Lösung sehen. Oder wenn Sie nur wollen, können Sie einfach meine Lösung ansehen und dann versuchen, sie selbst einzugeben. Welche Art und Weise Ihnen hilft, das Beste zu lernen. In Ordnung. Also werde ich mit diesem Mini-Projekt beginnen. Erste Dinge zuerst. Wir müssen den Benutzer nach einer Zahl fragen, die Eingabe auf eine Zahl umwandeln, sicherstellen, dass die Zahl gültig ist, und dann, wenn diese Zahl 18 ist, sagen Sie etwas, wie Sie abstimmen dürfen. Also lasst uns voran gehen und etwas Javascript schreiben. Also, hier wollen wir den Benutzer für eine Reihe von unserer Nummer fragen ist gleich Aufforderung. Geben Sie eine Zahl ein. Schritt zwei. Wir müssen uns als Zahl werfen, denn wenn wir Konsul Dot Log-Typ von taub tun, wird dies eine Zeichenfolge sein. Lassen Sie uns das ein wenig größer machen, das am Ende eine Schnur wird. Also müssen wir das eine Nummer sein. Also lasst uns voran gehen und uns als Zahl taub und Zahl nehmen. Dort gehen wir und wir müssen sicherstellen, dass diese Zahl tatsächlich gültig ist, denn wenn jemand etwas eingibt, das keine Zahl ist, wird zurückkehren und A n und A und keine Zahl. Also müssen wir sagen, wenn taub, wir müssen sagen, Hey, Hey, das ist definitiv eine Zahl Also, wenn es eine Zahl ist, gehen wir voran und führen etwas hier aus und dann können wir sagen, ob taub gleich oder größer als 18. Eigentlich sagte die Anweisung über 18. Wenn du es fabelhaft machen willst, Kumpel, weißt du, lass uns mehr als unser oder gleich machen. Also, wenn Sie 18 oder älter sind, können Sie ein Element von der Seite greifen und ändern Sie seine lassen Sie uns ein Element hier unserer Elem erstellen ist gleich dem Dokument dot get Element von i d und nennen wir es einfach l m kleiner hier, so dass wir alles in einer Zeile sehen können und dann können wir dio l m Punkt in ihrem Text Oder wir könnten inter html tun und sagen, Sie sind 18 oder älter jetzt, das ist alles toll, aber immer ein Element von i d mit einem Element Idee von e l E M existiert noch nicht, so gehen wir voraus und loswerden, dass. Und lassen Sie uns ein H vier mit einem i d von e l E m erstellen und es dabei belassen. Lassen Sie uns also Ihre Seite aktualisieren. Geben Sie eine Zahl ein. Gehen wir weiter und tippen Caleb. Nicht mit Zitaten, obwohl Zitate nicht schaden. Ja, nichts passiert. Und hey, übrigens, das kam als Schnur zurück. Gehen wir voran und Art der Nummer. Nehmen wir an, ich bin 17 Okay, nun, es wird immer noch nicht funktionieren, weil, wissen Sie, das vielleicht ausgeführt haben könnte, aber es hat diese if-Anweisung nicht übergeben, und es sagt immer noch, dass es eine Zeichenfolge ist, die soll. In der Tat, lasst uns hier runter gehen und uns von String zu Zahl ändern. Also das wird jetzt String und die Zahlen sagen, also nicht hier, es wird String und die Zahl sagen. Lassen Sie uns noch einmal auffrischen. Geben wir ihm mein richtiges Alter von 30 und das 2. 1 kam nicht auf, weil ich meine Datei nicht gespeichert habe. Also lassen Sie uns schnell machen, dass wir 30 Jahre alt sind. Da ist es. Zeichenfolgennummer. Du bist 18 oder älter, und das ist das Mini-Projekt auf den Punkt gebracht. Das ist alles, was wir tun. Okay, also wenn du diesen einen Schritt weiter machen willst, haben wir noch nichts davon gelernt. Aber wenn du es wolltest, könntest du unsere beiden if-Aussagen machen, weil sie eine in der anderen in eine ist. If-Anweisung. Also lassen Sie uns voran gehen und löschen Sie dies und bringen ihn eine Zeile und sagen, und so was das sagt, ist, wenn Zahl tatsächlich Zahl ist, Also, wenn es wahr ist und die Zahl größer als 18 ist, dann führen Sie dies aus. Sonst wird nichts tun. Versuchen wir es noch einmal. 30 Uhr! Genau so. Also haben wir nichts davon erfahren. Ich erwarte nicht, dass du das jetzt weißt, aber es ist ein cooles kleines Ding, mit dem wir in Zukunft basteln können. Das ist also viele Projekt Nummer drei alle eingewickelt. Wenn Sie uns keinen Schuss gegeben haben, um dies auf jeden Fall auf eigene Faust zu versuchen, versuchen Sie, nicht auf das Videomaterial zu verweisen, wenn Sie nicht müssen und versucht, es einfach aus dem Speicher zu tun . Wenn du stecken bleibst. Hey, das ist okay. Nehmen Sie einfach das Video wieder auf. Du kannst es aufpassen. Kein Problem, aber es ist gut, dein Gehirn ein wenig schwitzen zu lassen, wenn du damit fertig bist. Wenn Sie mit Ihrer Lösung zufrieden sind, gehen wir zu dieser nächsten Lektion. Und hey, vergiss nicht. Machen Sie einen Screenshot Ihres Codes und werfen Sie es in Ihr Projekt unten für Fähigkeiten teilen, so dass nein, ich kann einen Blick auf einige Ihrer Mantel und Sie können teilen und inspirieren andere Menschen als auch 25. Funktionen: Hey, wie niedrig? Ich hoffe, das Last-Minute-Projekt lief gut für Sie in diesem Video. Wir werden eine grundlegende Programmierung lernen, und es wird eine Funktion genannt. Jetzt. Eine Funktion ist wirklich nur eine Möglichkeit, ein Stück Code zu schreiben, so dass Sie es nicht immer und immer und immer wieder schreiben müssen . Hierbei gibt es einen Vorteil und einen Nachteil. Der Vorteil, nur einmal Code zu schreiben und ihn dann immer und immer wieder zu verwenden, ist, dass es weniger Code zu pflegen ist, so dass Sie sich keine Sorgen machen müssen, etwas zu reparieren. Wenn es ein Problem gibt, müssen Sie es nicht 10 Mal beheben. Sie könnten es einfach einmal reparieren, und es wird 10 verschiedene Male wirksam oder wo auch immer Sie verwenden. Es wird in nur einer Sekunde darauf hineinkommen. Sie müssen es wirklich nur an der einen Stelle befestigen. Jetzt hat eine Funktion einen Nachteil, und dieser Nachteil ist, dass es zunächst ein wenig schwer zu verstehen ist Wenn Sie also ganz neu in der Programmierung sind, könnte dies Ihr Gehirn ein wenig verletzen. Aber gebt mir dabei, ich möchte, dass du daran arbeitest, bis es Sinn macht, weil du Funktionen in jeder einzelnen Programmiersprache sehen wirst . Sie werden Funktionen so häufig sehen, wie Sie Variablen in der Welt von JavaScript sehen, und es macht Ihren Code wirklich einfacher zu arbeiten. In diesem Video werde ich Ihnen nur zeigen, wie eine Funktion aussieht und wir werden nicht wirklich eine Funktion schreiben . Wir machen das im nächsten Video, aber ich möchte dir nur zeigen, wie es jetzt aussieht. Lasst uns das so größer machen. Und wir haben eine Funktion. So beginnt es mit der Wortfunktion. Sie können sehen, dass mein Editor V s Code hervorgehoben hat, dass es Funktion sagt, während , wissen Sie, wenn es kein Schlüsselwort wäre, es wäre großartig. Aber es ist ein Schlüsselwort, also ist es schön und bunt, also beginnen wir mit der Wortfunktion und wir geben der Funktion einen Namen. Also lassen Sie uns diesem den Namen der Begrüßung geben. Und dann setzen wir Klammern, weil es eine Funktion ist und weil es irgendeine Art von Aktion ergreifen wird . Im Allgemeinen gibt es eine Reihe von Klammern danach, und dann können wir hier einfach sagen, Konsul Dot Log Hallo, Welt. Und so geht der gesamte Code, den Sie innerhalb Ihrer Funktion ausführen möchten, zwischen diesen geschweiften Klammern. Es sieht viel wie eine if-Anweisung aus. Und dann, um Ihre Funktion auszuführen, müssen Sie nur Gruß mit Ihren Klammern eingeben, und das wird Hallo sagen, Welt. Also, wenn ich das in Chrome öffne, werden Sie hier unten sehen Es sagt, hallo, Welt Jetzt Funktionen können diese Dinge namens Parameter oder Argumente nehmen. Und so können Sie sagen, was ist der Name von jemandem So können Sie einen Namen in diese bestimmte Funktion übergeben , und dann können Sie sie kontaminieren. Sie können hallo plus Name sagen. Und Sie können diesen Variablennamen innerhalb dieser Klammern verwenden und dann, um einen Namen zu übergeben, übergeben Sie einfach wie eine Zeichenfolge oder eine Zahl oder ein boolescher Wert oder so etwas. Wir werden eine Schnur namens Caleb übergeben und unsere Seite aktualisieren. Und es steht hier unten Hallo, Caleb. Und jetzt, innerhalb unserer Funktion, haben wir diese Fähigkeit, jede Art von Namen zu verwenden. Und was das tut, ist zu sagen, Hey, es gibt einen Parameter hier drin. Es gibt einen Parameter hier. Nehmen wir an, dass der Name jetzt gleich Caleb ist im Grunde, was er hinter den Kulissen tut sagt Name ist gleich Caleb. Nun, wenn Sie mehrere Parameter wollen, absolut, können Sie das tun. Sagen wir, es gibt einen Namen und es gibt ein Alter. Also lassen Sie uns sagen hallo Name und Alter ist Lassen Sie uns Alter dort und wir müssen auch in einem Alter passieren . Es gibt also zwei Parameter hier drin. Wir müssen sicherstellen, dass wir hier zwei Parameter haben. Wir tun das, indem wir diese durch ein Komma trennen, und das haben wir tatsächlich schon mit Council Dot Log gesehen. Und dann sagten wir etwas, und dann hatten wir ein Komma und sagten dann etwas anderes. Und was das sagt, ist, dass ein Objekt namens Consul später zu Objekten gelangt, aber im Grunde gibt es eine Funktion namens log. Dies ist der erste Parameter. Dies ist der zweite Parameter, und es ist nicht anders als unsere Funktion hier genannt Gruß, wo wir unseren ersten Parameter haben und dann haben wir unseren zweiten Parameter. Also lassen Sie uns speichern, öffnen, verchromen und aktualisieren und es sagt Hallo, Caleb. Alter ist 30. Also jetzt haben wir tatsächlich zwei Parameter oder zwei Argumente innerhalb unserer Begrüßungsfunktion. Es gibt zwei weitere Punkte, die wir uns ansehen sollten. Einer ist in modernerem JavaScript. Wir können uns auch ein Standardalter oder einen Standardnamen geben. Also lasst uns weitermachen und vielleicht sogar das tun. Es ist ein Standardname wird seine Anstrengung sein. Meine Katze und sein Alter ist nicht 30. Er ist vier. Lassen Sie uns voran gehen und diese Parameter loswerden. Was wir hier sagen, ist, wenn es keinen Name-Parameter als die 1. 1 gibt, die er so aussah . Wenn es keinen Name-Parameter gibt, nehmen Sie einfach an, dass der Name Zephyr ist. Wenn es keinen zweiten Parameter namens Alter gibt, nehmen Sie einfach das Alter von vier Jahren an. Also lasst uns weitermachen. Speichern. Erfrischend. Da steht Hallo, Zephyr Ages. Denn das ist relativ neues JavaScript, es ist eigentlich super nützlich. Viele Programmiersprachen haben dies seit vielen, vielen, vielen Jahren, und es ist endlich die Zeit für JavaScript, es auch zu verwenden, ist eine schöne Funktion. Nun, das letzte, was über Funktionen zu wissen, zumindest für dieses bestimmte Video ist eine Funktion kann von Wert zurückgeben und wir tun das mit dem Schlüsselwort Return genannt und dies kann alles zurückgeben. Also lassen Sie uns voran und geben Raum x zurück und das alles geht, um Semi zurückzukehren. Doppelpunkte sind optional, wenn es auf einer neuen Linie steht, aber gehen wir weiter, um Kontinuität willen. Und wenn wir Ihre Seite aktualisieren, werden wir eigentlich nicht sehen, dass Space X irgendwo auftaucht. Was dies tut, ist zu sagen, Hey, wenn diese Funktion ausgeführt wird und sie in einer Variablen gespeichert wird, wird dieser Variablenwert jetzt Space X sein, also lasst uns voran gehen und Gruß in eine Variable speichern. Bisher habe ich nur var aufgerufen, benannter Variablenname ist gleich Begrüßung. Es wird immer noch das Konsolenprotokoll ausführen, weil es diese Funktion immer noch ausführt . jedoch jetzt sein, Unser Name wirdjedoch jetzt sein, was hier zurückgegeben wird und das könnte ein Array ein Objekt sein. Es könnte eine Zeichenfolge Ah Boolean eine Zahl sein, Sie nennen es. Es könnte alles sein, was du zurückkehren willst, aber du bekommst nur eins. Sie können nur einmal zurückkehren, und alles hier unten wird nicht ausgeführt. also sieh dir das an. Konsul Dot Log funktioniert nicht. In diesem nächsten Beispiel werden wir sehen, dass dieses Konsolenprotokoll nicht funktionieren wird. Aber var Name wird auch Space X als Strings sein. Gehen wir weiter und geben dem eine Chance. Okay, ich erfrischen Issas Hallo ist Anstrengung im Alter von vier Jahren. Das Konsolenprotokoll funktionierte nicht. Es wurde nicht angezeigt, weil irgendetwas unterhalb der return-Anweisung nicht funktioniert. Lass uns voran gehen und es loswerden, da es nutzlos ist und lass uns einen Blick auf var name werfen. Sieh dir das an, es sagt Varney MySpace, Sechs unseres Namens hier hat den Wert von Space X, und du könntest alles mit Variablen tun, damit du den Exponenten des Alters altern kannst, was wirklich gefährlich werden könnte, wenn du 're mit einer großen, großen großen Zahl. Aber in diesem Fall wird vier auf die Macht von vier sein, und das ist, was die Zahl sein wird. Also sagen wir neue Nummer und okay, es hat unsere regulären Konsolenprotokolle gemacht. Nun geben wir eine neue Zahl ein und wir sehen 256. Wir haben das, weil vier mal vier mal vier mal vier vier ist 256. Und schließlich, wenn es darum geht, eine Funktion zu benutzen, ist alles, was wir tun müssen, wieder in Stan. Sie hasste wieder initialisieren Lassen Sie uns voran gehen und sagen, Caleb und 30. Lass uns hier ein neues schaffen und das wird Henry sein, und das wird es sein, und so wird das sein,weißt du, weißt du, lasst uns diese Rückkehr zu etwas ändern, das Sinn macht. Lassen Sie uns einfach den Namen zurückgeben. Und so wird das Standardname sein und das wird Caleb sein und dieser wird Henry sein. Also schau dir das an, wie ich traf, Refresh sagt. Hallo, Zephyr. Im Alter von vier Jahren. Dann kehrt es zurück. Der Name speichert es in einer Variablen namens Standardname. Dann gehen Sie in die nächste Zeile sagt, Oh, es gibt eine Funktion erscheinen. Okay, führen Sie den Code aus. Wir gaben ihm einen Namen namens Caleb, und wir geben ihm ein Alter von 30 Jahren. Hallo, Caleb. Alter ist 30. Okay, das tut es auch. Diese Zeile speichert es in der Variablen namens Caleb. Weiter geht es zu Zeile 18 sagt, Oh, es gibt eine in Ihrem namens Henry. Es hat eine Funktion namens Begrüßung, genau wie die anderen zwei Male wird es sagen, OK , nun, ich werde hier aufhören. Suchen Sie nach einer Funktion namens Begrüßung. Der erste Wert ist Henry. Also werden wir nicht den Standardwert seines Alters verwenden. Wir werden nicht den Standardwert von vier verwenden. Und so wird es Hallo sagen, Henry. Das Alter ist auch, und dann wird es seinen Namen zurückgeben. Dieser Teil hier wird das in einer Variablen namens Henry speichern. Und sicher genug, wir sehen Hallo, Henry. Ewigkeiten auch. Also, wenn wir voran gehen und sagen, Standard-Namen Köpfe von hier, werden wir leiden. Kayla ist Caleb. Henry ist Henry. Funktionen sind also ein kritischer Punkt, wenn es um die Programmierung in jeder Sprache geht, nicht nur Javascript, sondern in jeder Sprache. Und sie arbeiten fast alle auf die gleiche Weise. Sie haben eine Möglichkeit, es zu definieren. Sie geben ihm einen Namen, Sie geben ihm einige Parameter, wenn Sie wollen. Ah, du führst hier eine Art Logik aus, oder in diesem Fall machen wir nur ein Konsolenprotokoll und du gibst etwas zurück, und dann speicherst du es vielleicht in einer Variablen, und dann könntest du etwas tun mit dieser Variablen in der Zeile, also sind das Funktionen auf den Punkt gebracht. In der nächsten Lektion lassen Sie uns weiter gehen und einige ernsthafte Hände auf das Üben mit Funktionen, die wir richtig werden. Eine Reihe von ihnen wird ziemlich schnell sein. Aber hey, du kannst das Video immer verlangsamen. Du kannst es immer pausieren und es selbst ausprobieren, und ich bin hier, um dich bei jedem Schritt des Weges zu begleiten. 26. Übung: in der Welt der Programmierung, gibt es ein paar Hürden, die schwer für den Geist sind, um die erste zu wickeln 1 Seine Funktionen. Es kann zunächst schwer zu verstehen sein, und wirklich, Sie müssen nur mit ihm immer und immer wieder üben, bis es nur in Ihrem Gehirn klickt . Genau so. Der nächste ist Schleifen, und dann haben wir Objekte und objektorientierte Programmierung und solche Dinge gebracht. Aber die 1. 1 sind Funktionen, und sobald Sie Funktionen verstehen, die Dinge tatsächlich viel einfacher. Aber das ist die erste große Geist-Hürde, um zu überstehen, also ist es wirklich gut für uns, einige ernsthafte Übung mit Funktionen jetzt zu bekommen. nun Funktionen sindnunein alltäglicher Teil des Lebens. Wir müssen die wirklich wissen. Sie können JavaScript nicht ohne Funktionen schreiben. Nun, eigentlich war das eine Lüge. Könntest du, aber du wirst nicht sehr weit kommen. Ihr allgemeiner Code oder Ihre gesamte Anwendung wird extrem einfach und nicht sehr dynamisch sein , und es wird sehr, sehr lang werden, und Sie werden viel kopieren und einfügen. Jetzt gibt es eine allgemeine Regel und Programmierung namens Dry, was bedeutet, dass Sie sich nicht wiederholen, und wie wir dies tun, ist mit einer Sache, die eine Funktion genannt wird, also können wir die Logik nur einmal schreiben, und wir können sie immer wieder ausführen und immer wieder. Und zum Beispiel, zum Beispiel, wenn wir Celsius in Farron Heights umwandeln und die Formel 10 Mal auf lange Strecke geschrieben haben, und wir erkannten, dass wir die Formel falsch haben und sie in vier verschiedenen Dateien , wir müssen gehen und diese vier verschiedenen Dateien in eine Suche ändern und auf allen von ihnen ersetzen . Diese Art von saugt, Während wenn es nur eine Funktion wäre, könnten Sie die Funktion nur einmal reparieren, und es behebt sie überall sonst. Jetzt können Funktionen zunächst etwas verwirrend sein. Aber weißt du was? Ehrlich gesagt, arbeiten Sie einfach weiter an ihnen, weil sie mit der Zeit leichter werden. Und ich denke, ohne weitere Umschweife, sollten wir einfach wirklich reinspringen. Also lassen Sie uns zuerst eine einfache und nutzlose Funktion erstellen, die 100 dividiert durch drei hinzufügt und nur eine Zahl nehmen, durch 100 dividieren oder vielmehr 100 hinzufügen, dann durch drei teilen und zurückgeben, was auch immer diese Zahl ist Also beginnen wir mit der Funktion. Es ist ein Schlüsselwort und lassen Sie uns einfach Mathe nennen und es wird jede Nummer nehmen, die wir ihm geben. Wir haben einige öffnende und geschweifte Klammern, um hier jetzt eine Logik zu machen, wir wissen nicht, ob diese Zahl tatsächlich eine Zahl sein wird. Wir könnten sicherstellen, dass es eine Zahl ist, also könnten wir immer sagen, Numb ist gleich Zahl taub und lassen Sie uns sicherstellen, dass das richtig geschrieben ist . Da gehen wir und dann können wir sagen, wenn taub eine tatsächliche Zahl ist, dann könnten wir hier drin Sachen machen, nicht eine Riel-Nummer. Und jetzt ist unsere Funktion in zwei geteilt, weil wir hier jetzt eine if-else-Anweisung haben ,könnten wir hier , unten eine return-Anweisung machen. Wir können auch hier und hier drin eine Return-Anweisung machen, also lasst uns das tun. Wenn es keine reelle Zahl ist, lassen Sie uns einfach einen Booleschen Wert von false zurückgeben und wenn es eine reelle Zahl ist, also tun tun tun, ist eine reelle Zahl. Wir sagten, wir wollen, dass diese Zahl 100 durch drei geteilt wird. Nehmen wir an, unsere neue Zahl ist gleich NUM plus 100 dividieren durch drei. Und wenn wir sicherstellen wollen, dass das genau so herauskommt, können wir die Regel des Bettes verwenden, Miss Brackets, Exponenten, Division, Division, Multiplikation Addition, Subtraktion. Also wird es Nummer plus 101 tun, was auch immer das sich herausstellt. Und dann wird es durch drei geteilt. Und lassen Sie uns einfach eine neue Nummer zurückgeben. Also wird dies entweder falsch zurückgeben oder es wird die neue Nummer zurückgeben. Und lassen Sie uns das etwas kleiner machen, damit wir das auf einer Seite sehen können. Und nicht hier, sagen wir von unserem Brauch, Numb ist gleich Mathe zu tun, egal welche Zahl wir ihm geben wollen. Also lassen Sie es 343 geben, weil Zufallszahlen das speichern. Und wenn Sie dies jetzt auf Ihrer Seite öffnen, werden Sie sehen, dass nichts passiert, weil wir all diese Logik ausgeführt haben und wir entweder eine boolesche oder eine Zahl in diese bestimmte Variable namens Custom Numb zurückgegeben haben . Aber wir haben nichts mit benutzerdefinierten sie gemacht, wir haben es nicht konsolenprotokolliert oder so etwas. Also lassen Sie uns voran und Konsolenprotokoll jetzt. Konsul Dot Log benutzerdefinierte taub. Jetzt öffnen wir ihre Seite und drücken Sie Aktualisieren, und so können wir die Nummer sehen. Hier ist 147 Punkt 6666666666666 Was ist, wenn wir ihm etwas geben, Das ist keine Nummer? Sagen wir, die Nummer ist Caleb. Caleb ist keine Nummer. Ich bin eine Person, keine Nummer. Es gibt false zurück, weil das keine Zahl war. Es stellte sich nicht so heraus, wie wir es erwartet hatten. Nun, sollten wir diese Funktion immer und immer und immer wieder ausführen wollen? Wir könnten das einfach tun. Wir könnten sagen, Lasst uns das mit 30. Lassen Sie uns ändern, alle diese tun tun tun tun. Lassen Sie uns das nach oben bewegen und gehen wir voran und loggen Sie einfach jedes einzelne von diesen ein. Und so ist es hier. Es wird nur jede Nummer trösten. Wir überschreiben hier nur ständig die gleiche Variable. Lass uns voran gehen und sehen, was das zurückkehrt. 1. 1 ist falsch, und das liegt daran, dass der Name Caleb war. Ja, das ist keine Nummer. Die 2. 1 war 30, also haben wir 100 geteilt durch drei hinzugefügt und wir bekommen 43.3. Wiederholung der nächsten war 50 so 50 plus 100 ist 1 50 Divide durch drei ist 50. Das ist wirklich schön geworden. 501 plus 100 geteilt durch drei, 200,3 Wiederholung. Dann bekommen wir 41 minus 90. Das ist ein interessanter. Also minus 90 plus 100 ist nur 10 10. Geteilt durch drei ist 3,3 Wiederholung und dann drei plus 101 103 geteilt durch drei. 34,3. Das waren viele Dreier. Wow! Und so ist das die Macht hinter einer Funktion. Und, hey, wenn sich einer davon als falsch herausstellt, können wir immer wieder hierher gehen und sagen, Oh, eigentlich, das sollte nicht Divide by Three sein, sollte geteilt werden um vier. Und sieh dir das an. All diese Zahlen ändern sich. Wenn Sie also daran interessiert sind, mit mir zusammenzuarbeiten, können Sie Folgendes tun. Erstellen Sie Ihre erste Funktion und übergeben Sie einfach eine Zahl als einzigen Parameter, und arbeiten Sie dann einfach mit einer Zahl ein wenig, auch wenn Sie nur taub zurückgeben. Das ist besser als nichts, also geh weiter und gib dem eine Chance. Andernfalls gehen wir zur nächsten Funktion über, die etwas anders sein wird. Aber, weißt du, irgendwie das Gleiche. Lassen Sie uns hier eine andere Funktion erstellen. Aber dieses Mal werden wir eine Funktion erstellen, die auf etwas basiert, das JavaScript tut. Hast du bemerkt, wie wir ein Dokument geschrieben haben? Ich bekomme Element von i d. Und was auch immer das Element ist das Element i d Wir haben das viel geschrieben. Wir können das abkürzen. In der Tat sehen Sie das tatsächlich in vielen JavaScript-Bibliotheken. Wir können eine Funktion schreiben, wir nennen sie einfach Dollarzeichen und wir werden das I D übergeben und was dann? Schwächen dio ist schwächen einfach zurück dies. Und jetzt haben wir eine Funktion namens Dollarzeichen. Es braucht ein I d was auch immer das Ideen. Und es sagt, Hey, zurückgegebene Dokumente dot get element von i d Wir müssen das in unsere Variable ändern, und es wird nach diesem inneren Dokumentobjektmodell suchen, und es wird einfach geben Sie es zurück. Dann können wir später mit etwas arbeiten. Also lasst uns das versuchen. Nehmen wir an, Var Titel ist gleich Idee des Titels und dann wollen wir ändern. Der Innentext des Titelpunkts entspricht dem benutzerdefinierten inneren Text, und wir müssen tatsächlich sicherstellen, dass dies existiert. Also lasst uns voran gehen und jeden hier mit einer Idee des Titels erstellen. Da ist nichts drin. JavaScript wird dies für uns füllen. Und nur um sicherzustellen, dass wir wissen, was los ist, Ihr Konsolenprotokoll I d. ist Ihr Konsolenprotokoll I d. Und das sieht aus wie eine Funktion. Nein, funktioniert es nicht vom zweiten Parameter des Protokolls des ersten Parameters. Lassen Sie uns ihre Seite öffnen und drücken Sie Aktualisieren, und wir werden benutzerdefinierte inneren Text zu sehen. Falsch war von diesem hier oben. Lassen Sie uns einfach voran und kommentieren Sie das vorerst und Sie können den Titel der Ideen sehen. Also, was das tut, ist zu sagen, Hey, bekomme das Element durch seine I d Titelübereinstimmungen hier oben. Speichern Sie das in einer Variablen mit Ihren Return-Anweisungen. Das haben wir getan. Wir waren Wir haben es in einer Variablen namens Titel gespeichert, und dann können wir das verwenden. Es ist genau das Gleiche wie das. Tragen Sie hier einfach mit mir. Es ist genau das Gleiche zu tun. Erst jetzt schreibst du viel weniger. Und wenn Sie jemals ein anderes erstellen wollten, könnten Sie immer unser benutzerdefiniertes Element tun. Was auch immer Ihr Element ist, ist gleich dem benutzerdefinierten I d. Und dann ist der benutzerdefinierte Ellam Punkt inneres HTML gleich etwas hier. Du könntest so etwas tun und jetzt schneidest du es kurz ab. Jetzt schreibst du keine Dokumente. Erhalten Sie das Element nicht durch i d Klammern. Was auch immer Ihre Ideen immer und immer wieder. Du schreibst nur ein Dollarzeichen. Es ist also eine schöne Art, kurz zu schneiden. Ich traf. schließlich eine Funktion erstellen, Lassen Sie unsschließlich eine Funktion erstellen,in der wir Celsius in Fahrenheit konvertieren. Also beginnen wir mit der Funktion, die C heißt, um zu sehen, ob ich das beim ersten Mal fair im Hass buchstabieren kann . Es ist tatsächlich tun, das. Das heißt, Äh, ja, ich mag das nicht wirklich. Ist das so? Es ist nur zwei f zu sehen und wir können hier einen Kommentar hinzufügen. Ah, Celsius auf Luftfahrt Höhe. Jetzt müssen wir dem eine Nummer geben. Was ist die Celsius-Zahl? Siehst du, taub? So etwas braucht keinen Unterstrich zu haben. Wenn Sie wollen, müssen wir hier etwas Mathematik durchführen. Also lassen Sie uns Variable unserer Fahrenheit Fahrenheit tun Es ist gleich, was ist die Mathematik, die wir tun wollen. Variable Fahrenheit ist gleich, was auch immer Celsius ist. S O. C. Taub mal 1,8 plus 32. Und so lasst uns die Klammern hier reinlegen. Das wird also immer wieder zuerst ausgeführt, das ist nur die Reihenfolge der Operationen. Sie brauchen es nicht unbedingt, weil Multiplikation vor der Division kommen wird. Das ist nicht das Hier noch da, das nur Mathematik ist. Und dann können wir schöne Nacht zurückkehren. Jetzt machen wir keine Einchecken. Du hast nicht typisiert. Sehen Sie taub als Parameter als Variable, wir gehen nur davon aus, dass es sich um eine Reihe irgendeiner Art handelt. Also lassen Sie uns voran und erstellen Sie einige Variablen in Ihrem wir weit gekommen sind. Nehmen wir an, mit Null Grad ist so C bis F gut, um die Zahl Null dort zu setzen, so was auch immer das sein wird, und lässt Sie Dot Log Null beraten . Hey, lustige Tatsache. Sie können auch Codezeilen in derselben Zeile setzen, solange ein Semikolon vorhanden ist. Also Ihr Computer wird dies von oben nach unten lesen und sagen, Feuer Null ist gleich und sie kommen zum Semi, sagt Colon. Oh, hey, okay, nun, dieser Teil ist fertig, also gehen wir voran und führen das aus, als ob es auf seiner eigenen Linie wäre. Also werden wir das tun. Eins. Was ist Raumtemperatur, während die Raumtemperatur in Celsius 20 beträgt? Lassen Sie uns das 20 nennen und was kocht, so kochend in Celsius ist 100 Grad. Was ist das in der schönen Nacht und nur zum Spaß? Z's Lassen Sie uns einfrieren und lassen Sie uns eine Reihe von minus 40 setzen. Also, was ist minus 40 in der schönen Nacht? Lass uns weitermachen. Refresher-Seite. Also haben wir das gehen, um von unserer vorherigen Funktion zu loggen, aber wir können sehen, Null Grad Celsius ist gleich 32 Grad faire Nacht. Das ist richtig. 20 Grad ist 68 F und das Einfrieren minus 40 Celsius ist in fairer Höhe gleich. Es ist auch minus 40. Warum ist das wichtig zu wissen? Nun, weil wir hier drin etwas Mathematik machen. Und was, wenn wir das manuell berichtigen wollten? Jedes Mal? Wir müssten das durch die Nummer ersetzen, die nicht hier ist. so nullmal 1,8 plus 32 schrieben es wieder aus. Und dann müssen wir 20 machen und dann müssen wir 100 machen, das müssten wir jedes Mal ausschreiben . Und wir sind nicht daran interessiert, den ganzen Tag mit der Eingabe zu verbringen. Wir sind daran interessiert, guten Code zu schreiben. Was wir also tun, ist, dass wir es in eine Funktion werfen. Und weißt du, was das schlimmste Szenario hier ist? Was ist, wenn alle diese falsch sind? Was wäre, wenn statt 32 ein Tippfehler war und es 31 war? Nun, es wird keinen großen Unterschied machen, wenn es um Fahrenheit geht, wennwir über Raumtemperatur reden wenn . Aber immer noch ist die Nummer falsch. Und so müssten wir durchgehen und alle gleichzeitig reparieren. Das ist keine Möglichkeit, dein Leben zu leben. Und wenn es keine Funktion wäre, während der Fehler hier 31 gewesen wäre und alles, was wir tun müssen, ist es zurück zu 32 zu ändern, alle vier davon sind mit einem einzigen Tastendruck behoben. Also wissen wir jetzt viel mehr, wo wir unsere Zeit verbringen. In der Tat können wir das sogar abkürzen. Wir müssen das nicht als Variable setzen. Wir können einfach voran gehen und zurückkehren, was auch immer Celsius ist. Mal 1,8 plus 32. In Ordnung, das sind mittlerweile drei verschiedene Funktionen in JavaScript. Sie sollten zumindest mit der Syntax vertraut sein, wie sie aussieht, bevor wir zu Ihrem nächsten Mini-Projekt übergehen. Was ich wirklich möchte, dass du Dio bist, ist zu versuchen, eine Funktion auf eigene Faust zu schreiben. Es muss nicht nützlich sein. Blaue erste Funktion, die ich hier geschrieben habe, war fügt 100 Dividen durch vier, wie ich diese Funktion nie im wirklichen Leben verwenden werde . Aber es ist eine gute Praxis, also vergessen Sie nicht als Erinnerung Funktionen beginnen mit einer Schlüsselwortfunktion. Es hat eine Art von Namen, Klammern und dann haben Sie Argumente thes air optional. Sie können absolut nichts tun, wenn Sie möchten und eine return-Anweisung hat, um die gewünschten Daten in einer Variablen zu speichern . Also geben Sie etwas zurück und dann, um auszuführen, können Sie von unserem Namen tun, ist gleich dem Namen so. Oder wenn Sie es nur ausführen wollten, speichern Sie nichts in einer Variablen. Sie können es auch einfach so machen. Also geh weiter, gib uns eine Chance. Ich werde Ihnen nicht sagen, welche Art von Funktion zu Recht. Es ist weder hier noch da. Es könnte eine gute Art von Funktion sein, eine nützliche Funktion im wirklichen Leben oder nicht. Es spielt keine Rolle. Werden Sie so kompliziert oder einfach, wie Sie möchten. Ich möchte nur, dass Sie in der Lage sein, eine Funktion zu schreiben , denn in unserem Mini-Projekt werden wir eine Funktion schreiben. Gehen Sie weiter. Gib dem einen Schuss. Vergiss nicht, dass ich hier bin, um zu helfen. Sie haben einen gemeinsamen Abschnitt unten. Vergiss es nicht. Wenn Sie eine Frage haben, stellen Sie bitte Ihre Frage. Ich bin hier, um zu helfen. Ich möchte, dass das einfach für dich ist. Andernfalls gehen wir weiter und beginnen mit diesem nächsten Mini-Projekt, weil hier die Dinge beginnen , ein wenig Spaß zu bekommen. Ich denke, es wird viel lustiger von hier an 27. JavaScript: Hallo und herzlich willkommen zu vielen Projekt Nummer vier. Wir werden einen Tipp Rechner erstellen, und das hat wirklich nur mit Funktionen zu tun. Funktionen sind so wichtig. Ich habe dich in den letzten paar Videos gewarnt, die du Funktionen kennen musst, und ich würde tatsächlich sagen, dass du nur Funktionen trainierst, bis du ihn bekommst. Und so ist dies eine wirklich gute Möglichkeit, eine Funktion zu üben. Also, in diesem vielen Projekt, was ich möchte, dass Sie tun, ist ein einfacher Tipp zu erstellen. Der Rechner sollte zwei Parameter akzeptieren. Ihre 1. 1 sollte der Gesamtbetrag Ihrer Rechnung sein. Sagen wir mal, du gehst in ein Restaurant und deine Rechnung kostet $25. Muss $25 als einen Parameter akzeptieren, und der zweite Parameter ist Ihr Tipp Prozentsatz. Wie viel möchten Sie Trinkgeld geben? Machen Sie diesen zweiten Parameter als Tip Parameter. Machen Sie das optional. Geben Sie ihm einen Standardwert. Es spielt keine Rolle, was Ihr Standardwert ist, wenn Sie denken, dass das Kippen ein Minimum von 15% sein sollte , gehen Sie für 15%. Wenn Sie denken, dass das Umkippen von 15% absurd ist und es niemals höher als fünf sein sollte, machen Sie Ihren Tip Parameter Der Standardwert. Fünf. Schließlich möchte ich, dass Sie den Gesamtbetrag zurückgeben und ihn in einer Variablen speichern und dann vielleicht den Gesamtbetrag auf Ihrer Seite protokollieren . Wie immer werde ich das direkt danach durcharbeiten, aber ich möchte, dass Sie diesem zuerst einen Schuss geben, also zögern Sie nicht, das Video zu pausieren. Gib ihm einen Schuss. Versuchen Sie Ihr Bestes. Wenn Sie stecken bleiben, einfach das Video fortsetzen und Sie können meine Lösung dafür sehen. Alles klar, das ist meine Lösung für den Taschenrechner, also lasst uns weitermachen. Und zuerst müssen wir ein Skript so Skript erstellen. Sie können dies auch in einer externen Datei tun. Wenn du es wolltest. Das erste, was wir tun müssen, ist eine Funktion zu erstellen, die so funktioniert. Nennen wir es einfach Tipp, und es muss zwei Parameter akzeptieren. So ist es ein der Gesamtbetrag der Rechnung tatsächlich passen Gesamtbetrag und ein Tipp Prozentsatz. Dieser Prozentsatz der Spitze sollte optional mit einem Standardwert sein. Sagen wir also 10. Diese 10% werden 10% sein. Und lasst uns einfach hier hineinzoomen, machen das schön und groß auf Lasst uns weitermachen und etwas von dieser Mathematik ausarbeiten. Also der Gesamtbetrag der Spitze wird von unserem Tipp Betrag ist gleich Gesamtbetrag. Times Tipp. Nun, das wird nicht unbedingt funktionieren, weil unser Tipp eine vollständige Nummer ist. Und wenn du also Bill 25 Dollar bist, hast du 25 mal 10 gesagt, das sind $250. Das wird nicht richtig ausgehen. Lassen Sie uns also die variable Spitze überschreiben. Das ist ein Tipp wird sein, was immer es derzeit durch 100 geteilt wird, die uns etwas geben wird wie, weißt du, statt 10 wird 0,10 sein. Und so wird unser Tipp hier jetzt 0,10 sein statt 10 wird 0,10 sein. Und so wird unser Tipp hier jetzt 0,10 sein. wird so sein, als wäre es 25 mal 0,10 genau so. Aber wir tun es stattdessen in der Sprache der Variablen. Das ist also unser Gesamt-Tipp. Und wir könnten, wenn wir nur den Trinkgeld zurückgeben wollen. Wir könnten sagen, Rückkehr Tipp Betrag und wir wären fertig. Was ist, wenn wir den Gesamtbetrag zurückgeben wollen, damit wir nicht wirklich darauf achten, 10% oder 15% oder so etwas zu kippen . Wir wollen nur sicherstellen, dass unsere endgültige Rechnung oder die Funktion eher den endgültigen Rechnungsbetrag angibt . Also, wenn wir eine $25 Rechnung haben und wir 10% gut kippen wollen, müssen wir 10% auf 25 hinzufügen. Also, jetzt haben wir unsere Spitze Menge und wir könnten dio ah, Gesamtbetrag. Wir könnten das sogar überschreiben, weil wir es nicht wieder benutzen werden. Der Gesamtbetrag ist gleich dem Gesamtbetrag plus Ihrem Tipp. Und dann hier drin, lasst uns den Gesamtbetrag machen. Das ist es, was wir zurückkehren werden. Und mal sehen, ob ich Tippfehler habe oder ob ich das falsch gemacht habe. Also lassen Sie uns hier eine Variable erstellen. Also ist es ein var Tipp Betrag. Nein, lassen Sie uns var Gesamtrechnung machen. Wir tun nicht Tipp Betrag wir tun Total Bill ist gleich Tipp. Was ist meine Rechnung? Es sind $25, wie viel will ich? Ein Tipp, Sagen wir 10% und dann Konsul Dot Log Gesamt Rechnung. Lassen Sie uns voran und geben das eine Auffrischung und wir können sehen, dass meine Rechnung 25.1 ist. Das scheint nicht richtig zu sein, oder? Weil 10% von 25 2,5 sind. Also sollte 27,5 sein. Etwas stimmt nicht. Was könnte es sein? Also, jetzt, wie wir uns debuggen, könnten wir Council Dot Log-Tipp Menge ist die Spitze Menge, und dann könnten wir auch dio Rat Dot Log Gesamtbetrag ist der Gesamtbetrag und wir können sehen was hier passiert. Und dann können wir auch wie dieser eine Council Dot Log-Tipp konsul, wie, ah Prozent ist und dann, was auch immer Tipp sein wird, also lasst uns den Seitentipp als Prozent von 0,1 aktualisieren . Aber der Gesamtbetrag ist nicht richtig. Irgendetwas stimmt hier nicht. Warum ist das? Oh, sieh dir das an. Es gab einen Tippfehler, den ich benutzte Tipp und es sollte Trinkgeld sein. Und so gehen wir hin. Wir haben Live-Debugging für Sie. Ich werde nur all diese Ratsprotokolle und Auffrischungsseite loswerden und sehen Sie sich das 27,5 an . Und damit ist das Mini-Projekt abgeschlossen. Jetzt weiß ich, dass in Schritt vier sagt, dass der Gesamtbetrag zurückgegeben und in einer Variablen gespeichert wird. Aber wenn Sie nur den Tipp Betrag zurückgeben wollten, könnten Sie dies auch verlängern. Sie könnten sagen, Return Tip ist nur gleich false. Aber wenn zurückgegeben Tipp nur wahr ist. Also, wenn zurückgegeben Tipp auf, Lee ist gleich wahr. Wir könnten nur den Trinkgeld zurückgeben und dann hier drin könnten wir Nein sagen, lass uns das nicht machen. Gehen wir weiter und kopieren das, denn so ist es in Ordnung. Gesamt-Tipp. Lassen Sie uns das wahr geben. Wir müssen das auch ein totaler Tipp sein, und lasst uns das aussagen. Und dann lassen Sie uns voran und ah ha schauen Sie sich diesen Gesamttipp $2,5 an. Und lassen Sie uns das ungewöhnlich, und wir werden beide im Jahr sehen. Und so, jetzt haben wir, ah, Funktion bedeuten, dass dieser Rückgabe-Tipp nur Teil außerschulisch war, aber wir haben eine Funktion hier, die eines von zwei Dingen zurückgeben kann, entweder die Spitze Betrag oder die gesamte Spitze Menge. auch, Beachten Sieauch,dass ich keine else-Anweisung verwendet habe. Ich habe keine else-Anweisung verwendet, weil ich nicht sagen musste, ob der Tipp auf Lee zurückgegeben wurde , dann nur den Tipp nur sonst zurückgegeben hat, in jedem anderen Fall, nur den Gesamtbetrag zurückgegeben. Das ist genau das gleiche wie sonst. In diesem speziellen Szenario ist es genau das Gleiche. Also da hast du es. Das heißt, viele Projekt Nummer vier Jahr Tipp Rechner alle herausgefunden. Wenn Sie das wirklich schick machen wollten, könnten Sie tatsächlich Ihre Seite nach einem Element abfragen und dort auch eine Reihe von Text ändern . Ihre Seite sieht also so aus, als würde sie etwas tun, anstatt einfach nur irgendetwas hier einzuloggen. Denn im Moment, wenn jemand versuchen würde, dies zu verwenden und Nicht-Entwickler nicht wissen, Zehe, schauen Sie in der Konsole. Und, wie immer, wenn Sie Fragen haben, vergessen Sie nicht, Sie können sie unten lassen. Ich helfe Ihnen jederzeit gerne. Sobald Sie mit diesen vielen Projekten fertig sind, lassen Sie uns über die nächste Lektion gehen und ein wenig mehr über Abfrage lernen. Selektoren 28. Query Selektoren: Ok. Hallo. Ich hoffe, dass die letzten viele Projekt gut verlaufen. Jetzt ist die Zeit, wo wir anfangen, ein paar Fans hier mit unserem Code zu bekommen. Also werden wir anfangen, tatsächlich mit unserer Seite zu interagieren. Bis jetzt haben wir Document Dot Get Element für Idee verwendet, und wir begannen, das i.D. Jedes einzelne Element zu bekommen i.D , was bis jetzt bedeutet, überall HTML ein i d haben muss. Und das ist einfach ehrlich, keine Möglichkeit, dein Leben zu leben. Was ist, wenn Sie nur das kleine Element oder nur einen Link oder nur einen bestimmten Link auswählen möchten ? Was ist, wenn Sie etwas nach seiner Klasse auswählen wollten? Was ist, wenn Sie mehrere Elemente auswählen möchten, die alle etwas gemeinsam haben? Wir können das mit JavaScript tun, bemerken moderneres JavaScript, und Sie werden dies kein älteres JavaScript sehen Und das ist eigentlich OK, weil dies super gut unterstützt wird. Dafür müssen Sie ein wenig über CSS wissen. Also in der Welt von CSS als schnellen kleinen Crashkurs haben Sie, das ist eine Klasse, und dann haben Sie und ich d Deklaration. Und dann haben Sie eine Elementdeklaration und das ist nur darum. Und dann können wir mit den beiden schicker werden. Also mögen wir Klasse und dann ein untergeordnetes Element mit dem I d von I d und dann ein untergeordnetes Element eines Links und schwächen Stil es so. Und so bedeutet dot Klasse Hashtag i d. Und wenn keiner von ihnen präsentiert wird, dann gehen wir davon aus, dass es ein Element ist. Das ist also ein schneller, schneller Crashkurs auf CSS-Selektoren. Das ist am schnellsten. Ich glaube, ich habe es je erklärt. Aber hey, lasst uns nichts über CSS lernen. Lassen Sie uns tatsächlich in ein paar dieser kitty gritty Zeug, weil das wird ziemlich lustig sein . Also haben wir diese neue Sache, die einen Abfrage-Selektor genannt wird. Also lasst uns voran gehen und einen Abfrage-Selektor schreiben und lasst uns einfach den Titel wie zum Vire Titel bekommen und das hier nur ein bisschen größer machen. Fire Titel und wir wollen es durch seine I D bekommen Okay, gut, wir könnten das tun, damit wir Dokumente machen können, nicht Element durch i d Titel erhalten und dann Titel nicht inneren Text ist gleich geändert standardmäßig werde hallo Welt sagen. Dies ist der Titel und es ist gut, ein untergeordnetes Element darin zu haben, ein kleines Element, und es hat mich auch verändert . Wenn wir das aufladen, hat es sich einfach geändert. Okay, also wissen wir, dass das funktioniert, aber wir wollen es nicht durch seine I d bekommen also geben wir uns eine Klasse. Klasse ist gleich Titel und lasst uns voran gehen und diese Idee einfach wegwerfen, weil wir sie so oft und ehrlich benutzt haben , haben nicht viele Elemente Ideen. Also lasst uns voran gehen und versuchen, dies nach seinem Titel oder seiner Klasse namens Titel zu bekommen. Also tun wir es. Abfrageselektor Punkttitel Genau wie es CSS ist. Also werden wir die erste 1 jetzt Abfrageselektoren greifen, nur um die 1. 1 zu greifen. Wenn also ein anderes Element hier mit einem Klassennamen des Titels ist, wird es nur die erste 1 greifen, um zu finden, von oben nach unten zu bewegen. Stellen Sie also sicher, dass jede Klasse, die Sie verwenden, einzigartig ist. In diesem Fall wäre es, ah, eine bessere Übung, ein I d anstelle einer Klasse zu verwenden, aber lasst uns voran gehen und uns einen Schuss geben, der sowieso geändert wurde, indem eine Klasse bam verwendet wird, die mit einer Klasse geändert wurde . Und wenn wir diesen Titel machen, können wir tatsächlich sehen, sobald ich ihn hier eintippe, es wählt den gesamten Knoten aus. Okay, ich muss das gemeinsam haben, weil ich jetzt das kleine auswählen möchte. Wie wähle ich ein Element innerhalb eines Elements aus? Nun, wenn ich wollte, könnte ich weit machen. Klein ist gleich dem Dokumentpunkt-Abfrage-Selektor und geben Sie einfach klein ein und dies wird es erhalten. Dies wird es durch seinen Elementnamen erhalten, so dass wir etwas im Sinne von Online tun können. 21 kleinen Punkt inneren Text ist gleich wow, ich bin winziger Text. Und da ist es, während ich winzige Steuer bin, alle Kappen. Aber es hat die Hello Welt nicht verändert. Das ist der Titel. Es hat gerade diesen hier bekommen. Das ist also ziemlich cool. könnten wir auch tun. Nun, was, wenn irgendwo auf der Straße haben wir eine große Klasse, Vielleicht ist es ah Karte von irgendeiner Art und wir wollen ein bestimmtes Element darin zu bekommen. Also lasst uns einfach so tun, als sei dies viel komplexer und viel größer. Also haben wir eine Klasse namens Titel und wir wollen nur das kleine Element bekommen. Denken Sie daran, Abfrage-Selektor wird das erste kleine erhalten, das es findet. Also lassen Sie uns hier tatsächlich ein Beispiel erstellen. Klein Dieser hier ist der Erste und schaut zu. Ändern Sie mich zu wird sich nicht ändern, aber dieser wird sich zuerst ändern und da ist es. Es wählte das erste kleine. Es wählte nicht die 2. 1 Es bekam gerade die 1. 1 Was, wenn wir dieses bekommen wollten? Nun, momentan haben wir keine Möglichkeit, das zu tun. Wir wissen nicht, wie man die 2. 1 bekommt, also lasst uns voran und schnappen uns nur die 2. 1 Also, was wir hier tun können , ist, lasst uns das kommentieren. Lassen Sie uns einen anderen hier erstellen, der heißt. Wir nennen es auch „Small Virus“. Klein ist gleich, und dann können wir Titel Punkt Abfrage tun, Selektor, klein. Und so, anstatt das gesamte Dokument- oder Dokumentobjektmodell zu erhalten und es durchzuschauen , schauen wir uns nur den Titel in North Ince durch. Alles, was in diesem Titel mit einem Element namens Small ist, packte die 1. 1 dort. Also, jetzt könnten wir einen kleinen Punkt in ihrem Text tun, ist gleich was, was? Was? Was? Wow, und bam. Sieh dir das an. 1. 1 ist unverändert. Die 2. 1 wird geändert. Ehrfürchtig. Jetzt wissen wir, wie man ein Element nach seiner Klasse auswählt, und wir wissen, wie man ein Element auswählt, das ein untergeordnetes Element dieses ursprünglichen Elements ist. In diesem Fall haben wir das untergeordnete Element des H ausgewählt. Okay, ich kommentiere die aus und lass uns weitermachen und nur den Linktext ändern. können wir auch tun. Wir haben das schon gesehen, aber, hey, ein paar weitere Beispiele tun noch nie weh. A für meinen Gastanker ist gleich Dokumenten. Niederländische Abfrage, Selektor A und lassen Sie uns einen Punkt inneren Text tun, ist gleich der Codierung für alle dot com bam Codierung für alle dot com. Also gibt es dieses Beispiel ist, na ja, das ist nur ein Element basierend auf dem tatsächlichen Elementnamen auszuwählen. Keine Klasse, kein I d. Nur der Elementname. Nun, das ist alles gut und gut. Gehen wir weiter und kommentieren diese Ode und auch diese und auch diese. Lassen Sie uns voran und erstellen Sie eine Instanz, in der wir mehrere Klassen auswählen müssen. Also lassen Sie uns eine Nordeste der langweiligen Nordenliste schaffen, die nichts Schickes hier drin ist. Und lasst uns L I Nummer eins Verbündeter machen. Und wo du hingehst, immer und immer wieder. Hier drin habe ich einen Nordeste mit sieben Elementen. Also lasst uns weitermachen. Nummer 1234567 Also haben wir Listenelemente hier drin. Was ist, wenn ich alle diese Listenelemente auswählen möchte? Wie soll ich das machen? Nun, was ich tun könnte, ist, dass hier ein neues Skript-Tag geöffnet wird, und Sie können tatsächlich sehen, dass V-Code versuchen wird, dies für mich automatisch zu vervollständigen. Es ist also du var Verbündete. Ich wünschte, ich könnte es dort Apostroph tun. Aber Verbündete sind gleich Dokumenten. Dann sieht Queary Selector alle, und wir können es genau dasselbe geben. In diesem Fall möchten wir nur ein Element auswählen. Nein, wir werden noch nichts damit machen, aber schauen wir uns mal an und werden echt klein. Und dann lasst uns einfach auffrischen und hat es getan, äh , Alliierten, das wird Ihnen mittlerweile etwas vertraut aussehen. Lasst uns diese größere Trommelrolle machen, bitte. Es ist ein Zettel. Eine Liste. Aber, hey, wenn wir uns das ansehen, sieht das nicht wie ein Array aus? Sobald wir gelernt haben, wie man ein Array durchläuft, können wir lernen, wie man einen Knoten lis ziemlich leicht durchsucht. Und es kommt mit allerlei Sachen hier drin auch. Okay, in unserer Liste der Verbündeten haben wir Index Null bis sechs oder menschlich, eins bis sieben. Nehmen wir die 1. 1 und ändern Sie einfach den Text. Wie würden wir das tun? Weil es ein Array mit einem Index ist. Nun, wir wissen, dass es im Grunde ein Array ist. Sieht aus wie ein Array. Wir könnten uns die 1. 1 holen, da gehen wir. können wir tatsächlich sehen. Es ist in meinem Dokumentobjektmodell hervorgehoben. Und dann könnte ich in ihrem Text tun. Und ich könnte das in alles ändern. Ich will alles, was ich will, und sieh dir das an. Es hat funktioniert. So können wir jetzt alle von diesen ändern. Sagen wir mal, wir wollten Nummer fünf. Nun, welche Nummer ist das? Denken Sie daran, Computer, beginnen Sie mit der Zahl Null zu zählen, nicht Nummer eins. Also wollen wir zurück. Eins dafür. Ausgewählt ist der rechte ein Punkt innere HTML gleich H R. Ja. Hi. Hi. Hi. Hi. Hi. Bam. Jetzt gibt es einen Link in dir. Und tatsächlich, wenn wir mit der rechten Maustaste klicken und überprüfen, wenn Sie sehen, dass wir einen Link zu unserem Dokumentobjektmodell hinzugefügt haben . Das ist ganz neu. Das war im Quellcode nicht da. haben wir dynamisch hinzugefügt. Okay, Okay, das macht alles Spaß und Spiele. Aber was wäre, wenn wir den Wert eines Textfelds oder einer Texteingabe erhalten wollten? Lassen Sie uns also voran und erstellen Sie hier ein neues Beispiel. Mm. Wir werden einen Input erstellen. Ich werde ihm nur eine Art Textstil geben. Machen wir es große Polsterung. 30 Pixel Schriftgröße: 30 Pixel. Also, weißt du, ziemlich groß. Geben wir ihm einen Klassennamen. Etwas, das irgendwie vertraut war. Wenn Sie jemals mit Bootstrap namens Form Control gearbeitet haben. Nun, das wird nicht schön aussehen, aber es wird einen Klassennamen haben. Ok, Cool. Wir haben einen großen Textbereich hier ziemlich einfach. Was, wenn wir diesen Wert bekommen wollen? Nun, geben wir uns einen Standardwert von bei Low World blah, bla, weil es nicht wirklich wichtig ist, was es ist. Wir wollen nur diesen Wert bekommen. Lassen Sie uns voran und erstellen Sie einen Abfrage-Selektor, wo wir tatsächlich diesen Wert erhalten können. Also haben wir hier ein neues Skript, und lassen Sie uns diese Variable Input ist gleich Dokumenten dot queary Selektor, und wir wollen nur die erste 1 auswählen, weil es nur eine in hier Punkt-Formular-Steuerung gibt , wenn das uns unsere 1. 1 Dann Wir könnten Council Dot Log Eingabe und dann einfach den Wert machen. Und das ist nur der Wert des Arztes. Also lassen Sie uns voran und aktualisieren Sie Ihre Seite. Wir können Hallo Welt bla, bla, blasehen bla, bla . Das ist genau das, was hier drin ist. Und wenn wir das zu hi hi ändern, ändert es sich auch dort. Also, als eine kleine Auffrischung von allem, gingen wir einfach rüber, um ein Element nach seinem Titel und nur eines davon zu greifen. Wir verwenden Abfrage-Selektor, und Sie können CSS-Wähler verwenden, wie Sie es normalerweise in CSS tun. Und dann haben wir gerade die innere Steuer geändert. Keine große Sache. Dann sagten wir, eigentlich, lasst uns diese klein bekommen, aber das war die 1. 1 und wir müssen auf der Seite, so dass es nur die erste geändert 1 Dann sagten wir Lassen Sie uns eine andere Variable namens klein erstellen. Aber anstatt das Dokument abzufragen, haben wir nur den Titel abgefragt , den wir hier oben bereits ausgewählt haben. Das ist eine Notiz, die es gibt. Und so gibt es hier einen Titel und wir werden sagen, innerhalb dieses Titels, suchen Sie nach einem kleinen Element und innerhalb dessen hat die innere Steuer zu Wow geändert! Wow! Wow! Wow! Wow! Und dann sagten wir: Hey, Hey, weißt du was? Wir wollen nur einen regelmäßigen Link greifen nur die 1. 1 auf der Seite und ändern Sie den Intertext eine Beschichtung für alle dot com Keine große Sache. Und dann sagten wir, Oh, eigentlich, lasst uns mehrere Elemente greifen. Lassen Sie uns alle Alliierten greifen Es hat ein Array wie Objekt einen Knoten eine Liste genannt, und es packte jeden Verbündeten, alle sieben von ihnen. Und dann waren wir tatsächlich in der Lage, es zu ändern, indem wir nur eins nach dem anderen mit der richtigen Indexnummer auswählen. Und schließlich haben wir hier kein Eingabefeld mit einer Klasse von Formular-Steuerelement, die wir ergreifen. Es gab nur einen, also benutzten wir Abfrageselektor, keinen gruseligen Selektor, alle wie wir es mit den Verbündeten getan haben. Das hat alle sieben gepackt. Dies greift nur die 1. 1, die Sie auf einer Seite finden können, und dann können wir nicht zusammen mit dem Eingabewert. Was auch immer der Wert auf der Seite war, wir konnten das tatsächlich erhalten und die Konsole protokollieren. Jetzt fangen wir an, eine Interaktivität zwischen dem Benutzer und uns aufzubauen. Ihr größter Mitnehmen ist ehrlich gesagt, dieser hierist wahrscheinlich der einfachste. Ihr größter Mitnehmen ist ehrlich gesagt, dieser hier Also, was ich möchte, dass Sie als eine schnelle kleine Aufgabe tun, ein wenig Hausaufgaben geben diesem einen Schuss, eine neue Eingabe erstellen und dann einen Abfrage-Selektor verwenden, um diese Eingabe zu greifen, Vielleicht verwenden Sie eine Klasse verwenden ein I D. Vielleicht Verwenden Sie einfach den Namen der regulären Elemente namens input. Geben Sie ihm einen Standardwert ein, und dann protokollieren Sie diesen Standardwert in der Konsole. Wenn Sie das tun könnten, sind wir gut, in die nächste Lektion zu gehen, weil wir anfangen werden, mit viel mehr Ereignissen zu arbeiten , und hier wird unser JavaScript viel dynamischer und wird viel mehr Spaß. Nicht, dass das überhaupt nicht Spaß gemacht hat, aber wir mussten wirklich viele der Grundlagen durchstehen, um hierher zu kommen. Aber jetzt können wir anfangen, Seiten zu erstellen, die Ereignis-Listener haben. Wir können Ereignisse auslösen, wenn jemand auf eine Schaltfläche klickt oder einen früheren Typ in ein Textfeld einreicht . Also geh weiter, gib uns eine Chance. Vergiss es nicht. Wenn Sie Fragen haben, lassen Sie es unten. Sei niedrig für mich. Ich helfe immer gerne. Andernfalls, wenn Sie Vertrauen in diese Lektion haben, gehen wir über die nächste, wo wir über Ereignisse lernen werden. 29. Einführung in Events: Ereignisse sind, was Javascript wirklich genial macht. Wenn jemand etwas tut, wie ein Textfeld eingeben oder auf etwas klicken, klicken Sie auf eine Schaltfläche scrollen, senden Sie ein Formular. Dies ist, was Javascript wirklich interaktiv macht. Jetzt gibt es wirklich zwei primäre Möglichkeiten, die wir an diesem Wochenende tun können schafft einen Ereignis-Listener, die wir in einem späteren Video zu decken. Oder wir können HTML-basierte Ereignisse erstellen, bei denen wir vorerst bleiben werden, weil es ein schöner Übergang in JavaScript ist . Binden Sie ID-Ereignis-Listener. Also vergiss, dass ich den letzten Teil sogar gesagt habe. Beginnen wir einfach mit einem einfachen Knopf. Also lassen Sie uns voran und erstellen Sie hier eine Schaltfläche. Wir haben einen Knopf. Klassische BBT nbt n primär. Wenn Sie Bootstrap oder so etwas verwenden, wir einfach sicher, dass dies eine normale Schaltfläche ist. Also Typ ist gleich Taste, und dies wird sagen Klicken Sie mich. In Ordnung. Wir haben hier einen langweiligen Knopf. Und wenn ich darauf klicke, ja, es tut nichts, aber was wir tun könnten, ist, dass wir beim Klicken verwenden können. Wenn Sie sich daran erinnern, dies in HTML zu verwenden oder wenn Sie sich daran erinnern, etwas darüber zu lernen, sehen wir es. Dies ist, wo wir auf Klick verwenden werden. Jetzt. Es gibt mehrere andere Veranstaltungen. Es gibt auf Senden auf Klicken so weiter und so weiter und so weiter. Es gibt Tonnen von ihnen. Ich konnte möglicherweise nicht über alle gehen, aber das On Click-Ereignis ist das, das wir verwenden werden, um etwas JavaScript auszulösen. Also lassen Sie uns voran und legen Sie dies auf separate Zeilen. Also, das sieht einfach ein bisschen schöner aus. Und auf Click wollen wir einige JavaScript-Funktion ausführen. Also lassen Sie uns eine Funktion namens Click Me setzen Klammern dort, und wir brauchen auch etwas JavaScript in hier als gut. So Skript-Funktion. Klicken Sie auf mich und das passt zu diesem hier oben, und es wird überhaupt nichts tun, und es wird überhaupt keine Parameter nehmen. Es wird nur Log Cook trösten und das war's. Schön und einfach. Aber sieh dir das an. Ich kann das immer und immer wieder spammen, und es wird immer wieder angeklickt. Und so ist dies wirklich die Basis hinter einem Click-Ereignis ist jedes Mal, wenn jemand auf die Schaltfläche klickt , wird einige JavaScript ausführen, eine Funktion namens Click Me Now, die wir tatsächlich ein wenig schicker mit uns bekommen. Bisher ist die Gesamtzahl der Klicks gleich Null. Lass uns das machen. Die Gesamtzahl der Klicks entspricht der Gesamtzahl der Klicks plus eins. Alternativ, wenn Sie aus anderen Sprachen kommen, könnte es einfacher für Sie sein, Gesamt-Klicks plus plus zu tun, das ist das gleiche, was tut. Plus eins und lassen Sie uns Konsolenpunktprotokoll tun. Sie haben diesen Button geklickt Gesamt Klicks Zeiten und nur so können wir dies auf einer Zeile sehen, so dass es ein wenig schöner aussieht. Sie haben auf diese Schaltfläche Gesamtzahl der Klicks geklickt, so dass Sie zweimal, dreimal, vier Maldarauf geklickt haben dreimal, vier Mal . Lassen Sie uns eine Auffrischung geben. Sie klicken, dass ein Mal zweimal einmal. Ich mag das zweimal dreimal viermal, und es geht weiter und weiter. Und so ist das ein Klick-Ereignis. Und wirklich, worum es bei JavaScript geht, sind Ereignisse, denn warum muss JavaScript ausgeführt werden, wenn jemand kein Ereignis vor sich hat ? Wenn Sie keine Benutzerinteraktion benötigen, benötigen Sie wahrscheinlich überhaupt kein JavaScript. Also lasst uns weitermachen und das ein wenig interessanter machen. Lassen Sie uns einen sehr einfachen Rechner erstellen, der sein wird. Grundsätzlich fügt jemand eine Nummer zwei hinzu, eine Zahl, die bereits existiert. Also lassen Sie uns voran und beginnen das von Grund auf neu. Also haben wir einen Eingang. Feldtyp wird eine Zahl sein. Klasse könnte wie Formularsteuerung sein, weil wir das viel in Bootstrap sehen. Und lasst uns weitermachen und uns ein grundlegendes Styling geben. So Polsterung 30 Pixel, Spaß Größe, 30 Pixel, Farbe, Farbe, blauer Rand, ein Pixel, einfarbig blau. Und das sollte gut genug aussehen. Das ist viel zu groß. Lass uns das machen. Ist das kleine bisschen kleiner. Da gehen wir. Also haben wir hier ein Zahlenfeld. Okay, jetzt brauchen wir einen Knopf. Also lasst uns weitermachen. Erstellen Sie einen Zeilenumbruch und dies auf einer Schaltfläche, um eine Schaltfläche zu erhalten. Jahr-Klasse ist gleich, dass ich Bt nicht kenne und Ian Primary geschlagen wurde. Genau wie in Bootstrap. Wir verwenden keinen Bootstrap, noch nicht. Das wird also nichts tun, aber wir könnten auch stylen, wenn wir wollten. Ich lasse uns nicht 100 hinzufügen, also was auch immer die Zahl in der Zahl ist, wird der Zahl 100 hinzugefügt . Es ist also wirklich ein halber Taschenrechner an diesem Punkt, weil wir nicht zwei Zahlen geben. Wir geben nur einen und sagen: Wir werden 100 hinzufügen. Jetzt machen wir das ein wenig Spender und lassen Sie uns diese Seite tatsächlich etwas anderes machen . Also lasst uns jeden hier reinwerfen. Die Summe ist und dann könnten wir sagen, Spanne. Und was auch immer diese Summe sein wird. So. Derzeit, wenn wir die Seite laden, gibt es keine Summe. Mal sehen, wie das aussieht. Wir hatten hier ein Zahlenfeld, das ziemlich ekelhaft aussieht. Dann können wir 100 hinzufügen und die Summe ist noch nichts. Lassen Sie uns etwas JavaScript hinzufügen, um dieses lustige Skript zu machen. Wir müssen immer 100 hinzufügen, denn das ist wohl, was wir tun. Also sagen wir Vyron, äh ist gleich 100. Es ist nur so, wie dieses Beispiel ausgeführt wird. Als Nächstes. Wir müssen eine Art von On Click-Funktion erstellen, so dass ich auf Click gleich Let's's Calculate nennen und wir setzen, dass auf unsere Schaltfläche. Jetzt könnten wir Funktion berechnen, dass es keine Parameter annehmen wird, weil es automatisch Werte von der Seite abruft. Also, jetzt müssen wir dieses Eingabefeld greifen, das eine Klasse von Formular-Steuerelement hat. Es ist der einzige hier drin, also können wir einfach einen normalen Corey-Selektor anstelle des Abfrage-Selektors machen. Alles so weit, Eingabe ist gleich Dokumente Punkt queary Selektor und durch seine CSS-Klasse unseres Wertes ausgewählt wird Eingangs-Punktwert sein. Aber lassen Sie uns das als Zahl schreiben, stellen Sie sicher, dass es immer eine Zahl ist, und dann könnten wir tun, wissen Sie, wenn Wert. Also, wenn es tatsächlich Nummer ist, werden wir nicht so weit hineinkommen. Ich denke, das wird diese Lektion ein wenig verschmutzen, aber wir könnten auch etwas tun, wie weit Gesamtwert gleich Wert plus 100 ist. Diese 100 existieren bereits in einem sehr mutigen namens taub genau dort. Also, jetzt haben wir einen Gesamtwert und wir müssen diesen Kerl auswählen. Lassen Sie uns also einen Abfrage-Selektor erstellen, um den H zu greifen. Und dann lassen Sie uns einen anderen Karriereselektor erstellen, um die Spanne zu greifen, und wir könnten einfach diese Band auswählen, weil sie die einzige auf der Seite ist. Aber was, wenn es nicht war? Es war nicht der einzige, der auf den Seiten etwas schwieriger sein könnte. Lassen Sie uns var erstellen. Alter eins ist gleich Dokumente Punkt queary Selektor. Wir wissen, dass dies der einzige auf der Seite ist, so können wir einfach einen regelmäßigen Abfrage-Selektor H verwenden und dann könnten wir weit span tun ist gleich H ein Punkt Abfrage-Selektor Spanne. Jetzt, wo wir das drin haben, können wir sagen, verbringen Punkt inneren Text ist gleich, was auch immer die Zahl ist. Also lasst uns den Gesamtwert dort hineinlegen. Und mal sehen, ob Caleb irgendwelche Fehler gemacht hat. Konsolenprotokoll beschwert sich nicht über irgendetwas, was hier eine Nummer eingegeben hat. Lass uns die Nummer neun setzen. Oh, ja, sieh dir das an. Es kann nichts finden, was ich nicht Eigenschaft inter text von Nein setzen kann. Oh, es weiß nicht, wo das zu finden ist. Also jetzt debuggen wir, und das ist auch ein großer Teil der Codierung. Ich bin wirklich froh, dass einige dieser Fehler auftreten, so dass Sie tatsächlich sehen können, wie jemand diese Art von Debugging macht. Also haben wir eine Funktion hier drin und wir wollen dieses h eins greifen. Also lasst uns das einfach schnappen. Und wenn wir H 10 tippen, schauen Sie sich das an. Weil es nicht das einzige Alter auf der Seite ist, was? Nun, wir könnten eins von zwei Dingen tun. Wir könnten dieses loswerden, oder wir könnten es auf Javascript-Weise tun und wir könnten Abfrage, Selektor, alles tun , aber weil dies zurückkehrt und ein Regen, wissen wir alles über die Indizierung, und wir wissen, dass es mindestens zwei H da drin. Wir wollen die 2. 1 Schnappen Sie sich einfach ein, denn denken Sie daran, Computer, fangen Sie an, bei Null zu zählen, nicht die Nummer eins. Versuchen wir es noch einmal. Das ist einfach loswerden. Und lasst uns die neun Nummer 23 setzen. Oh, sieh dir das an. Und jetzt haben wir etwas von einem Taschenrechner, so dass wir jede Zahl, die ich will, hier reinsetzen können. Und es wird nur 100 hinzufügen. Was ist, wenn ich nichts drin habe? Nichts. Okay, was ist, wenn ich versuchte, den Namen Caleb zu nennen? Oh, es ist ein Zahlenfeld, also HTML erlaubt mir nicht, Zahlen zu setzen, sind Buchstaben. Es will nur Zahlen so cool. Das ist ein bisschen Sicherheit dort. Also lasst uns 01 Was passiert da? Es ist immer noch 101 Und jetzt haben wir an diesem Punkt einen funktionierenden Rechner-Prototyp. Im Konsolenprotokoll ist nichts enthalten. Wir machen alles auf der aktuellen Seite und jetzt werden unsere Seiten viel dynamischer. Dies ist, wo es viel wird, nicht lustiger, weil Sie tatsächlich sehen können, dass Ihre Fortschritte zu dieser Zeit jetzt gehen zurück zu unserer Funktion. Wir geben eigentlich nichts zurück, was wir könnten, aber weil es ein Ereignis-Listener ist, muss es nichts zurückgeben. Es muss nur eine Reihe von Code ausgeführt werden. Und das haben wir getan. Wir sagten, Hey, führen Sie diese sechs Codezeilen aus, aber, wissen Sie, wickeln Sie es in einen Namen namens Calculates, dass wir hier einfach berechnen eingeben können. Also wirklich, wir verpackten es in einer schönen Amazon-Box, und wir sagten, Hey, diese Box hat einen Aufkleber namens Berechnen, und innerhalb dieser Box sind sechs Befehle. Wenn Sie dieses Feld öffnen, das Berechnungsfeld gibt es sechs Befehle in ihren sechs Elementen, und so ist das die Grundlage für JavaScript-Ereignisse. Jetzt gibt es viel mehr JavaScript, wie Sie dies tun, ein Ereignis-Listener genannt. Aber das ist ein sehr guter Segway in das Jetzt, was ich möchte, dass Sie tun, ist, das auszuprobieren. Erstellen Sie ein On Click-Ereignis, das eine Funktion erneut verwendet. Es muss nicht super kompliziert sein. Haben Sie das Gefühl, dass Sie niemanden damit beeindrucken müssen. Es muss nur etwas tun, alles. Es könnte sogar Konsolenprotokoll protokollieren, wenn Sie es wollten. Wenn Sie auf dem Weg stecken bleiben Hey, es gibt einen gemeinsamen Abschnitt unten. Vergiss nicht, ich bin hier, um dir zu helfen. Und wenn du dich ziemlich sicher fühlst, dass du diesen Down Pat hast, lass uns zu einem größeren Projekt übergehen. 30. JavaScript Projekt: Ok. Hallo und willkommen zu Ihrem ersten großen ish Projekt. Wir haben bis jetzt eine Reihe von Projekten durchgeführt, und an diesem Punkt werden wir an einem größeren Projekt arbeiten. Also einen Punkt haben wir tatsächlich an einem Tipprechner gearbeitet, und wir haben gerade das Javascript dafür geschrieben, aber wir haben nicht wirklich das Frontend geschrieben, was ein wichtiger Aspekt von JavaScript ist. In diesem Projekt werden wir also einen Tipprechner erstellen und tatsächlich die Summen im Dokumentobjektmodell im eigentlichen Browser anzeigen. Es gibt also ein paar Dinge, die ich Ihnen gerne machen möchte. Zuallererst müssen Sie einen Rechnungsbetrag haben, wie viel das auch sein wird. Wir brauchen ein Eingabefeld, um den Wert dieser Zahl zu erfassen, wir brauchen einen Tipp Prozent, und dann werden wir eine Art von Ereignis brauchen. Also, wenn wir auf berechnen, Tipp und Gesamtrechnung klicken , wird es tatsächlich diese Zahlen funktionieren, und dann wird es uns sagen, wie viel wir Trinkgeld sollten und wie viel die Gesamtrechnung mit dem Tipp sein wird . Dazu werden wir das On Click-Ereignis auf der Schaltfläche verwenden und dann werden wir auch ein paar Abfrageselektoren verwenden, um diese Werte zu erfassen, also sollte es ein Calculate-Ereignis und auf Klick-Ereignisse geben. Also, wenn Sie auf diese Schaltfläche klicken, berechnet es die Gesamtspitze und Gesamtrechnung mit der Spitze darüber. Es soll die Zahlen zu greifen, was auch immer Zahlen sind hier zu der Zeit, wenn Sie auf die Schaltfläche klicken und dann wird es den Gesamt-Tip-Betrag und den Gesamt-Tip-Betrag mit der Rechnung oben darauf angezeigt. Nun, wie Sie sehen können, habe ich bereits einige von ah, das Layout hier eingebaut. Ich benutze nur normale Bootstraps, also ist nichts Lust vor sich, und wir werden ein Vanille-Javascript verwenden, um dies zu erledigen. Jetzt werden Sie eine Funktion Ah und Ereignis und eine Reihe von Abfrage-Selektoren verwenden. Nun, ich möchte, dass Sie das selbst eine Chance geben. Sehen Sie, ob Sie das selbst herausfinden können. Zu diesem Zeitpunkt können Sie das Video direkt hier pausieren und es einen Schuss geben. Es sollte nicht länger als vielleicht 15 oder 20 Minuten dauern. Und hey, weißt du was? Wenn Sie stecken bleiben, einfach das Video fortsetzen und ich werde Ihnen genau zeigen, wie ich über die Lösung gehe. In Ordnung, lassen Sie uns einen Blick darauf werfen, wie ich einen Tipp Rechner erstellen würde, um Felder und eine Schaltfläche einzugeben . Also lassen Sie uns durch meine ich zuerst den HTML gehen, nur damit Sie irgendwie wissen, was ich hier drin arbeite . Ich habe ein Etikett für den Rechnungsbetrag und ich d für den Rechnungsbetrag, und das ist nur die reguläre Gesamtrechnung. Wir werden eine Nummer da reinlegen. Zum Beispiel 25 99. Was auch immer das Essen kosten wird, sagen wir, Sie sind in einem Restaurant in Kosten 25 99. Dies ist der Rechnungsbetrag, also werde ich ein I D verwenden aber Sie können eine Klasse verwenden, wenn Sie möchten. Du könntest alles andere gebrauchen. Egal, wie Sie dieses Element auswählen möchten, das liegt an Ihnen. Aber ich werde ein I D benutzen, weil es der einzige ist, der auf dieser Seite sein wird. Ich habe im Grunde dasselbe mit einem Tipp gemacht. Betrag zu selektiven Betrag wird ein Prozentsatz hat ein I D. Wir können sehen, dass hier die Ideen, Tipp Betrag und der Platzhalter AII wie neun oder 9% ist und wir werden, dass 9% nehmen und es in eine Dezimalzahl verwandeln müssen . Und dann haben wir hier einen Knopf. Also haben wir,wissen Sie, wissen Sie, etwas mehr Formatierung hier, aber in erster Linie haben wir eine Schaltfläche, auf der „Tipp berechnen“ und „Gesamtrechnung“ steht. Und schließlich haben wir eine Reihe, die wir noch nicht sehen können, und ich werde tatsächlich diese 123 und dann 456 demonstrieren. Und hier ist, wo wir die Spitze Menge und die Summe mit dem Tipp anzeigen , also nur weil ich keine Werte in ihrem sieht es aus, als wäre es derzeit unsichtbar. Also, wenn dies berechnet wird, werden wir diese Dibs mit irgendeiner Art von Text oder HTML darin füllen. Lasst uns weitermachen und das loslegen. Lassen Sie uns diese Rückwärtsbewegung sezieren. Wir wollen diese Form, wenn es eigentlich nicht wirklich eine Form ist. Es ist ein Ereignis. Es benutzt kein Formular. Elemente übermittelten kein Formular. Wir brauchen ein Ereignis auf dem Knopf. Also, wenn jemand auf diese Schaltfläche klickt, muss er zuerst etwas tun. Dinge zuerst ist, dass wir auf unsere Schaltfläche gehen und wir auf Klick verwenden, und dann müssen wir ihm einen Funktionsnamen geben. Also lassen Sie uns ihm, ah, Funktion, Ziel der Berechnung geben. Und an diesem Punkt beginnt das Projekt wirklich, uns zu leiten. Also haben wir berechnet, dass sie das nicht nur ein wenig größer machen. Hier haben wir eine Funktion hier namens Berechnen, und jetzt müssen wir hier ein Skript hinzufügen, und wir müssen eine Funktion namens Calculate erstellen. Jetzt wissen wir noch nicht, was das dauern wird, aber wir wissen, dass wir eine Funktion namens Calculate haben und sie existieren muss. Also gehen wir weiter in ein Konsolenprotokoll geklickt. Und wenn ich die Seite aktualisiere und meine Inspektionswerkzeuge hier im Rat öffne, und lasst uns das einfach vergrößern, klicken Sie hier klicken, klicken Sie, klicken Sie, klicken Sie auf, klicken Sie wie OK, gut. Das Click-Ereignis ist, dass wir arbeiten. Als Nächstes. Wir müssen in der Lage sein, den gesamten Rechnungsbetrag und den Gesamtbetrag der Trinkgeld zu erfassen. Wie sollen wir diese Elemente packen? Nun, wir wissen, dass diese Elemente Eingaben sind, also müssen wir den Wert von ihnen greifen. Derzeit gibt es keinen Wert darin, aber wenn wir tippen, könnte es einen Wert geben. Lassen Sie uns also voran und erstellen Sie einen Abfrage-Selektor für jeden. Es wurde eine Variable für den Rechnungsbetrag erstellt und das wird Dokumente Punkt Nein sein, wir werden nicht Kritik-Selektor verwenden Wir werden get Element von i d und was war das? Wir haben Rechnungsbetrag und Tipp Betrag fühlen Menge und wir haben das gleiche hier unten. Tipp Menge. Das ist in der Nähe des unteren Südens. Irgendwie schwer zu sehen. Dies sind nur die Knoten, diese Luft, die HTML-Elemente. Dies ist nicht der tatsächliche Wert. So könnten wir an dieser Stelle etwas wie Punktwert tun. Oder wir könnten diese in neue Variablen setzen oder die vorhandenen Variablen mit etwas wie Tipp Betrag ist gleich der Spitze Betrag dieser Wert überschreiben . Und das habe ich nicht richtig geschrieben, denn das ist technisch eine andere Variable. Da gehen wir. Also könnten wir es hier auf zwei Arten tun. Ich werde beide nur als Beispiel hier drin lassen. Nun, dieser Punkt, wir wissen nicht, ob eine dieser Zahlen ist, also müssen wir damit arbeiten. Ein bisschen und lasst uns voran gehen und diese als Zahlen werfen. Nehmen wir an, Bill Betrag ist gleich dem Rechnungsbetrag, und hier wollen wir uns nur als eine Zahl werfen und wir wollen das Gleiche mit dem Tipp Betrag zu tun . Aber wir könnten es hier drinnen sogar so machen. Und in der Tat könnten wir es sogar so machen. Also jetzt gehen wir voran und Konsolenprotokoll. Liza Anzug Rat. Ich dachte, Log Rechnung Betrag und die Spitze Betrag. Und so, wenn ich die Seite aktualisieren und ich eine Zahl in hier, sagen wir, 12 ist die 1. 1 und 34 ist die 2. 1 Wir sehen 12 und 34. Wir wissen also, dass diese funktionieren. Und wenn wir die Art der einzelnen Konsole protokollieren würden, würden wir wissen, dass sie eine Zahl sein würden. Also können wir jetzt entsprechende Mathematik mit ihnen machen. Wir müssen uns keine Sorgen darüber machen, dass Katyn essen kann? Es ist so, dass die Gesamtzahl sich herausstellt 1234 Wir wissen, dass, wenn wir diese zusammen hinzufügen würden, es wäre 46 statt 1234 Also es ist eine tatsächliche Ausgabe und nicht genommen Captain ation, und wir stellen sicher, dass das der Fall ist, indem wir eine Nummer verwenden. Nein, der Tipp Betrag ist derzeit eine Zahl. Der Tipp Betrag ist standardmäßig. Nun, standardmäßig sind es neun. Aber im Moment habe ich 34 angezeigt, so Standard ist neun als Platzhaltertext. Es ist nicht das, was der eigentliche Standard ist, aber es sagt, dass Sie ein Beispiel kennen. Neun. Wir müssen das in eine Dezimalstelle verwandeln, also gehen wir weiter und ändern uns. Die Spitze Betrag ist gleich der Spitze Menge geteilt durch 100, so dass nur ändert neun. Also sagen wir, neun wird in 0.9 verwandeln Das ist im Grunde alles, was es wird dio. Und jetzt, an diesem Punkt, müssen wir einen Gesamttippbetrag erstellen. Also habe ich einige ziemlich schlechte Namenskonventionen hier drin, weil ich nur das ganze Trinkgeld nenne . Vielleicht möchten Sie Ihren umbenennen, so dass er etwas ausführlicher, etwas diskreter ist, damit Sie immer wissen, womit Sie arbeiten. Ich werde nur Trinkgeld hier verwenden, und ich werde eine neue Variable namens Gesamt-Tipp unseres Gesamt-Tipps erstellen, ist gleich dem Rechnungsbetrag Zeiten, dem Tipp Betrag und das war's. Und zu diesem Zeitpunkt, wenn ich die Seite speichere und aktualisiere, gibt es hier keine Fehler. Und ich weiß, dass ich das jetzt auswählen und den Gesamttipp dort reinlegen kann. Also lasst uns weitermachen und das tun. Lasst uns Dokumente machen. Selektor nicht abfragen. Wir wollen den Tipp Betrag verwenden. CSS-Selektor Punkt inter html. Wir tun dies normalerweise in ein paar verschiedenen Schritten, aber in diesem Fall werden wir alles nur in einer Zeile tun. Und dass Inter HTML einfach der totale Tipp sein wird, den wir inneres HTML oder mit Verwendung verwenden könnten . Inter Texte verwendeten kein HTML, daher sollten wir wahrscheinlich Intertext verwenden. Aber vielleicht wollen wir das etwas später aufpeppen. Okay, also setze ich mal 50 und 10 ein. Und wenn das funktioniert aus der Gesamtspitze Betrag sollte fünf sein und jeder sagt fünf genau dort. Es ist ein bisschen klein. Wir werden das größer machen und in der Tat, weil es HTML ist, könnten wir sagen, HD männlich, total tip und dann hier drin konnten wir ein kleines Element in Katyn all das gegessen. Und in der Tat, was ich tun möchte, ist, das auf neue Linien aufzuteilen. Also lassen Sie uns var tip html tun, und das hält es einfach schön und sauber, indem Sie es auf zwei Zeilen setzen. Und so schloss ich das kleine Tag und das H drei Tag, und dann setze ich Tipp-HTML auf und lass uns das erneut ausführen. Also wieder, lassen Sie uns etwas wie 100 setzen eine Gesamtspitze von 25%. Wir wissen also, dass 25 von 100 25 über den Gesamttipp 25 sein wird. Wir könnten dort ein Dollarzeichen setzen, wenn du weißt, dass du mit Dollar arbeitest und etwas, das wir nicht gelernt haben. Aber, weißt du, könnte eine Art Spaß machen, mit dem zu arbeiten. Wenn Sie Dezimalstellen dort drin wollen, könnten Sie zwei fixieren und das Stellen Sie einfach sicher, dass es immer zwei Dezimalstellen gibt, also lasst uns voran gehen und aktualisieren und diesem einen Schuss geben. 125 und das wird sagen 25.0 Also erwarte ich nicht, dass Sie wissen, die Dinge zu beheben, aber , hey, das ist ein cooler kleiner Trick, und ich werfe gerne diese kleinen Tricks und Tipps in diese Projekt-Lösungen. Irgendwie macht Sie mit einigen der verschiedenen Möglichkeiten vertraut. Wir können Dinge in JavaScript tun, ohne notwendigerweise eine ganze Lektion zu brauchen. Also haben wir unsere totale Tep. Jetzt brauchen wir die gesamten Rechnungsbeträge. Lassen Sie uns var Gesamtbetrag Rechnungsbetrag tun, und alles, was wir hier tun möchten, ist die Gesamtspitze hinzuzufügen, die wir bereits auf den Rechnungsbetrag berechnet haben. Das ist der reguläre Rechnungsbetrag. Und lassen Sie uns diese Zeile hier kopieren, weil wir uns nicht zu sehr ändern werden. Also Tipp HD Mail wird sein. Es ist eine Rechnung html Gesamtrechnung mit Tipp, und wir werden diese ändern müssen, um den Gesamtbetrag der Rechnung entsprechen. Und so passt diese Variable jetzt sehr. Aber lassen Sie uns das auch auf separate Zeilen setzen. Lass uns das machen. Machen Sie es schön und leicht zu lesen. Und dann, zuletzt, müssen wir nur unser Notizelement von den HD-Männchen greifen. Wir müssen eine Abfrage Selektoren von Dokument Punkt Abfrage Selektor verwenden. Wir wollen nicht den Tipp Betrag, den wir wollen, um die Summe mit gekippt. Wenn so total mit Tipp und wir könnten innere tun. HTML ist gleich Bill HTML. Lass uns weitermachen und uns auffrischen und lass uns eine Chance geben. Lassen Sie uns einige grundlegende Zahlen machen, damit wir wissen, dass dies immer funktionieren wird. Also haben wir eine Rechnung von $100 in einem Tipp von $25,25 Prozent, nicht $25 von 125% von den Hunderten, die 25 sein werden. Also sollte der Tipp Betrag 25 und dann die Gesamt-Rechnungsbetrag sagen. Angenommen, wir haben alles richtig gemacht, werden $125 und Boom sein. Genau so haben wir insgesamt Tipp $25 Gesamtrechnung mit dem Tipp $125. Und lasst uns voran gehen und etwas ein wenig verrückter machen, denn Rechnungen sind in der Regel nicht nur $100 sagen wir 87 Punkt 43, also ist er $7,43 und Trinkgeld als Prozentsatz. Also vielleicht geben Sie im Allgemeinen gerne 15% und Sie wollen nicht herausfinden, dass Mathematik in Ihrem Kopf Also Sie einfach klicken, berechnen Tipp und Gesamtrechnung und es sagt Ihnen, dass zu Ihrem neuen Tipp wird 13 sein. 11 und Ihre Gesamtrechnung wird $100,54 sein. Also, da gehst du hin. Das ist ein Taschenrechner Projekt. Es ist das Tip Calculator Projekt ist ein größeres Projekt, und wir verwenden ein wenig mehr Funktionalität innerhalb des Dokumentobjektmodells. Also verwenden wir tatsächlich Eingabewerte, die es tatsächlich mit einer Funktion berechnen. Wir geben eigentlich nicht einmal etwas zurück, weil dies mehr mit Ereignissen zu tun hat und Daten nicht wirklich als Variable zu speichern. Wir müssen gar nichts zurückgeben. Aber wenn wir wollten, nur für eine gute Maßnahme, könnten wir immer den gesamten Rechnungsbetrag wie folgt zurückgeben. Oder wenn wir das in ein Array setzen wollten, könnten wir sagen, Ah, Ah, der Gesamt-Tip-Betrag, der Gesamt-Tip-Betrag Komma der Gesamt-Rechnungsbetrag. Ich weiß, dass wir Zugriff auf diese Funktion in der Browserkonsole haben, so dass wir ausführen, berechnen können , und es wird nur die Zahlen von unserer Seite automatisch zu greifen und wird ein Array mit dem Tipp Betrag und dem Rechnungsbetrag zurückgeben , der Gesamtspitze in der Gesamtrechnung. Also lasst uns weitermachen und uns eine Erfrischung geben. Und lasst uns das machen. Nehmen wir an, 92,67 und die Gesamtspitze wird acht sein. Und hier können wir sagen, dass Summen berechnet werden und es braucht keine Parameter. Die erforderlichen Parameter werden automatisch aus den Eingabefeldern des Dokumentobjektmodells abgerufen. Und sieh dir das an. Es ändert sich automatisch unsere Seite. Außerdem gibt es auch den Gesamt-Tip-Betrag plus die Gesamtrechnung mit der Spitze zurück, obwohl es aussieht, als hätte es Strings zurückgegeben. Also, wenn du es wolltest, könntest du das tatsächlich in eine Zahl umwandeln. Aber, äh, das ist alles, was es für den Taschenrechner gibt. Ich hoffe, du hast etwas wirklich Cooles gelernt. Und wie immer, wenn Sie Fragen, Bedenken, Kommentare haben Bedenken, , können Sie sie immer unten lassen. Vergessen Sie nicht, Sie können immer Ihren ganzen Code nehmen. Sie können einen Screenshot Ihres Codes machen, wie ich. Ich habe meinen Redakteur hier, und dann habe ich mein Endprodukt hier. Sie können einen Screenshot davon machen und diesen als Ihr Projekt teilen. Oder Sie können es in Code-Stift werfen. Wenn Sie das besser mögen und Sie können Ihren Codestift teilen. Du bist Ellen. Ich kann auch einen Blick auf den tatsächlichen Code und die Funktionalität davon für Sie werfen. 31. Anonyme Funktionen: schon. Werfen wir einen Blick auf anonyme Funktionen, bevor wir das tun. Ich hoffe, dass das letzte Projekt gut gelaufen ist, wo Sie einen Full Tip Calculator von Grund auf neu erstellt haben und irgendwie von diesem in einige mehr funktionsbasierte Sachen übergehen . Diese werden also ein wenig mehr JavaScript-e Dinge, bei denen eine Idee wie eine anonyme Funktion nicht in jeder einzelnen Programmiersprache existiert. Aber es ist definitiv eine sehr häufige Sache in der Welt von JavaScript. Wenn es um eine Funktion geht, haben wir Schlüsselwortfunktion, was auch immer Ihr Funktionsname sein wird. Paramieren Sie einen Parameter auf eine Reihe von Sachen. Bringen Sie hier etwas zurück. Das ist deine Grundfunktion. Ich werde weitermachen, das kommentieren und uns ansehen, wie eine anonyme Funktion aussieht. Eine anonyme Funktion ist also eine Funktion ohne Namen, und dies wird ein wenig mehr in das Scoping, über das wir ein wenig auf der Straße sprechen werden. Scoping ist im Grunde, wo Variablen verwendet werden können oder wo Funktionen verwendet werden können . Aber darüber reden wir auf der Straße. Sie müssen sich jetzt keine Sorgen darüber machen. Werfen wir einen Blick auf eine anonyme Funktion, so dass anonyme Funktion in einer Variablen gespeichert werden könnte , so haben wir Variable get name. Und dann, anstatt einen Funktionsnamen zu erstellen, geben wir diesem einfach eine reguläre Funktionsfunktion, und dann könnten wir ihm einen Parameter geben, wenn wir wollen. Aber wir werden nicht an dieser Stelle und dann, wie eine normale Funktion, könnten wir hier etwas zurückgeben. So zum Beispiel könnte ich zum Beispielmeinen Namen Caleb schleppen zurückgeben. Und als ich das in meinem Browser geöffnet habe, wenn ich den Namen „Oh“ tippe, ist es eine Funktion. Sieh dir das an. Es ist keine Variable in. Wenn ich Art von get name, werden wir sehen, es ist eine Funktion. Also, wie bekommen wir das jetzt eigentlich? Es sieht also wie eine Funktion aus. Grundsätzlich speichern wir nur, um in einer Variablen zu funktionieren. Damit das funktioniert, müssen wir Klammern hinzufügen, da es sich um eine Funktion und keine Variable handelt . Es wird nur so benannt, als ob es eine Variable ist. Also benutzen wir „get name“ mit den Klammern hier, machen das ein wenig größer, und du wirst sehen, wie Caleb erzählt. Wir können dies auch in einer anderen Variablen speichern . Das ist also ein variabler. Das nennen wir es variabel eins, weil ich so kreativ bin. Und dann könnte ich Rat machen. Lasst uns eine Warnung machen. Feuern Sie eins. Da ist es, Caleb erzählt. Und so ist das wirklich alles, was es für eine anonyme Funktion gibt. Nun, zu diesem Zeitpunkt denkst du wahrscheinlich, , warum sollte ich das jemals brauchen, wenn ich eine reguläre Funktion schreiben könnte? Nun, eine anonyme Funktion ist im Grunde, wenn Sie eine Reihe von Logik oder wirklich irgendeine Logik haben, die Sie nur einmal ausführen möchten, muss sie nicht unbedingt in eine Funktion gehen. Funktionen sollen immer und immer wieder verwendet werden. Aber wenn Sie einen Gruppencode haben, in dem Sie eine Art Logik ausführen, oder vielleicht erhalten Sie einen Wert aus dem Dokumentobjektmodell aus Ihrem HTML und Sie erhalten ihn nur einmal. Nun, dann ist es vielleicht eine anonyme Funktion, eine Funktion, die nur einmal ausgeführt werden sollte, eine gute Idee. Und lassen Sie uns hier ein solides Beispiel geben. Also habe ich bereits Bootstrap hier drin, und was ich tun werde, ist nur ein einfaches Bootstrap-Layout einzurichten. Okay, also hier habe ich eine Containerreihe. Nennen Sie ihn keine große Sache. Wir haben einen Eingabetext, der eine Formular-Steuerklasse und eine benutzerdefinierte hat hier Js Custom Name genannt . Das ist diejenige, die wir hier benutzen wollen. Also, in unserer anonymen Funktion, was wir tun können, ist das Zurückgeben des Dokumentpunkt-Abfrage-Selektors unseren Abfrage-Selektor dort, don value. Und jetzt wird der Name sein, was wir sagen. Also, wenn ich Ihre Seite hier aktualisiere, haben wir eine Eingabe. Es ist eigentlich die ganz oben auf der Seite war irgendwie schwer zu sehen, aber wenn ich John Smith sage und dann führe ich Namen? Mein Name ist John Smith. Also, jetzt könnte ich es sagen. Jetzt könnten wir uns in alles verwandeln, Caleb Colleen. Und hier unten könnte ich wieder Namen bekommen, genau wie eine normale Funktion. Oder ich könnte dies im Namen speichern, damit ich sagen könnte, Name ist gleich Namen zu bekommen. Und jetzt Name wird immer Name sein. Egal, wie oft ich mich ändere. Also, wenn ich ändern ist zurück zu John Smith und ich tippe einen Namen, es bleibt als Caleb sagen, weil wir den ursprünglichen Namen bekommen und dann haben wir als Variable angefangen . Jetzt ist die große Sache hier, wenn Sie eine anonyme Funktion verwenden , sollten Sie wirklich nur versuchen, sie zu verwenden, wenn Sie eine oder zwei oder drei oder vielleicht mehr Codezeilen haben , und alles sollte nur in eine reguläre Variable. Anstatt dies als Variable zu speichern, können wir also get name als Funktion verwenden, als wäre es eine Variable. Also gehen wir voran und machen Rat Punktprotokoll. Hallo, mein Name ist und das kann Katze hier als Funktion nicht als Variable Namen bekommen. Und da steht: Hi, Hi, mein Name ist John Smith. Und wenn ich das in Caleb Tallinn umwandle und ich es erneut mache, wird sich genau das Gleiche ändern. Es wird sagen, hallo, mein Name ist Caleb ruft an. Und so gibt es einen Anwendungsfall dafür. Wir werden jetzt nicht zu viel in das kommen, aber auf der Straße, werden Sie eine Menge davon in fortgeschrittenem Javascript sehen. Und dann, wenn wir das tatsächlich automatisch laufen lassen wollten, also müssen wir das nicht jedes Mal ausführen. Wir können es einfach ausführen, sobald die Seite geladen wird. Wir können dies in Klammern an zwei weitere Klammern am Ende und ein Semikolon umschließen , und das ist, was wir eine sofort aufgerufene Funktion nennen. Und ich f e Wir werden in der nächsten Lektion mehr darüber reden, aber im Grunde wird das sofort laufen. Also, wenn ich die Seite hier aktualisiere und ich gebe den Namen nicht als Funktion, sondern als Variable, können wir sehen, dass bereits ausgeführt wurde, da ist nichts drin. Gehen wir also voran und ändern Sie diesen Standardwert. Lass uns Kylo Ren machen. So Standardwert hier ist kylo ren, und wenn ich dieses und Typ loswerde, erhalten Sie Namen es sagt Kylo Ren. So haben wir jetzt eine Funktion, die automatisch nur einmal ausgeführt wird und sie als Variablennamen namens Get Name speichert . Und so verwenden wir sofort aufgerufene Funktionen wieder. Wir werden in der nächsten Lektion mehr darüber reden, also werde ich das für deine Aufgabe rückgängig machen. In dieser Lektion gibt es tatsächlich keine Aufgabe. Ich behalte das wieder da, das ist nur etwas, das wirklich gut zu wissen ist. Du wirst das noch viel mehr auf der Straße sehen. Wenn Sie anfangen, in das JavaScript-Wild zu kommen, werden Sie diese viel öfter verwenden, aber im Wesentlichen funktioniert es genauso wie eine Funktion, so dass Sie einen Parameter übergeben können wenn Sie möchten, und dann könnten Sie es so nennen, als ob es eine reguläre Funktion wäre. 32. IIFE: Okay, schauen wir uns an, was eine sofort aufgerufene Funktion genannt wird. Grundsätzlich ist dies eine Funktion, die sofort ausgeführt wird. Also in freier Wildbahn, in regulärem JavaScript, werden wir eine reguläre Funktion sehen, die ungefähr so aussieht. Wir haben ein reguläres Funktionsschlüsselwort als den Funktionsnamen, vielleicht ein paar Parameter, und es gibt etwas zurück. Wir wissen nicht, was zurückkehren wird. Du könntest im Grunde alles zurückgeben. Dann, um diese Funktion auszuführen, müssen wir immer etwas wie diesen Funktionsnamen in den ersten Parameter setzen, in den zweiten Parameter setzen und vielleicht beginnen, wie Sie wissen, eine Variable irgendeiner Art, und , die ihn automatisch in der letzten Lektion ausführt. Was wir uns angeschaut haben, war etwas ein bisschen anders, eine anonyme Funktion, und wir sind irgendwie in und ich f e und sofort aufgerufene Funktion Expression ist eigentlich was es heißt, um mich das ausschreiben zu lassen. Ich habe gesagt, ich i f e, aber ich habe nicht das Ganze gesagt, also i f e ist gleich und sofort Funktionsausdruck aufgerufen. Und so sind dies im Grunde nur Funktionen, die automatisch ausgeführt werden. Und wenn wir das tun, werden wir sehen, dass das tatsächlich funktioniert. Also lasst uns voran gehen und erfrischen. Ich habe einen Standardwert in meinem Eingabefeld, weil das der Dokumentcurry-Selektor Js doc Custom Name greift und den Wert zurückgibt. Also habe ich den Standardwert von kylo ren und wenn ich aktualisiere sieht so aus, als ob nichts passiert. Aber wenn Sie get Name verwenden, zeigt seine kylo ren, so eine sofort aufgerufene Funktion zu erstellen. Grundsätzlich tun wir nur, dass wir eine Funktion übernehmen. Wir machen das zuerst. Diese ist eine anonyme Funktion, also setzen wir einfach eine öffnende Klammer an die beginnende schließende Klammer am Ende und dann eine Reihe von Klammern oder Klammern, eher eine Reihe von Klammern am Ende. Und das sagt Javascript. Hey, sobald du diese Funktion siehst, führe sie aus. Und so tut es das auch. Und so nein, wir können einfach get name anstelle dessen verwenden, was wir mit der regulären Funktion zu tun hätten , die get name als Funktion ist. Sie können tatsächlich sehen, dass es eine ungefangene Art Luft hier sagt, get name ist keine Funktion ist es nicht. Früher war es eine Funktion, aber es gab tatsächlich den Wert hier automatisch zurück. Also jetzt get name ist eigentlich nur eine Variable mit einem Wert darin. So verwandeln wir eine anonyme Funktion in einen sofort aufgerufenen Funktionsausdruck. Wenn wir eine reguläre Funktion wollten, lassen Sie uns das nicht tun. Lasst uns hier eine Notiz machen. Eigentlich, dass dies ein I fi mit einer Nana Miss Funktion ist. Wenn wir eine neue Funktion erstellen wollten, die automatisch ausgeführt wird, könnte buchstäblich alles tun, könnten wir einfach eine Funktion wie diese erstellen. Geben Sie ihm einen Namen. Also lassen Sie uns sagen, laden Sie App. Das wird unser Name sein. Und hier wird sagen, Konsul Dot Log-App wird geladen. Es wird eine Art Logik hier drin geben. Vielleicht wollte deine Seite etwas tun. Vielleicht gibt es eine Animation. Vielleicht musst du auf etwas warten. Und dann am Ende könnte man sagen, Council Dot Log AP ist geladen. Nun, Moment ist das eine reguläre Funktion, also wird das nichts tun. Wenn wir die Seite laden, werden wir sehen, dass keines dieser Konsul Logs auftaucht und mich davor fürchten lassen . Und wenn ich dich aktualisiere, taucht nichts davon auf. Ich werde eigentlich Last-App als Funktion für diese Zehenarbeit ausführen müssen. Aber was ist, wenn Sie alle Arten von Logik hier drin haben und Sie nicht unbedingt laden App ausführen möchten ? Es soll nur automatisch laufen. Nun, ich meine, es ist nichts falsch daran, es so zu tun, würde das funktionieren. Oder du könntest einfach JavaScript sagen. Hey, führe das einfach automatisch aus, egal, wie es heißt. Das müssen wir nicht. Stattdessen hat sie es gegessen. Wir müssen es nicht laden, nur ausführen, sobald es da ist, Lassen Sie es ausführen. Und jetzt, wenn ich die Seite aktualisiere, werden wir sehen, dass die Konsul Protokolle beide erscheinen genau so, wie die APP lädt App geladen wird . Also wirklich wieder, genauso wie eine schnelle Auffrischung. Alles, was wir tun, ist, dass wir am Anfang der Funktion in öffnende Klammern setzen und dann eine am Ende der Funktion und dann eine Reihe von öffnenden und schließenden Klammern am Ende und die einfach JavaScript sagen. Hey, obwohl dies eine Funktion ist, führen Sie sie automatisch erneut aus. Es gibt keine Hausaufgaben, aber wenn Sie sich eine JavaScript-Bibliothek oder ein Framework ansehen, werden Sie diese Art von Ausdruck überall sehen. Und zuerst denkst du , warum gibt es überall so viele Klammern? Und das ist alles, was das bedeutet. Das bedeutet nur, dass wir einfach alles, was dazwischen liegt, automatisch ausführen werden. Das ist alles, was es sagt. Und so ist das ein fantastischer Fonds mit JavaScript. 33. Das Keyword: Lassen Sie uns über ein Thema sprechen, ein Schlüsselwort, das für viele neue Entwickler irgendwie beängstigend ist. Und das ist das Schlüsselwort, wenn ich Stichwort sage, ich meine, es ist ein reserviertes Wort, also haben wir reservierte Wörter wie Rückgabefunktion, var. Und jetzt ist das Wort das. Also im Allgemeinen möchten Sie keines dieser Schlüsselwörter als Variablennamen verwenden. Das Schlüsselwort this bezieht sich also wirklich nur auf ein Objekt, mit dem ein aktuelles Gebot von JavaScript-Code ausgeführt wird . Es bedeutet irgendwie nur mich selbst, ich rede über sich selbst. Also im Beispiel einer Funktion haben wir eine Funktion get person, und wir könnten diesem einen Namen geben und dann könnten wir den Namen zurückgeben. So ziemlich einfache Funktionsvariable. Kayla war gleich, um Person Caleb zu bekommen. Und so wird das einfach zurückkehren. Caleb ist gleich Caleb, und wann immer du das siehst, wirst du diesen Punkt etwas sehen. Vielleicht ist es eine Funktion mit Klammern. Vielleicht ist es dieser Punkt. Eine andere Variable funktioniert nicht. So etwas wird in die richtige Benennung ein wenig die Straße hinunter kommen. Oder vielleicht nur dieser Punktname. Wann immer Sie diesen Punkt sehen, worauf sich das bezieht, ist Ihre Funktion oder wenn Sie sich in einem Objekt befinden, über das wir noch nicht gesprochen haben, haben wir es formell nicht gelernt. Es wird nur auf sich selbst verweisen. Also wirklich, was das sagt, ist dieser aktuelle Funktion Punktname und das ist das Schlüsselwort hier. Und so eine nette Sache, die wir hier tun können, ist, dass wir mit der Zuweisung von Variablen innerhalb einer Funktion beginnen können, und wir können eine normale Variable so zuweisen, wie Feuername gleich Name ist. Aber das haben wir schon hier drin. Stattdessen werde ich dir eine coole Sache zeigen, die wir tun können. Wir tun weit dieser Punktname ist gleich dem Namen. Und wenn wir den Rückgabenamen ändern, um dies zurückzugeben. Also geben Sie einfach dieses bestimmte Objekt, das wir sagen könnten, Caleb Punktname und bekommen meinen Namen. Also lasst uns weitermachen, uns retten und uns auffrischen. Und das ist bereits exekutiert, da Caleb gleich ist, um Person so weit zu bekommen. Caleb Seltsam. Was ist diese Art von Caleb? Oh, es ist ein Objekt, etwas, das wir formal nicht darüber gelernt haben, worin wir anfangen zu übergehen. Aber das Schöne an diesem Schlüsselwort ist, dass ich jetzt Caleb Punktnamen sehen kann. Da ist es. Das tue ich. Dieser Punkt Beruf ist gleich Lehrer und Dev speichern Refresh, Caleb dot Beruf. Caleb ist Lehrer und Entwickler. Caleb-Punkt-Name. Mein Name ist Caleb, und so haben wir jetzt eine Variable mit Variablen innerhalb dieser Variablen, die durch Punktnotation zugänglich sind . Und du wirst das überall sehen und Jabs. Das ist unglaublich üblich. Diese Punktnotation Grundsätzlich sagen wir alles, was wir hier sagen, dass Sie wissen, wenn wir das manuell schreiben würden, und wenn dies in Javascript erlaubt wäre, ist es nicht. Aber wenn es in Javascript erlaubt wäre, wäre es vier. Caleb Punkt Name ist gleich Caleb und var Caleb dot Beruf ist gleich Lehrer und Dev, und das ist im Wesentlichen, was dies hier tut. Nun, das ist technisch nicht zulässig, aber ja, das aber ja, ist ziemlich genau das, was wir tun. Also sagen wir, Hey, Hey, Sie haben Variable einen var einen Punkt ein interner von sind zwei Seiten zu internen vier auch, und dann können Sie einfach referenzieren, was so intern sein wird. Var zu. Das Schöne daran ist jetzt plötzlich, anstatt zwei Variablen pro Person zu schreiben. Wir könnten zwei Variablen innerhalb einer Funktion schreiben, und dann könnte die Variable selbst nur eine Zeile sein. Und so müssen wir es nur einmal sagen, und dann können wir es immer wieder verwenden. Und je mehr Code Sie schreiben, desto komplexer wird Ihr Code effizienter. Es wird dazu führen, dass Ihr tatsächliches Schreiben letzten Code weniger Code jetzt oft besser ist, genau wie ein schneller Sommer hier. Eine schnelle Re-Referenz, wenn Sie diesen Punkt sehen, der sich auf eine Funktion bezieht, kann einen Parameter haben oder nicht , kann nur eine reguläre Funktion sein. Es könnte sich auf ein Objekt beziehen, über das wir mehr auf der Straße sprechen werden, aber im Wesentlichen bezieht es sich nur auf das, was sich in seinen Klammern innerhalb dieses Ökosystems befindet, bedeutet nur sich selbst. Das ist alles, was es ist. Also, wenn Ihr Javascript lernt oder Sie PHP so in PHP lernen, glaube ich, dass es gleich ist, und dann, was auch immer Ihr var-Name ist. Ah, wenn du Python lernst, glaube ich, es ist nur Selbstzweifel. Was auch immer Ihr Var-Name ist, dieser Dollar-Zeichen dies und Selbst in verschiedenen Sprachen alle verweisen auf genau die gleiche Sache. Nun, diesem Zeitpunkt, zu diesem Zeitpunkt,müssen Sie nicht wissen, wie Sie das zu viel verwenden können. Wir werden in das ein bisschen mehr die Straße runter kommen. Aber während Sie JavaScript lernen, wollten Sie eine Menge davon sehen, und ich wollte nur, dass Sie vorbereitet sind. Also, wenn du das siehst, gehst du nicht. Äh, was ist das? Ich verstehe nicht, wie das funktioniert. Das ist völlig in Ordnung. Denn jetzt verstehst du, dass dies im Grunde sagt: Hey, Hey, get person dot Name ist gleich, was auch immer der Name war, was so ist. Und dieser harte Beruf sagt im Grunde Get Person dot Beruf, die eine Variable innerhalb der Funktion ist. Also redet es jetzt nur wirklich über sich selbst. Es ist eine Art, ah, ein kleines bisschen von einem Geist Biegen Konzept auf den Anfang. Also, wenn Sie es nicht sofort bekommen, sich keine Sorgen. Verprügeln Sie sich nicht. Sei nicht zu hart zu dir selbst. Dies kommt mit Übung, so dass es für diese spezielle Lektion keine Hausaufgaben gibt. Ich wollte dir das nur zeigen, dir ein wenig vertraut machen und dich irgendwie in die Idee von Objekten einfallen lassen, über die wir auf der Straße reden werden. Und ich weiß, dass ich das immer sage, aber Objekte sind ein großer Teil der objektorientierten Programmierung, und wir müssen irgendwie darauf vorbereitet sein. Also, da gehst du hin. Das ist das Schlüsselwort dieses Schlüsselworts. Dies bedeutet nur, was auch immer Ihr Code auf diesen speziellen Satz von geschweiften Klammern verweist, das ist alles, was es bedeutet. Ich hoffe, das hat Sinn ergeben, und wir sehen uns in der nächsten Lektion. 34. Geltungsbereich: Hallo und willkommen zurück. Ich weiß, dass wir in letzter Zeit viel über Funktionen gesprochen haben. Ich denke, wir sollten das ein bisschen Pause machen. Zum größten Teil sind wir mit Funktionen fertig, zumindest für ein wenig. Hey, also reden wir über den Umfang. Scope ist ein Thema, das ich absichtlich herumgetanzt habe. Scope ist im Grunde, wo unsere Variablen laut Zehe leben. Also haben wir hier eine sehr mutige Art in unserem Skript erstellt. Variablenname, eigentlich Variable , ist natürlich gleich JavaScript für Anfänger. Und wir können diese Variable überall in unserem Skript verwenden. Also, wenn wir eine Funktionsfunktion erstellt haben, tun Sie ah, was wir Konsolenpunktprotokoll natürlich sagen könnten. Wir könnten sogar Kurs zurückkehren, weil wir diese Variable hier oben definiert haben und wir werden es innerhalb dieser Funktion verwenden. Also lassen Sie uns voran und aktualisieren Sie unsere Seite und geben Sie einfach, natürlich, als Variable. Wir werden Javascript für Anfänger sehen. Sicher genug, und dann tun Sie ah, Sache ist eine Funktion, die wir sehen können. Es wird von diesem lockigen f. präsentiert Wir setzen Klammern um ihn herum oder nachdem es eher drücken Enter und wir werden Javascript für Anfänger zu sehen ist Konsolenprotokoll, und es gibt Javascript für Anfänger. Dies ist eine Einführung in das Scoping. Die Idee ist also, dass, wenn Sie eine Variable haben, die außerhalb einer Funktion ist, Sie diese Variable innerhalb einer Funktion verwenden können. Und so, wirklich, das ist Ihr äußerer Umfang. Sie können sich dies als vorstellen, wie die Atmosphäre rund um unseren Planeten. Egal wo Sie sind, Sie sind ziemlich zugänglich für etwas, das in der Atmosphäre zu finden ist. Sauerstoff oder Stickstoff oder Wasserstoff. So etwas. Und der Planet selbst wäre die Funktion. Und weil diese Variable hier alle anderen Funktionen umschließt, die es wie in der gleichen Zeile hier sind ,können Sie sie innerhalb einer Funktion verwenden. , Jetzt ist das Gegenteil absolut nicht wahr. Dies ist sehr wichtig zu beachten. Also, wenn wir Variable in Ihrer Bar erstellt, Lehrer ist gleich Caleb Tallinn und es spielt keine Rolle, was wir zurückgeben oder was wir trösten Protokoll. In der Tat können wir sogar beides loswerden. Und wir haben Konsul Dot Log Lehrer, Dies wird nicht funktionieren, weil diese Variable auf diese Funktion beschränkt ist. Gehen Sie weiter und geben Sie uns eine Aktualisierung und Sie können diese ungefangene Referenz sehen. Jeder Lehrer ist nicht definiert. Und das liegt daran, obwohl es hier definiert ist und wir konsolen können, loggen Sie es in Ihrer Uhr dieses Konsolenprotokoll, lassen Sie uns voran gehen und machen Ausrufezeichen für die 1. 1 und für die 2. 1 ist aus der Schule. Und dann lass uns etwas tun. Also wir tatsächlich diese Funktion ausführen. In der Tat könnten wir das in ein I F E verwandeln, wenn wir es wollten. Wir könnten so etwas tun. Lass uns weitermachen, erfrischen und es steht: Hey, Hey, Lehrer ist hier drin. Es ist in der Funktion, aber es ist nicht außerhalb der Funktion zugänglich. Und so ist das Gegenteil von dem, was ich ursprünglich gesagt habe, nicht wahr. Aber pass auf uns auf. Wir können natürlich immer noch innerhalb der Funktion verwenden, auch wenn es sich um einen sofort aufgerufenen Funktionsausdruck handelt. Da ist es. Da ist mein Name. Es gibt den Kursnamen, lokale Variable, globale Variable und die der tatsächlichen Namen, die wir dazu neigen, zu verwenden. Und wenn Sie eine globale Variable haben und sie lokal in jeder Art von Funktion verwenden können, die Sie wollen. Wenn Sie eine lokale Variable innerhalb einer Funktion definieren, können Sie sie nicht global verwenden. Und diese ganze Sache hier ist nicht auf JavaScript spezifisch. Obwohl die Art, wie JavaScript es tut, ein wenig schrullig ist. In JavaScript. Sie können die Variable hier erstellen und sofort darauf zugreifen, ohne sie über den ah-Parameter in anderen Sprachen zu übergeben . Das stimmt nicht ganz. Sie haben oft Kurs dort zu bieten und dann lassen Sie uns das loswerden. Ich bin f e Nur weil wir das einfach halten wollen, würden Sie im Kurs passieren, und dann würden Sie so etwas sagen, eine Sache tun und dann übergeben Sie die Kursvariable und dann würden Sie in der Lage sein, es hier zu verwenden . Und wenn wir das hier eine Chance geben, wird das funktionieren. Dies wird drei Ausrufezeichen sagen. Lehrer und dann drei Ausrufezeichen. Der Kurs, der außerhalb und dann außerhalb des Geltungsbereichs ist, immer noch nicht gehen, um mir den Lehrer zu geben. Und sicher genug, wenn ich drei Ausrufezeichen aktualisiere, markiert Lehrer durch Ausrufezeichen den Kursnamen, weil wir ihn übergeben haben, also machen viele Sprachen es auf diese Weise. Aber in JavaScript müssen Sie es nicht explizit übergeben, da eine globale Variable automatisch Zuständigkeit in ein lokales Ökosystem wie eine Funktion hat. Und wenn ich auf Refresh klicke, wirst du sehen, dass sich absolut nichts geändert hat. Lassen Sie uns also voran gehen und einige Codekommentare erstellen. Ein paar Notizen. Dies ist, ah, globale Variable, weil diese Funktion erlaubt ist, im Freien zu sein. Dies wird auch als globale Funktion bezeichnet. Dies ist eine globale Funktion, und dann werden wir nur die Funktion ausführen, die Funktion ausführen und ein einfaches Council Dot Log. Keine große Sache da, und diese Variable hier drin. Das ist der sehr wichtige. Dies ist eine lokale Variable, und lokale Variablen sind nur innerhalb ihres lokalen Ökosystems zugänglich. Dies ist also nur zugänglich und es ist lokales Ökosystem und dann Konsolenprotokolle. Und jetzt haben wir unseren Code richtig kommentiert und dokumentiert. Und so ist der Weg, darüber nachzudenken, globale Variablen dürfen überall sein. Unter der Annahme, dass sie definiert sind oder außerhalb eines lokalen Ökosystems erstellt werden, sind sie anderswo erlaubt. Und wenn sie innerhalb eines lokalen Ökosystems wie eine Funktion definiert sind, dürfen sie dieses lokale Ökosystem nicht verlassen. Sie können Onley innerhalb der Funktion leben, ihre lokalen. Aber wieder, globale Variablen haben die Zuständigkeit, grundsätzlich überall zu jedem Zeitpunkt zu sein. Also, was ich möchte, dass Sie dies tun, ist eine Chance zu geben, um zu versuchen, das so gut wie möglich zu brechen. Erstellen Sie also eine globale variable kreative Funktion. Versuchen Sie, auf diese globale Variable innerhalb der Funktion zuzugreifen, ohne sie zu übergeben, und geben Sie ihr keinen Parameter. Versuchen Sie einfach, innerhalb der Funktion darauf zuzugreifen und erstellen Sie dann einen lokalen Variablenzugriff, der innerhalb der Funktion ist. Aber dann, außerhalb davon, versuchen Sie, auf diese lokale Variable außerhalb der Funktion zuzugreifen. Erstellen Sie also eine globale Variable, die innerhalb der Funktion funktioniert, und erstellen Sie dann eine lokale Variable, die außerhalb einer Funktion nicht funktioniert. Geben Sie dem einen Schuss, und Sie sollten die gleiche Luft sehen, in die ich geriet, und das ist wirklich alles, was es gibt. Also, wenn Sie draußen in der Wildnis sind und Sie einen Fehler sehen, der sagt nicht gefangen, Referenzluftvariable ist nicht definiert. Das liegt daran, dass es wahrscheinlich außerhalb des Gültigkeitsbereichs ist oder die Variable noch nicht existiert 35. Hürden: Okay, reden wir über eine seltsame Sache, die JavaScript tut. Dies ist eine JavaScript-Eigenart. Es wird hissen, nicht schlauchen, hissen genannt. Nagelt es in JavaScript, wenn Sie das Wort var sehen, das wir überall gesehen haben, im Grunde, was dies sagt, ist, was Ihre Variable an die Spitze ihres Geltungsbereichs bewegt. Aber gib ihm noch keinen Wert. Also, zum Beispiel, Funktion get person, und wir haben hier eine lokale Variable erstellt. Wir kennen lokale Variablen aus der Scope-Lektion. Var Name ist gleich Caleb, und dann könnten wir etwas super einfaches tun, wie ein Konsolenprotokollname. Und dann, wenn wir laufen, bekommen Person in unsere Seite hier, Person mit Klammern zu bekommen, weil es eine Funktion ist. Es wird sagen, Caleb, aber Sie bemerken diese undefinierte Sache. Das ist wegen variablem Heben. Lassen Sie uns hier ein Beispiel machen. Wir wissen, dass Code von oben nach unten läuft, und wir tun Rat Dot Log Variablennamen. Dies sollte uns einen Fehler geben, da dies noch nicht definiert ist. Der Variablenname ist darüber nicht definiert, so sollte es nicht funktionieren, und dann definieren wir es, und dann brechen wir den Namen protokolliert. Lassen Sie uns das eine Chance geben. Mal sehen, was hier passiert. Besorgen Sie Person. Wir sehen Undefined Caleb Undefined. Und so wissen wir zu diesem Zeitpunkt, dass undefined oben war, und wir könnten das tatsächlich tun. Lasst uns das leichter machen. Var noch nicht gesetzt, dass reimte sich, und das war unbeabsichtigt. Die Bar ist festgelegt, und das ist aktualisieren und diese Funktion erneut ausführen. Und hier werden wir sehen. Var ist noch nicht gesetzt, und dies ist der Wert undefiniert in JavaScript. Undefined ist im Grunde ein Datentyp. Es ist wie eine Nummer. Es ist wie eine Zeichenfolge oder eine Funktion Boolean oder ein Array. Dies ist ein anderer Datentyp. Es ist undefiniert. Und wirklich, was das bedeutet, ist, und Sie werden sehen, dass das ziemlich viel in der Wildnis To nur Variablen deklariert. Var-Name. Es ist genau das Gleiche zu tun. Also sagten wir, Hey, es gibt eine Variable, aber sie hat keinen Wert, also keinen Wert. Obwohl dies eine Zeichenfolge ist, die keinen Wert sagt, also hat es einen Wert, no ist auch ein Wert. Das heißt, es ist eigentlich nichts drin. Sie haben explizit gesagt, dass nichts drin ist. In JavaScript bedeutet undefined, dass die Variable definiert wurde, aber es gibt keinen Wert darin. Derzeit hat der JavaScript-Interpreter keine Ahnung, was das sein soll. Und so wird das undefiniert sein. Lass uns das speichern, und wir werden sehen, ob wir diese Funktion erneut ausführen. Wir sollten dies machen und I I F E sagt Variable ist nicht noch undefiniert gesetzt, und dann ist es gesetzt. Und dann haben wir unsere regulären undefinierten dort drin, was wir ignorieren können. Das letzte Mal gehen wir voran und erstellen und sofort aufgerufene Funktion, weil ich das nicht weiter schreiben möchte. Und lasst uns weitermachen. Da gehen wir. Das sieht viel besser aus. Und so hissen ist diese Idee, dass, sobald Ihr Browser JavaScript interpretiert, sobald er den Code liest, sagt er: Hey, Hey, in dieser Funktion gibt es irgendwelche Variablen? Sagt, lass mich zuerst durchschauen, bevor ich etwas mache und dann sagt: Oh, Oh, ja, es gibt eine Variable hier drin, okay. Ah, mir egal, was der Wert ist. Ich möchte nur sicherstellen, dass dies definiert ist. Das tut es im Grunde. Dies bewegt es nach oben, und an diesem Punkt, Zeit, die wir wirklich nur sagen, Name ist gleich Caleb. Wir müssen Vier nicht deklarieren, weil es schon da oben sein wird. Das ist im Wesentlichen das, was jetzt tut. machen wir es nicht. Nicht notwendigerweise. Nicht genau so. Aber das ist okay. Das ist in Ordnung, weil wir wissen, sobald wir irgendeine Art von Variable erstellen, die an die Spitze ihres Geltungsbereichs gehängt wird, der hier zwischen diesen geschweiften Klammern liegt und dann basierend auf dem Umfang die Vorherige Lektion. Wir wissen, dass wir nicht auf den Variablennamen außerhalb dieser Funktionen zugreifen können. Lassen Sie uns voran und tun Konsolenpunktprotokoll und es ist ein Name ist Name. Wir wissen, dass dies eine lokale Variable ist. Es wird automatisch nach oben gehängt, als ob es automatisch ohne Wert gesetzt wurde . Und dann hier unten wir im Grunde gesagt, Oh, eigentlich haben wir einen Wert, also gibt es ein kleines Stück Speicher auf Ihrem Computer für diesen Variablennamen zugewiesen. Hoffentlich benutzen Sie es und wir sagten: Ja, Ja, okay, hier ist es. Wir werden es verwenden, und da es sich um eine lokale Variable handelt, ist sie im globalen Bereich nicht zugänglich. Wenn wir also Ihre Seite aktualisieren, ist dies peinlich, weil es immer noch sagt Mein Name ist Caleb. Eigentlich Eigentlich der Grund dafür darin, dass ich hier eine Geschichte habe. Variable namens Caleb. Das habe ich gerade getan. Es wurde getötet. Wenn ich diesen geändert habe, können wir alle diese ändern. Ändern Sie dieses und jenes und jenes und jenes und jenes. Und die Änderungen an meinem Namen, wo ich das noch nicht in meinem Browser gespeichert habe. So erfrischen. Und da gehen wir, das ist besser. Und so sagt es, dass mein Name nicht definiert ist und weil dies wieder auf das Scoping zurückzuführen ist, ist diese Variable irgendwie gebunden. Es ist an diesem bestimmten Bereich gesperrt. Wir können es draußen nicht benutzen. Obwohl Hebeing sagt, Hey, Hey, Variablenname ist, werden wir es an die Spitze des Bereichs verschieben. Es ist für diesen Bereich gesperrt, so dass es nicht rauskommen kann. Lassen Sie uns nun einen kurzen Blick auf die undefinierten Datentypen werfen, also lassen Sie uns tun. Also lassen Sie uns hier eine Variable erstellen und nennen es einfach einen Computer, okay? Es gab seinen Wert zurück. Sein Wert ist nicht definiert. Lassen Sie uns Art von Computer zu tun und wir sehen, dass es nicht definiert ist. Was ist, wenn wir dies in eine if-Anweisung werfen If Computer gleich undefined Alert ist undefiniert, undefiniert, nicht unter find. Sieh dir das an. Es ist undefiniert. Wir könnten auch hier einen strengen Vergleich machen, , so gut wir tun können, wenn Computer zu drei ging. Also drei Gleichheitszeichen sind gleich undefinierter Alarm, streng undefiniert. Und sieh dir das an. Es sagt, es ist streng undefiniert. Und das liegt daran, dass Computer in einem Jahr keinen Wert hat. Jetzt können wir sagen, dass Computer gleich ist, ich weiß nicht, Mac OS, ich schätze, und das ist erneut Diese nichts passiert. Was ist, wenn ich den nicht strengen Vergleich mit nur zwei Gleichheitszeichen mache? Nichts passiert. Und wie das in ihrem Code aussehen würde, ist, wenn wir es wollten. könnten wir tun. Wenn mein Name gleich undefined ist, dann definieren wir es hier. Mein Name ist gleich Caleb. Lasst uns weitermachen. Werde das jetzt los. Wenn wir uns speichern und wir versucht haben, Ihre Seite zu aktualisieren, werden wir mit einem Fehler wie dieser angezeigt werden, es sagt nicht abgefangenen Referenzfehler. Mein Name ist nicht definiert. Wir haben es noch nicht definiert. Es denkt, dass es da sein sollte, aber wir haben das VAR Schlüsselwort nicht verwendet. Was, wenn wir das tun? Werfen wir hier runter. Lass uns Var meinen Namen machen. Wirf es einfach ganz unten. Das heisst von seiner besten Seite. Wir aktualisieren die Seite und da gehen wir. Es funktioniert tatsächlich. Also, was sie sagten, war , Hey, bewegen Sie diese Variable nach oben, als ob sie hier oben wohnte. Mein Name ist hier oben. Es ist momentan undefiniert. Es gibt keinen Wert. Wir wissen nicht, was es ist. Also sagt, Hey, wenn mein Name nicht definiert ist, wenn es keinen Wert gibt, einfach neu zuweisen. Stellen Sie sicher, dass es einen Wert von Caleb hat und dann können wir es hier verwenden, um dies ein wenig komplizierter zu machen und nur um etwas mehr Zeit mit dem Schlüsselwort zu bekommen, das wir immer tun könnten. Lassen Sie uns diese Änderungen ändern von und ich e zu einer regulären Funktion. Wir könnten immer überprüfen, ob ein Parameter gesetzt ist oder nicht. Wenn keine Standardeinstellung vorhanden ist. Also könnten wir sagen, Sie wissen, dass der Name standardmäßig gleich Caleb ist. Das ist toll, aber was ist, wenn es keine gibt? Oft wirst du so etwas sehen. Und was, wenn es einen gibt, der nicht bestanden ist? Was, wenn wir das taten? Konsolenpunkt Protokollname der Konsolenkonsole Was passiert, wenn wir das speichern und versuchen, das mit Sue Konsolenprotokoll auszudrucken? Was auch immer dieser Name sein wird, erfrischen Sie sich. Und wir müssen diese bekommen Person Klammern ausführen. Es sagt etwas. Nicht definiert. Okay, nun, wir haben ihm keinen Namen gegeben, aber jetzt können wir überprüfen, ob es tatsächlich da ist. Also können wir was? Wir haben keinen Namen angegeben, aber jetzt können wir überprüfen, ob dieser Name nicht definiert ist und einen Standard definieren. Wir können das auf manuelle Weise machen. Standardwert wie diesen zu geben Wenn Sie also JavaScript in einem älteren Browser wie Internet Explorer verwenden, wird dies möglicherweise nicht unterstützt, anstatt einen . Sie werden also abwärtskompatiblen Code schreiben wollen, der besagt, ob Name gleich stripped gleich undefined ist , können wir es hier definieren. Name ist gleich Caleb. Gehen wir weiter und erfrischen wir uns. Besorgen Sie Gift. Bam! Eine Sache, Caleb, das ist ein Konsolenprotokoll hier. Sagt etwas. Caleb, wir haben ihm keinen Namen gegeben. Jetzt ist der Standardname Caleb. Das haben wir manuell geschrieben, und wir können ihm immer auch einen Namen geben . Also könnten wir sagen, ist Anstrengung, meine kleine Katze und es wird sagen, Oh, Oh, es ist eigentlich definiert, also, du weißt schon, überspringe einfach diese ganze if-Anweisung. Und so kommen hier Hebezeuge, Umfang und Undefinierte zusammen. Und als eine kurze Zusammenfassung bedeutet undefined im Grunde nur, dass es keinen Datentyp gibt, der mit einer bestimmten Variablen verknüpft ist. Aber wann immer Sie eine Variable definieren, spielt keine Rolle, wo Sie es unseres Namens definieren, ist gleich was auch immer dieser Name sein wird , JavaScript liest uns und sagt: Oh, Oh, lass uns das nach oben bewegen nach oben. Es ist derzeit undefiniert, bis Sie es später definieren. Das heißt Hoisting und Scope ist die Tatsache, dass dieser Name nicht erlaubt ist, diese Klammern zu verlassen , die Bereich ist. So hoffentlich, dass alles Sinn gemacht hat. Es gibt eine Menge zu entpacken in diesem speziellen Video, aber wir mussten eine Reihe von anderen Sachen lernen, damit dies irgendwie Sinn macht . Dafür gibt es keine Hausaufgaben. Ich möchte wirklich nur, dass Sie in der Lage sein, dies zu verdauen, wenn Sie sich frei fühlen möchten, mit etwas von Ihrem eigenen Code herumzubasteln und irgendwie den Dreck davon zu bekommen. Aber das in den letzten Lektionen waren JavaScript-Grundlagen. Diese Luft nicht super Spaß Dinge unbedingt lernen. Aber sie sind sehr wichtig. Sie werden in der Zukunft auf Probleme stoßen, in denen diese Themen wie Umfang und Hebezeug Ihnen helfen werden, ziemlich viel zu helfen. Sie werden verstehen, warum Sie möglicherweise einen bestimmten Fehler bekommen. Als Nächstes. Gehen wir zu etwas, das viel mehr Spaß macht. Lassen Sie uns über die zweite Möglichkeit erfahren, Ereignisse an unsere Seite zu binden. 36. Einführung in Event-Listener: Okay, lasst uns etwas Spaßiges erfahren. Wir haben einen Bootskern gelernt. JavaScript. Grundlagen, wie das Heben von anonymen Funktionen, sofort aufgerufene Funktionen, Ausdrücke , Umfang, solche Dinge. Alles sehr wichtige Dinge. Aber zugegebenermaßen sind sie nicht die lustigsten Dinge, die man lernen kann. Also lasst uns das ändern. Lassen Sie uns etwas über ein Ereignis-Listener-Ereignis lernen. Zuhörer sind, ich wollte sagen, urkomisch, aber sie sind eigentlich nicht urkomisch. Sie sind enorm nützlich und auch Spaß. Eso Sie werden Ereignis-Listener genannt, und wir tauben in diese zu einem Zeitpunkt ein, als wir Button auf Klick geschrieben haben, ist gleich ja, etwas, das wir ihm gesagt haben, eine bestimmte Funktion auszuführen. Und so modifizieren wir tatsächlich unser HTML. Ändern Ihres HTML-Codes ist nicht immer möglich, und manchmal möchten Sie nur, dass die Dinge automatisch funktionieren. Und was? Was wir tun können, ist, dass wir ein wenig JavaScript-Code erstellen können, der als Ereignis-Listener bezeichnet wird, und es ist an ein bestimmtes Knotenelement oder ah, Javascript, kein Doran gebunden Javascript, . Html Element entstanden die beiden Wörter dort zusammen, um ein Knotenelement zu erstellen. Ereignis-Listener ist also im Grunde nur eine Funktion, die an Ihre Webseitenspitze gebunden ist. Warten Sie auf Ereignisse klickt, wenn Sie eine Taste eingeben, wenn Sie die Seite nach unten scrollen. So etwas wie das. Jetzt sind die beiden häufigsten Ereignis-Listener da draußen, weitem die Klick- und Tastendruck. Also, wenn Sie in ein Textfeld oder ein Eingabefeld eingeben oder wenn Sie auf etwas klicken, kann es ausgelöst werden. Ah, es gibt noch einen, der Blur heißt. Wenn Sie also in ein Textfeld klicken und dann verlassen, kann es zu diesem Zeitpunkt möglicherweise eine Aktion ausführen. Aber diese beiden scheinen die beliebtesten zu sein. Unschärfe ist immer noch sehr, sehr beliebt. Und dann gibt es nur Tonnen und Tonnen von Veranstaltungshörern da draußen. Wir können nicht alle lernen, aber zum Glück arbeiten sie fast alle gleich, also müssen wir wirklich nur ein oder zwei von ihnen lernen. Und dann können Sie jeden gewünschten Ereignis-Listener verwenden. Lassen Sie uns also einen einfachen Ereignis-Listener erstellen, der die Anzahl der Male zählt, auf die eine Schaltfläche geklickt wird. Es ist also in einer Klasse hier. Lassen Sie uns Bt nbt in der primären. Dies ist nur Bootstrap Bt ein LG, und das ist eine Klasse von Js-Schaltfläche gegeben, und das wird nur sagen, Klicken Sie mich. Es ist stellen Sie sicher, dass dies in Ordnung auf unserer Seite sagt, Klicken Sie mich, damit Sie wissen, eine langweilige Schaltfläche. Das erste, was wir tun müssen, ist, dass wir diese Schaltfläche tatsächlich mit irgendeiner Art von Abfragen greifen müssen . Kurfürst bekommen Element von I d. würde funktionieren. Ah, wir könnten einen regulären Abfrage-Selektor verwenden, was wir tun, dio ist nicht wirklich wichtig, wie Sie dieses Element bekommen. Sie müssen nur in der Lage sein, diesen Knoten auszuwählen. Also lasst uns voran gehen und vier erstellen. Bt N ist gleich dem Dokument Stud Abfrage Selektor. Wir werden nicht erstellen Selektor verwenden alle, weil es nur eine hier gibt, die wir auswählen möchten . Also verwenden wir den Js-Button und das wird uns einen Knopf geben. Also lasst uns voran gehen, erfrischen und zuschauen. Dies wird Art von BCN und es markiert automatisch meine Schaltfläche hier, wie Sie sehen können. Also haben wir diese Schaltfläche als Notiz und wenn wir Art von Schaltfläche tun, können Sie tatsächlich sehen, dass es ein Objekt ist. Wir kriegen Zehengegenstände, ich schwöre. Ich verspreche Ihnen, sie kommen jetzt. Alles, was wir tun müssen, ist BTM zu sagen. Das ist der Name dieser Variablen hier. Ereignis-Listener hinzufügen Welche Art von Listener wollen wir? Dieser wird ein Klick sein, genau wie wir auf Click haben, die auf Klick war. Wir nennen es einfach Klicken Sie in JavaScript Und dann geben wir dies eine Funktion und wir werden in der Veranstaltung passieren. Und so sind wir zu diesem Zeitpunkt mit der Idee der Punktnotation vertraut. Also haben wir einen Knopf hier drin und wir wissen, dass der Button Punkt in ihrem Text gleich ist, um mich zu klicken, bitte. So können wir eine Punktnotation ändern, die nur eine Art Punktnotation vom Feinsten ist. Also sagen wir, Hey, Hey, schnappen Sie sich den Knopf beim Ereignis-Listener, Dies ist eine Funktion. Und so ist der erste Parameter welche Art von Ereignis? Zuhörer, die sagten, Hey, hören Sie auf Klicks und den zweiten Parameter, wir haben das noch nicht gesehen, aber der zweite Parameter ist eigentlich ah, Funktion sieht im Grunde so aus, nur waren Schreiben Sie es auf dem langen Weg. Also haben wir hier eine Funktion, und der Ereignis-Listener wird immer im Ereignis an diesen bestimmten Listener übergeben. Also hier ist, was wir tun können. An dieser Stelle können wir sagen, etwas hier zu tun, aber wir wollen auf die Anzahl der Klicks zählen. Nehmen wir also an, weit Gesamtzahl der Klicks ist gleich Null. Und da dies eine globale Variable ist, können wir lokal darauf zugreifen. Die Gesamtzahl der Klicks entspricht der Gesamtzahl der Klicks plus eins, was im Wesentlichen das gleiche ist wie die Gesamtzahl der Klicks plus Plus. Und dann lassen Sie uns ein anderes Element auf der Seite erstellen, das nur zählt oder zeigt eher die gesamten Klicks an. Also Div I d. Total klickt so etwas und lasst uns dieses Element auch greifen. Also lassen Sie uns tun Dokument Punkt bekommen Element von i d Gesamt Klicks Punkt in ihrem Text ist gleich Gesamtklicks. Gehen wir weiter und geben dem eine Chance. So sagt Klick mich und es zählt immer und immer wieder. Ich werde das deutlich größer machen, indem ich das von einem div zu einem H ändere. Und ich werde auch hier hineinzoomen. Sieh dir das an. Es zählt für mich. Wir haben kein zusätzliches HTML für den Ereignis-Listener geschrieben. Wir haben gerade einige JavaScript-Add-Ereignis-Listener geschrieben. Und so erinnerst du dich, als wir vor ein paar Lektionen über den Umfang lernten, die dich wahrscheinlich zu Tode damit gelangweilt haben. Aber hier wird es wichtig, denn wenn wir Gesamt-Klicks hier reingezogen haben, sagt Scope: Nun, das wird immer Null sein. Jedes Mal, wenn diese Funktion dieses Ereignis ausführt, wird Listener ausgeführt. Jedes Mal, wenn wir auf die Schaltfläche klicken, setzen wir diese 20 zurück und das wird nicht funktionieren. Es ist immer ein Interview. Man setzt es zurück. Null fügt eins hinzu. Aber wenn wir definieren, dass global und nur lokal modifizieren, wird es Null sein und dann eins und dann zwei und dann drei und dann vier und dann fünf und so weiter und so weiter und so weiter. Da gehen wir. Wir haben einen JavaScript-Ereignis-Listener. Nun, das ist ziemlich cool, aber das ist nicht so cool wie in der Lage, Text aus einem Eingabefeld zu holen, was wir in der nächsten Lektion tun werden. Also musst du in diesem letzten Moment nichts tun. Es gibt keine Hausaufgaben. Ich möchte nur, dass Sie sich diese Art von Syntax ansehen. Also haben wir Button Dot Add Event Listener. Der erste Parameter ist der Ereignistyp. Wir sagten, es wird ein Klick-Typ sein und als der zweite Parameter übergeben wir eine ganze Funktion und eine letzte Sache zu notieren, bevor wir zur nächsten Lektion gehen, können wir diese gesamte Funktion tatsächlich verschieben, ihr einen Namen der Anzeige geben Klicks, so dass die Funktion Anzeige klickt und so ist der zweite Parameter einfach der Name der Funktion. Also lassen Sie uns voran gehen, aktualisieren, und es funktioniert auch. 37. In-Werte bekommen: Hey, da. In der letzten Lektion haben wir etwas über den Click-Ereignis-Listener erfahren, ähnlich dem Button Punkt aussah, den er auf den Ereignis-Listener klickt, und dann einen Funktionsnamen. In diesem Video werden wir tatsächlich versuchen, den genauen Wert von etwas aus einem Eingabefeld zu erhalten. Vielleicht fragen wir nach jemandem Namen und wir wollen diesen Namen auf jedem Tastendruck bekommen. Wir können das zuerst tun, HTML auseinander setzen. Also haben wir Eingabepunkt-Formular-Steuerelement Punkt Js Namen, und wir werden dies nach seinem Namen auswählen. Und dann lassen Sie uns vielleicht auch eine Willkommensnachricht zurück auf der Seite anzeigen. Also h zwei hallo, und dann, was auch immer dieser Name sein wird. Also wollen wir dies in der Welt von JavaScript auswählen. Wir werden eine Art Element brauchen, um das einfach zu ändern. Wir könnten alles ändern. Wir könnten Hallo sagen, Caleb. Hallo ist Mühe. Hallo, Henry. Oder wir könnten den Namen ändern, wenn wir nur einen bestimmten Weg machen wollen. Lasst uns einfach die Spannweite ändern. Klasse ist gleich Js Änderungsname. Und wenn wir das auf ihrer Seite hochfahren und genauso hallo und hier ein Eingabefeld ist, okay? Und dann scrollen Sie einfach nach unten zu unserem JavaScript. Das erste, was wir tun müssen, ist, dass wir tatsächlich dieses Eingabefeld auswählen müssen. Und so gaben wir ihm einen Namen Jazznamen. Das ist die Klasse. Scheint, lasst uns diese var als Eingabe und diese Eingabe als Feuer greifen. Also Dokumente Punkt-Abfrage-Selektor Wir werden nur die 1. 1 Js greifen, nicht den Namen. Und so wollen wir jetzt einen Ereignis-Listener daran binden. Also tun wir Eingabepunkt hinzufügen Ereignis-Listener. Wir könnten Schlüssel nach oben, und dann können wir ihm eine Funktion als seinen zweiten Parameter geben. Und das wird das Ereignis sein, das es immer passieren wird. Ah, oft werden Sie nur sehen, dass der Buchstabe e, der für Ereignis steht, wirklich nur die Variableneingabe umbenannt hat. Es spielt keine Rolle, expliziter zu sein. Ich mag es Ereignis nennen, aber in der Produktion nenne ich es oft einfach E. Aber lassen Sie uns es einfach und College-Ereignis halten, und dann könnten wir Council Dot Log Event Punkt Punkt Punkt Wert Also denken Sie, es wäre nur Ereignis Punktwert? Aber das wird nicht funktionieren. Wir brauchen das eigentliche Ereignis und dann, um diesen Wert zu zielen. Also lasst uns weitermachen und das speichern. Und jedes Mal, wenn wir hier etwas eingeben, werden wir sehen, dass es im Konsul auftaucht und gelegentlich tatsächlich zu schnell tippen , denn das ist ein k a L O B da gehen wir. Das ist also der Schlüssel. Wir könnten den Schlüssel runter machen. Es gibt einen Unterschied. Es ist wie wenn Sie den Buchstaben auf Ihrer Tastatur drücken und Ihr Finger ist noch nicht nach oben bewegt. Das ist der Schlüssel nach unten. Taste nach oben ist, wenn der Finger vom Tastendruck hochkommt. Aber lassen Sie uns voran und bleiben Sie einfach bei regelmäßigen Schritt halten, denn das wird uns den vollen Wert geben . Sobald ich getroffen habe, sagt Kay K A L O B. Sobald ich tippe, gibt es mir den ganzen Wert da drin. Also, jetzt müssen wir gehen und diesen Namen ändern. Lassen Sie uns also unser Dokumentobjektmodell unser HTML abfragen Dafür sind sie Name, nicht benannte Eingabe. Das scheint ein wenig seltsam, es dieses Namenselement zu nennen, denke ich, weil warum nicht? Dokumente Punktabfrage So verschlossene Tür Jazz Name ändern. Und dann, weil wir das nicht jedes Mal neu definieren wollen. Jedes Mal, wenn wir eine Taste drücken, ist es auf diese Weise nur wenig effizienter. Wir könnten nur die Variable tun Inter Text ist gleich Ereignis Punkt Zielpunktwert. Lass uns weitermachen und das loswerden. Und das wird sich ändern, wenn ich tippe. Hallo, Caleb. Hallo, Zephyr. Hallo, Henry. Hallo, d'Argo. Hallo. Mein Name ist Caleb und ich liebe Coda, einschließlich zwei haben die Codierung bearbeitet und da haben Sie es. Und wieder, dies ist nur der zweite Parameter und dann noch ein wenig weiter zu erweitern. Diese Funktion wird hier als Parameter technisch eine Callback-Funktion, eine Callback-Funktion oder nur ein Callback kurz genannt eine Callback-Funktion . Und was das bedeutet, ist, jedes Mal, wenn Sie eine Taste drücken und der Finger von der Tastatur nach oben bewegt, wird es eine Funktion ausführen. Und was wir hier tun könnten, ist, dass wir dies tatsächlich entfernen können und lassen Sie uns eine funktionierende hier Funktion namens Rückruf definieren , nur um es einfach zu halten. Wir geben diesen Namen da drin, und er wird das ausführen. Es spielt keine Rolle, wie dieser Name ist. Der Name könnte alles sein, was keine Rolle spielt, aber es wird technisch eine Callback-Funktion genannt, also werde ich es zurückrufen rufen. Also, während Sie dies lesen, gehen Sie Eingabe an den Ereignis-Listener-Schlüssel nach oben und nach allem oben, wird es eine Callback-Funktion ausführen. So klicken Sie auf, speichern, aktualisieren Sie Ihre Seite und es funktioniert weiter. Ja, sieh dir das an. Das ist ziemlich genial. Und das macht Spaß. Wenn Sie das also mit dem Click-Ereignis-Listener kombinieren, können Sie alle möglichen Dinge auf Ihrer Seite basierend auf Klick-Ereignissen oder Key-Up-Ereignissen ändern, Sie könnten alle möglichen anderen Dinge tun. Wenn Sie sich also für kleine außerschulische Aktivitäteninteressieren , kleine außerschulische Aktivitäten können Sie auf die Google-Maschine springen und einfach nach einem anderen JavaScript-Ereignis suchen . Listener-Typen. Es gibt eine Menge von ihnen da draußen. Sie müssen nicht die meisten von ihnen wissen, um völlig ehrlich zu sein, aber Sie sollten wissen, dass es eine Menge gibt und ich kann möglicherweise nicht über jeden einzelnen gehen , weil diese Videoserie wird sehr, sehr lang und aufgebläht werden und ich Ich will deine Zeit nicht so verschwenden. Bringen Sie einer Person bei, wie Ereignis-Listener hinzugefügt werden, und es spielt keine Rolle, was der Listener ist. Du wirst in Zukunft damit umgehen können, also ist das irgendwie meine Unterrichtsphilosophie. Dies erhält also Eingabewerte mit einem JavaScript-Ereignis-Listener. In der nächsten Lektion lassen Sie uns weitermachen und einige CSS-Farben mit Ereignis-Listern ändern und unsere Seite super dynamisch machen . Also ändern wir nicht mehr nur den Text. Wir werden etwas ändern, das tatsächlich mit dem Seitenstyling zu tun hat. 38. CSS mit Event ändern: hoch in den letzten paar Lektionen, die wir über Event-Zuhörer gelernt haben. Wir haben den Click-Ereignis-Listener verwendet, und wir haben den Key-Up-Ereignis-Listener verwendet. Aber lassen Sie uns eigentlich etwas Spaß machen, denn bis jetzt ändern wir einfach ein wenig HTML in einem kleinen inneren Text, und das ist Sie wissen, dass es in Ordnung ist, weil es unsere Seiten dynamisch macht, aber es ist nicht so lustig oder ist visuell ansprechend, wie ich denke, es könnte sein. Lassen Sie uns also in dieser Lektion fortfahren und einen neuen Ereignis-Listener erstellen, der den seitenbasierten Text,die Farbe und die Hintergrundfarbe ändert seitenbasierten Text, . Also brauchen wir einige HD Melone Jahre. Lass uns H eins machen. Hallo Welt Jetzt lass uns nicht tun Hallo, Welt. Wir sind weit über die Hello Welt hinaus. Lassen Sie uns CSS mit Ereignis-Listener ändern. Jetzt brauchen wir ein Eingabefelder. Lassen Sie uns ein Negativ mit einer Eingabe erstellen, nur einen regulären Text und ich werde dies so gestalten, dass Ihr eine Art Styling es hat. Lassen Sie uns dio klopfen 30 Pixel und auch Schriftgröße 30 Pixel. Machen wir es groß, und wir brauchen ein Etikett in hier Hintergrundfarbe und lassen Sie uns voran gehen und duplizieren das. Rufen Sie diese eine Textfarbe an, dasselbe und fügen Sie dann eine Klasse in beiden Klassen hinzu, die Js etwas gibt. Und ich habe Js nur angerufen, damit ich weiß, dass es nur für JavaScript, JavaScript, JavaScript, BG-Farbe ist und lass uns JavaScript-Textfarbe machen. Und wenn wir uns ihre Seite ansehen, wird es ziemlich hässlich sein. Ja, fügt ziemlich eklig hinzu. Aber weißt du was? Es ist, was es ist. Also die Idee ist, dass wir hier einfach so eingeben können, und es wird die Hintergrundfarbe ihrer Seite ändern und die Schriftfarbe unserer Seite ändern. Wir müssen also zwei Ereignis-Listener dafür erstellen. Lassen Sie uns Krabben, der erste Ereignis-Listener vor der Hintergrundfarbe. Bisher ist BG-Farbe gleich Dokumenten Punkt-Abfrage-Selektor Gut genug, und lasst uns auch die Js-Textfarbe Js-Textfarbe greifen, und wir werden diese eine Textfarbe nennen. Jetzt müssen wir unseren Ereignis-Listener hinzufügen, also lassen Sie uns BG Farbe Punkt hinzufügen Ereignis Listener Schlüssel oben, weil wir in ein Textfeld eingeben, werden wir es eine Callback-Funktion übergeben, die automatisch einen Parameter namens Ereignis nimmt . Und dann lassen Sie uns einfach die Konsole für jetzt protokollieren. Abgebrochen Protokollereignis-Punkt-Zielpunktwert, was auch immer das sein wird, und wir werden voran gehen und diese ganze Sache duplizieren. Kopie wurde bestanden. Eine und Textfarbe wird genau das Gleiche tun. Nehmen wir an, BG-Farbe in diesem Konsolenprotokoll und das ist Textfarbe in diesem Konsolenprotokoll. Aktualisieren Sie die BG-Farbe. Wir können sehen, dass da drin und dann x Farbe. Das können wir in ihrem Chlor sehen, wie ich es nannte. Nein, er möchte grundsätzlich den Text, die Farbe und die Hintergrundfarbe der Seiten ändern . Wir haben nicht gelernt, wie man dies in JavaScript macht. Ja, das wird ziemlich lustig sein. Gehen wir weiter und greifen Sie den gesamten Dokumentkörper, und dann werden wir das Styling des Körpers ändern, die Hintergrundfarbe. Also lassen Sie uns tun Unser Körper ist gleich Dokumenten gelehrt Abfrage, Selektor. Lasst uns einfach den Körper schnappen und dann könnten wir Body Dot Style Dot machen. Die Hintergrundfarbe ist gleich den Ereignissen, die auf diesen Wert abzielen. Und so war alles, was wir hier getan haben, gesagt: Hey, schnappen wir uns die ganze Leiche. Das ist das Körperelement, das von dort kommt und dann das Styling darauf. Also sehen wir diese Punktnotation viel öfter. Jetzt wird dieses Styling eine Hintergrundfarbe haben. Technisch gesehen ist es Hintergrundfarbe Bindestrich, aber in Javascript können Sie keinen Bindestrich in einer Eigenschaft oder einem Variablennamen verwenden. Also, was wir tun, ist, dass wir es Kamelkästen. Also, jedes Mal, wenn Sie einen Bindestrich in einer CSS-Deklaration sehen, nicht Dash C, ist es nur Großbuchstaben Siehe, oder wenn es, ah, Hintergrundbild wäre , ah, , wäre es kein Hintergrundbild. Es wäre Hintergrundkapital. Ich bilde Kamelgehäuse, so dass sie eine Hintergrundfarbe hat. Und mal sehen, ob das funktioniert. Hintergrundfarbe Rot. Oh, schau dir die Hintergrundfarbe blaue Hintergrundfarbe an. Lassen Sie uns ein Hex Farbe schwarz machen. Das ist ziemlich ordentlich. Das fängt eine Arbeit an. Okay, machen wir dasselbe mit unserer Textfarbe. Jetzt können wir damit effizienter werden, weil wir bei jeder Taste nach oben die Seite für das Körperelement abfragen . Zum Glück gibt es immer nur einen, also ist es leicht zu finden. Aber wissen Sie, wenn Sie das Wort rot R E D eingeben , wird es dies dreimal ausführen, und wenn Ihre Seite größer und größer wird, wird das langsamer und langsamer, und so lassen Sie uns Verschieben Sie dies einfach in den globalen Bereich, und wir müssen uns nicht darum kümmern, es mehr als einmal zu löschen, weil es immer für uns und in ihrer Textfarbe verfügbar sein wird . Wir könnten das nutzen, indem wir es hier unten einfügen, und ich habe das falsche eingefügt. Also, äh, Sie haben nichts gesehen. Und so sagen wir hier nur, der Körperstil, nicht die Hintergrundfarbe. Nur die reguläre Schriftfarbe wird sein, was auch immer dieser Ereigniszielwert für die Textfarbe für diese Notiz sein wird , lasst uns voran gehen. Textfarbe aktualisieren Sagen wir, weiß. Es sieht so aus, als wäre alles verschwunden. Was ist, wenn ich alles auswähle? Es ist immer noch da. Hintergrundfarbe wird gelesen oder blau oder grün, das ist so schwer zu sehen. Oder schwarz und gelb, schwarz und gelb, schwarz und gelb. Und so geht es darum, CSS mit Ereignis-Listern zu ändern. Jetzt zu jedem Zeitpunkt sogar ein CSS ändern, können Sie zu jedem Zeitpunkt sogar ein CSS ändern,während Ihre Seiten anfänglich geladen werden. Also, wenn wir wollten. Lassen Sie uns voran und ändern Sie die BG-Farbe mit JavaScript, so dass BG-Farbpunkt-Stil endet, auch. Die Hintergrundfarbe ist gleich lesbar, so dass die Seite geladen wird, die gelesen werden soll. Und ha tatsächlich hat das falsch gemacht, weil ich BG Farbe ausgewählt habe. Ich bin mir selbst voraus. Ich war da etwas zu aufgeregt. Also mache ich das einfach rückgängig und lass uns runtergehen. Und anstelle von BG-Farbe, lassen Sie uns Körper tun. Da gehen wir. Das sieht besser aus. Ah, wir könnten auch die Standardfarbe ändern auch schwarz, was es wahrscheinlich schon Schlitten war. Warten Sie? Da gehen wir. Und das geht mit jedem CSS, das Sie beschränkt haben. So, zum Beispiel, BG Color. Nehmen wir an, wir wollten etwas Rundung hinzufügen. Lassen Sie uns BG Farbpunktstil Dieser Grenzradius wird sein Lassen Sie uns einen 10 Pixel Rahmenradius geben . Sieh dir das an. Diese Luft jetzt in ein bisschen. Geben wir ihm eine Grenze, die eine Grenze von drei Picks gegeben ist, ist gepunktet schwarz. Hey, sieh dir das an. Ich meine, das ist ziemlich hässlich. Verstehen Sie mich nicht falsch, und wir wollen das nie wirklich im wirklichen Leben einsetzen. Aber jetzt ändern wir CSS mit Javascript. Wir schreiben kein wirklich CSS. Ich meine, das ist CSS, ich denke, aber wir schreiben keine. Tatsächliche Stile ließen JavaScript Sie, alles. Und wenn wir hier eintippen, wird es sich für uns ändern, was ziemlich cool ist. Jetzt. Wir könnten das noch einen Schritt weiter gehen. Wir könnten sagen, Hey, vielleicht können Hintergrundfarben nur eine bestimmte Farbe haben. Lassen Sie uns voran und fügen Sie dies als eine Variable hinzu, so dass wir nicht das Ereignis, den Zielwert die ganze Zeit eingeben müssen, und lassen Sie uns eine if-Anweisung machen. Besser noch, lassen Sie uns eine switch-Anweisung machen. Wir haben das noch nicht zu viel gesehen, also wechseln Sie die Farbe. müssen wir eigentlich zuweisen. Das sind zwei Fälle gleich blau, und das könnten wir tun. In der Tat, was? Wir könnten diese sogar zusammen stapeln. Das ist also irgendwie interessant. Blau lesen, Warten und dann Standard. Es wird immer sein, Wir brauchen eine Pause in Ihrer Pause. Die Standardfarbe wird immer weiß und Syntaxfehler sein. Das war meine Schuld. Das wollte ich nur ausschreiben. Sie konnten sagen, dass Syntaxfehler war, weil alles grau wurde eso. Grundsätzlich heißt das, hey, greifen Sie jede Farbe oder welche Farbe es derzeit ist und sagt Wenn es rot, weiß oder blau ist , dann ändern Sie die Hintergrundfarbe in rot, weiß oder blau. Andernfalls ändern Sie es immer. Das Weiß nur weiß halten ist die Standardeinstellung. Und jetzt beschränken wir tatsächlich Benutzereingaben. Also, wenn ich schwarz tippe, wird es nur Fuß weiß als Standard. Aber wenn ich rot tippe, wird es funktionieren. Blau funktioniert. Weiß funktioniert offensichtlich. Tatsache, dass wir nicht warten wollen. Wir wollen, dass das gelb ist, weil Weiß schon da oben ist, also macht das keinen Sinn, weiße Werke zu haben. Und wenn ich hier etwas eintippe, ist standardmäßig gelb. Und so gehst du hin. Das ist ein ziemlich gutes Beispiel dafür, wie man einen Ereignis-Listener verwendet, wie man Abfrageselektoren verwendet CSS-Styling ändern. Wir verwenden sogar eine Callback-Funktion. Wir haben eine switch-Anweisung verwendet, die wir für Ereignis-Listener verwendet haben, und wir haben das Standardstyling geändert, wenn die Seite geladen wurde. Also haben wir in diesem Video tatsächlich eine Menge erreicht. Also, was ich möchte, dass du nur unsere Hände auf Erfahrung mit allem , was ich in diesem Video geschrieben habe. Gehen Sie weiter, erstellen Sie einige grausame Selektoren, versuchen Sie, das Styling zu ändern, erstellen Sie dann eine Eingabe und versuchen Sie, einen Ereignis-Listener mit einer Taste nach oben und einer Callback-Funktion hinzuzufügen . Und vielleicht muss es keine switch-Anweisung haben, die für das, was wir derzeit verwenden, etwas kompliziert sein könnte . Aber Sie könnten sagen, die Punktfarbe des Körperpunkts ist, was auch immer diese Farbe ist, die Sie in das Eingabefeld eingeben . Geh weiter, gib dem einen Schuss, bastle wieder damit herum. Du wirst nichts kaputt machen können. Also tun Sie Ihr Bestes und, ehrlich gesagt, haben Sie einfach etwas Spaß damit. Ich bastle immer gerne herum, und ich versuche, Dinge zu brechen und irgendwie herauszufinden, wo der Rand von jeder Art von Thema ist , die ich gelernt habe, wie, wie, Wie weit kann ich etwas genau schieben, und das gibt mir eine Menge Hände auf Erfahrung. mache ich wirklich gerne. Andernfalls, wenn Sie sich damit ziemlich sicher fühlen, sollten wir zu unserem nächsten Mini-Projekt übergehen. 39. JavaScript #5: Hallo, Ende. Willkommen zurück. Wir werden hier mit unserem nächsten Mini-Projekt beginnen. Nun, die Idee hinter diesem Projekt ist alles über Ereignis-Listener. Also dieses Mini-Projekt, was ich möchte, dass Sie tun, ist drei Eingabeelemente zu erstellen. Und dann möchte ich, dass sie verschiedene Dinge mit dem verschiedenen Ereignis machen. Listener ändern die Hintergrundfarbe, ändern die Textfarbe und ändern die Schriftgröße der Seite während der Eingabe. Sie sollten also Eingabefelder sein. Und Sie sollten sich den Key-Up-Ereignis-Listener ansehen, und jedes Mal, wenn jemand eine Taste in einem dieser Eingabefelder drückt, sollte er Ihren Ereignis-Listener ausführen und versuchen, eine Änderung auf Ihrer Seite vorzunehmen. Jetzt haben wir dies im letzten Video gemacht, in dem wir wie CSS-Farben mit Ereignis-Listern geändert haben, während Sie eingegeben haben. Sie müssen diesen Fortschritt nicht bekommen, aber ich möchte nur, dass Sie einige Erfahrungen mit geraden JavaScript-Ereignis-Listern sammeln. Also geh weiter und gib dem einen Schuss. Versuchen Sie, wenn Sie alles aus dem Speicher machen können. Wenn du das nicht kannst, ist das okay, aber es ist gut, das Gehirn ein bisschen schwitzen zu lassen. Und wie immer, wenn Sie stecken bleiben, können Sie immer auf das andere Material verweisen. Das ist völlig in Ordnung. Niemand wird dich dafür schämen. Und ich würde jetzt vorschlagen, dass Sie dieses Video pausieren, weil ich das zu schwarz verblassen werde und dann werde ich mit meiner Lösung so beginnen, wie ich es implementieren würde. Also geh weiter, Posit-Video . Geben Sie dies eine Chance, und dann, wenn Sie fertig sind, nehmen Sie dieses Video wieder und Sie können sich meine Lösung ansehen. Es ist nicht die perfekte Lösung, aber es ist eine Lösung. Es gibt so viele verschiedene Möglichkeiten, Dinge in Programmiersprachen wie Javascript und Python zu tun , all diese anderen Sprachen, dass es keinen perfekten Weg gibt, dies zu tun. Aber ich zeige dir meine Lösung. Also pausieren Sie jetzt und geben Sie dem einen Schuss. Ordnung, ich werde Ihnen meine Lösung vielen Ereignis-Listern des Projekts Nr. fünf zeigen. Erste Dinge zuerst. Wir müssen drei Eingabeelemente erstellen. Möchten Sie die Hintergrundfarbe 1 ändern, um die Textfarbe zu ändern und Schriftgröße der Seite während der Eingabe zu ändern. All dies sollte sein, wie Sie einige eingeben, um hier in meinen Editor V s Code zu gehen, und zuerst brauche ich drei Eingabeelemente, also werde ich keine schön aussehende Seite mit irgendwelchen Mitteln machen. Ich werde einfach eine Reihe von Dibs Labels und Eingaben erstellen. Also Div wir werden ein Label hier drin haben, und dieses Label wird wieder für BG Farbe Hintergrundfarbe sein, das ist nur ein normales Etikett. Und dann lassen Sie uns voran gehen und bei einem Eingang in hier Form steuern einige grundlegende Bootstrap dort drin und das I D wird BG Farbe sein. Und so wird diese Idee zu diesem vier oder vier Label passen. Attribut hier und wir stoppen und aktualisieren Sie Ihre Seite. Wir werden hier über die Hintergrundfarbe sehen. Es wird nichts passieren. Wir haben noch kein JavaScript geschrieben. Jetzt wollen wir im Grunde diese doppelte Hintergrundfarbe, Text, Farbe und Schriftgröße kopieren Text, , und diese wird eine Nummer sein, also ändert sich die Telefongröße. Lassen Sie uns dies in Textfarbe ändern, und was ich tun werde, ist etwas, das Sie eine faire Menge in der Wildnis sehen. Aber anstatt diese Elemente durch ihre Ideen zu bekommen, was wir definitiv ein sehr schneller Weg sein könnten, dies zu tun. Ich werde sie von ihrem CSS-Selektor mit einem JavaScript-Präfix bekommen. Also Js und dann BG Farbe wird die 1. 1 Js Textfarbe ist die 2. 1 und Js Schriftgröße ist die 3. 1 Okay, lassen Sie uns aktualisieren und Sie wissen, dass es nicht die am meisten aussehende Seite ist, aber es macht den Job Jetzt müssen wir einige Abfrage-Selektoren erstellen, Wir müssen alle drei unserer Eingabefelder greifen, also lassen Sie uns voran und kreativ sind variabel. Nehmen wir an, BG Farbe wird sein, ich werde das einfach hier oben bewegen Dokumentpunkt-Abfrage-Selektor und wir wollen nur die 1. 1 Also Js BG Farbe, die diesem hier und dann hier passt, wollen wir Textfarbe und dieser wird Textfarbe sein und dann die 3. 1 ist wird Spaß machen Größe und dieser wird Spaß machen und Strich seufzt Okay, zu diesem Zeitpunkt, weil wir etwas Javascript schreiben, werde ich mit der rechten Maustaste inspizieren, gehen Sie zu meiner Konsole aktualisieren und ich benutze nur Firefox für diese und ich sehen, dass es in Jahren keine Fehler gibt. So das zum Beispiel würde das zum Beispieldort entstehen. Siehe Referenzluft SD s. D. A s ist nicht definiert. Also haben wir keine Fehler wie diese bekommen. Wir können also davon ausgehen, dass die Dinge gut aussehen. Als nächstes möchten wir die Hintergrundfarbe, den Text,die Farbe und die Schriftgröße der Seite ändern Text, , während wir tippen. Also brauchen wir hier einen weiteren Abfrage-Selektor. Wir müssen in der Lage sein, diese Stile am Körper zu ändern. Lasst uns gehen. Vier Körper ist gleich Dokumente Punkt Abfrage Selektor. Anstatt einen C s S-Selektor für eine Klasse hinzuzufügen, werden wir nur einen regulären CSS Collect Selektor für den Körper verwenden. Jetzt müssen wir hinzufügen oder Ereignis-Listener. Also lassen Sie uns sagen, BG Farbpunkt hinzufügen Ereignis-Listener. Wir werden sagen, auf dem Schlüssel nach oben diese spezielle Funktion mit dem Ereignis darin ausführen, und nur um sicherzustellen, dass dies tatsächlich funktioniert, lassen Sie uns die Konsole protokollieren den Ereignispunkt-Zielpunktwert Aktualisieren Sie Ihre Seite. Keine Fehler. Und wenn ich tippe, erscheint es hier unten. Okay, das sieht also gut aus. Das ist schön und gesund. Also jetzt für die BG-Farbe, alles, was wir tun wollen, ist Körper sagen, holländischen Stil Punkt Hintergrundfarbe. Denken Sie daran, es ist Camel Fall wie dieser und JavaScript. Es gibt keine Bindestriche in JavaScript-Variablen, daher verwenden wir Kamelgehäuse. Die Hintergrundfarbe ist gleich dem Ereignispunkt-Zielpunktwert, und das war's. Wir müssen nichts zurückgeben. Wir brauchen nichts Schickes zu tun. Lassen Sie uns voran und geben das eine Chance. Bam! Genau wie diese Hintergrundfarbe wird rot, wenn ich das Wort rot tippe. Nein, wirklich, alles, was wir tun müssen, ist ein paar Mal Gesichter zu kopieren. Hintergrundfarbe. Dieser wird Textfarbe Punkt Add Ereignis-Listener auf der Taste nach oben Körper Punkt Stil Punkt Hintergrundfarbe sein. Nein, wir möchten das in Textfarbe ändern, die in CSS nur Farbe genannt wird. Und das wird ein Ereigniszielwert sein. Und im letzten wird wieder Schriftgröße Punkt beim Ereignis-Listener sein. Key-up-Callback-Funktion mit einem Ereignisparameter dort, und wir werden sagen, Body Dot Style Schriftgröße ist gleich, was auch immer das ist. Außerdem werden wir acht Kincannon, vielleicht Pixel, vielleicht Pixel, oder wenn du Ems oder Widder machen willst, könntest du das auch tun. Ich bleibe bei Pixeln, damit ich eine normale Nummer verwenden kann, und es wird diese Seite nicht lächerlicher machen, als es schon sein wird . Lasst uns weitermachen. Klicken Sie auf Aktualisieren. Es gibt keine Fehler in meinen JavaScript-Konsuls. Lass uns das ein bisschen runter bewegen. Hintergrundfarbe wird blau sein. Textfarbe wird weiß sein. Schriftgröße wird neun Pixel betragen. Ah, vielleicht 90 Pixel. Ich meine, wirklich lächerlich. Lass uns etwas Größeres machen. Also haben wir Schriftgröße 25 Pixel, Textfarbe der weißen Hintergrundfarbe von Blau, und dies ändert sich, wenn wir tippen. Wir können hier sogar Hex-Werte verwenden. AB 00 Das ist rot F F Null, gelb oder aqua. Und so gehen wir über die Erstellung einer Seite, die sich so ziemlich ändert, wie Sie in verschiedene Eingabefelder eingeben . Also alle zusammen verwenden wir die Summe von 369 13 Zeilen JavaScript, um eine völlig dynamische Seite basierend auf dem, was der Benutzer will, zu erstellen. Und das ist alles, was es zu diesem Mini-Projekt gibt. Wenn Sie auf Skill-Sharing sind, vergessen Sie nicht,dass Sie Ihr Kursprojekt erstellen und es entweder über einen Code-Stift teilen können, oder Sie können es teilen oder Sie können Ihren genauen Code teilen. Wenn Sie auf Skill-Sharing sind, vergessen Sie nicht, dass Sie Ihr Kursprojekt erstellen und es entweder über einen Code-Stift teilen können, oder Sie Sie können einen Screenshot Ihres Codes machen und auch die Seite tatsächlich funktioniert. Fühlen Sie sich frei, Ihr Projekt mit dem Rest der Gruppe zu teilen. Sie schaffen wahrscheinlich am Ende eine Reihe von Inspiration für viele andere Menschen, die immer hilfreich für andere Menschen ist als auch. Außerdem gebe ich Ihnen Feedback, wenn Sie möchten. 40. Objekte: Okay, heute ist der große Tag. Das ist der große Moment. Wir haben so oft über diese Sache gesprochen, die ein Objekt genannt wird, und ich sage immer wieder, dass wir davon erfahren werden. Wir werden davon erfahren. Irgendwann werden wir davon erfahren. Jetzt ist es an der Zeit, dass wir darüber erfahren werden. Ein Objekt ist also eine schrecklich, schrecklich benannte Idee für eine Möglichkeit, Daten zu speichern. Denn wenn Sie an ein Objekt denken, , denken Sie darüber nach,etwas in der Hand zu halten. Und wenn jemand das Element beschreiben würde, das in Ihrer Hand ist, könnte das Wort Objekt zu jedem physischen Gegenstand passen, der wirklich jede Art von Masse oder Gewicht hat könnte als ein Objekt betrachtet werden, das nicht sehr hilfreich ist. Während ein Array im Grunde ein schicker Entwicklerbegriff für eine Liste ist. Nur eine Liste von Dingen variabel eine Variable. Wenn ich diese rechte Variable buchstabieren könnte, ist ein Wert, der sich ändert. Es ist eigentlich im Namen. Es ist variabel. In JavaScript ist eine Zahl offensichtlich nur eine Zahl, und in einer Funktion wissen wir, dass eine Funktion eigentlich etwas tun soll. Aber das Wort Objekt ist wie was? Was ist jetzt ein Objekt? Objekte haben grundsätzlich unendliche Komplexität. Also denke ich, wir sollten das einen Schritt nach dem anderen machen, und wir müssen nicht wirklich alles wissen. Das wird einfach zu viele Informationen sein, die Informationsüberlastung sein werden. Also, was ich tun werde, ist, Ihnen Objekte eine freundlichere Art und Weise vorzustellen. Wir wissen also, dass wir, wenn wir eine Liste in JavaScript erstellen, in einem Rennen erstellen können. Nehmen wir an, Ah, lassen Sie uns Namen erstellen ist gleich einem Array. Caleb Nathan endet immer und das war mein Typ ihrer Hauptstadt. A. Und wenn ich Namen wie diesen eintippe, ist das klar, dass Typnamen. Wenn ich Nathan bekommen wollte, müsste ich Namen hard bracket eingeben, die Nummer eins und dann eine andere Klammer, und das wird mir den Index hier geben. Aber was, wenn ich wollte, dass Teoh eine Reihe von Daten über eine bestimmte Person speichert? Also sagte ich, eine bestimmte Person, der Name ist Caleb. Sein Alter ist 30 Jahre und er hat zwei Katzen. Nein, das ist schön, aber wir wissen nicht, ob das notwendigerweise die richtige Reihenfolge ist, denn wenn ich hey sagte, aus all diesen Zahlen aus all diesen Variablen. Vielmehr, wie viele Katzen hat Caleb? Nun, das würdest du auch raten . Aber für alles, was du weißt, habe ich vielleicht 30 Katzen und das habe ich nur erwähnt. Und so gibt es diesen grauen Bereich, und wir wissen nicht, wie wir mit einem Objekt darauf zugreifen können, das wir nennen können. Lassen Sie uns also voran und erstellen Sie ein Objekt. Also werden wir ein Personenobjekt erstellen, und das Objekt sieht einfach so aus. Es ist eine Klammer, und dann geben wir ihr einen Namen. Also lassen Sie uns voran und tatsächlich nennen diesen Namen und Sie können sehen, dass es Klammern sind keine Klammern. Sie können sehen, dass es Zitate um diese. Sie können einfache oder doppelte Anführungszeichen sein. Es spielt keine Rolle, Doppelpunkt, und dann, was auch immer der Name ist, so wird im Grunde aussehen wie eine Zeichenfolge ist gleich mit. Ein Doppelpunkt ist gleich so ziemlich jeder Art von Variablen. Könnte eine Nummer sein. Es könnte eine Funktion sein. Es könnte ein Array sein. Es könnte Nein sein, es könnte ein anderes Objekt sein. Und lasst uns weitermachen und einen anderen erstellen. In deinem Alter. Mein Alter wird 30 sein und die Anzahl der Katzen, die ich habe, und um uns zu schließen, wir geben es einfach eine Schließung, Klammern oder nicht. Auszubildende, eine schließende lockige Klammer Hit, Geben Sie und da gehen wir. Wir haben jetzt ein Objekt. Und anstatt zu sagen, Nun, das ist ein Array, wo es genau wie Caleb ist, 32 ist das, was innen, bevor dies jetzt tatsächlich sagt, Alter ist gleich 30 Katzen, um Caleb zu nennen. Also jetzt, wann immer ich Person nehme, kann ich Person dot Alter gibt mir 30 Person Punktnamen gibt mir den Namen Person dot Katzen gibt mir die Anzahl der Katzen, und jetzt haben wir tatsächlich einen Namen zu einer Liste oder einem Array zugeordnet, und Sie können diese fast als interne Variablen betrachten. Also haben wir eine sehr mutige Person genannt. Aber im Inneren gibt es eine Variable namens Alter Variable namens name und Variable namens cats. Jetzt ist die Hauptsache, über ein Objekt zu wissen, ja. Es kommt mit großer Namensgebung, so dass Sie so ziemlich alles hier drin nennen können. Also Person Punktname gibt mir tatsächlich meinen Namen, was fantastisch ist, aber Sie können auch hinzufügen und dieses Schlüsselwort verwenden. Also haben wir etwas davon gelernt. Wir haben in der Array-Lektion gelernt, wo wir tun können, was das Array als Punkt Push bezeichnet wird, und das wird tatsächlich etwas an die Array-Person schieben, funktioniert nicht ganz auf die gleiche Weise. Wir können buchstäblich alles erschaffen. Also, Person, lasst uns hier etwas sehr Interessantes machen. Welchen Klang macht diese Person? Um einen brandneuen Datenpunkt innerhalb dieses Objekts zu erstellen, sieht es ähnlich wie ein Array aus. Wir geben ihm, was Art von Variablennamen wir wollen, es ist gleich, und dann, was auch immer wir wollen, dass es in diesem Fall gleich ist, werde ich uns eine Funktion geben und ich werde zum Rat Dot Log. Welches Geräusch macht es zu töten? Was sagt der Caleb? Der Typ sagt mich. Oh, ich weiß nicht warum, aber ich werde mir sagen, wie Hit Enter, Rette es. Und jetzt können wir tatsächlich die Funktion selbst sehen. Das ist, was es zurückkehrte, um zu funktionieren. Es heißt Sound hat keine Argumente. Okay, also habe ich das einfach aufgeklärt. Wenn ich nun wirklich sehen wollte, was in der Person Objekt ist, könnte ich einfach Person eingeben, und wir werden sehen, dass es einen Richter, Katzennamen und einen Ton gibt. Ein Sound als Funktion gibt uns jetzt alle Details da drin. Ich kann auch einfach Funktionspunktklammern machen, weil es eine Funktion ist. Funktionen sind Aktionen, Aktionen brauchen Klammern. Ich habe geschlagen. Geben Sie ein, stellen Sie sicher, dass hier Protokolle aktiviert sind, damit das Konsolenprotokoll tatsächlich angezeigt wird und es mich ausgibt. Und so nein, nicht nur hat meine Person eine Variable darin, meine Person hat auch, ah, Funktion in ihr. Nun, wenn es um Variablen und Funktionen innerhalb eines Objekts mehr innerhalb einer Klasse geht, haben sie im Allgemeinen unterschiedliche Namen, und dies sagt anderen Entwicklern, was der Umfang ist. Also in der Regel haben wir einen Variablennamen gleich Caleb, und dies wird nur Variable genannt. haben wir schon 100 Mal gesehen. Dann haben wir auch eine Funktion Funktion etwas, und es tut etwas in hier und dies Es wird eine Funktion genannt, wenn wir mit einem Objekt zu tun haben, so dass unser neues Objekt gleich ist, und der Name wird Caleb sein, By ist es egal, ob wir einzelne Apostrophe oder Anführungszeichen verwenden. Es spielt keine Rolle. Da ist es ein Koma. Das JavaScript weiß also, dass es hier ein anderes Objekt geben wird. Noch ein Stück Daten. Dieses Ding wird nicht mehr als Variable bezeichnet. Dies wird als Eigenschaft und Funktion bezeichnet. Also, wie wenn wir geschrieben haben, ist Sound gleich, um etwas hier drin zu funktionieren. Dies wird eine Methode genannt, so gehen wir zurück zu hören Person dot Alter wird eine Eigenschaft sein. Es verhält sich wie eine Variable. Grundsätzlich ist das Gleiche variabel, aber was wir sagen, ist, dass diese Variable tatsächlich zu einem Objekt gehört, oder in einigen anderen Sprachen gehört sie zu einer Klasse. Ebenso ist Sound mit Sound eine Funktion, aber es ist innerhalb eines Objekts, also nennen wir es eine Methode hat genau die gleichen Eigenschaften, und es funktioniert genau wie eine Funktion. Der einzige Unterschied ist, dass es sich jetzt innerhalb eines Objekts befindet, also nennen wir es eine Methode, und das ist wirklich nur eine Namenskonvention, so dass, wenn Sie mit anderen Entwicklern sprechen, sie verstehen können, was jetzt vor sich geht. Warum ist das wichtig? Dies ist wichtig, weil wir Person Punktton sagen könnten. Lasst uns überschreiben. Dies ist gleich der Funktion und wir wollen die Konsole protokollieren den Namen. Also machen wir diesen Punktnamen und wenn wir Person Punkt-Sound laufen, gibt er mir meinen Namen. Nun, hier ist das Schlüsselwort wirklich nützlich, weil wir einen Blick auf diese Person werfen. Objekt noch einmal, weil wir eine Funktion ausgeführt haben, die sich innerhalb eines Objekts befindet. Das Schlüsselwort this bezieht sich auf das gesamte Objekt, nicht nur auf die Funktion. Es ist das gesamte Objekt und so innerhalb einer Funktion. Scratch, dass innerhalb einer Methode können wir diesen Punktnamen verwenden, um Alter nicht Katzen nur auf Namen zu beginnen . Wir könnten sogar selbst zurückkehren, wenn wir wollten, was wir nicht gehen, aber wir könnten das gesamte Objekt zurückgeben, wenn wir nur sagen Return this wollen Lassen Sie uns voran und erstellen Sie eine brandneue Methode hier genannt Person dot Get cats. Dies wird eine Funktion sein und all dies wird tun, ist aufmerksam und die Anzahl der Katzen, die ich diesen Punkt Katzen alarmieren, In der Tat, In der Tat, lassen Sie dies tun diesen Punkt-Namen Captain E hat Katzen zu stoppen. Da gehen wir. Das wird also sagen, Caleb hat zwei Katzen. Gehen wir weiter und schließen Sie die Funktion ab. Okay, das war eingestellt. Wenn wir uns das Personenobjekt erneut ansehen, haben wir eine Funktion in Ihrem aufgerufenen Cats bekommen. Wir könnten dort Parameter übergeben, wenn wir es auch wollten. Genau wie bei einer regulären Funktion. Lass uns diese Person rennen, keine Katzen kriegen und lass mich das überziehen. Und da steht, Caleb hat zwei Katzen. Und so, als wir ursprünglich von dem vis Schlüsselwort gelernt haben, war es nicht wirklich super nützlich. Aber wenn wir anfangen, mit Objekten zu arbeiten, wird das viel nützlicher. Warum solltest du das jemals benutzen? Warum sollten Sie jemals ein Objekt wie dieses verwenden? Nun, man könnte sagen, Objekt Person ist gleich Caleb. Ich mache ein Geräusch. Ich habe einen Agenten hier 30 und ich muss Katzen. Und füllen wir das einfach vollständig aus. Der Rat meldet sich nicht. Nein. Der Grund, warum wir das verwenden würden, ist, weil wir jetzt Person Punktnamen verwenden können oder wie ändern wir dies in Caleb? Mich? Wir benutzen mich einfach als Beispiel. Caleb Dot Name wird Caleb sein. Vielleicht ist es mein vollständiger Name. Caleb erzählt Caleb Punktalter. Wenn Sie das lesen, macht das mehr Sinn. Jetzt die Caleb, Very Buller, das Karotte Caleb Objekt. Wie alt ist sein Alter? Wie viele Katzen hat er? Und das wird viel ausführlicher. Also, während Sie es lesen, macht das tatsächlich viel mehr Sinn, und Sie könnten dasselbe mit so ziemlich jedem machen. Nehmen wir an, wir hatten eine andere Person hier drin und sein Name ist Zephyr, der eigentlich meine Katze ist. Er sagt mir eigentlich, wie alt er ist für wie viele Katzen hat er? Keiner. Er hat keine. Eigentlich tut er das. Er hat einen kleinen Bruder. Also hat er eine Katze. Und jetzt könnte ich sagen, seine Mühe Katzen, und das wird mir eine oder seine Mühe geben, dieser Ton und das wird zu Konsolenprotokoll. Jetzt wieder, wo kommt das wirklich ins Spiel? Weil wir gerade nur ein Objekt verwenden. Nun, das kommt ins Spiel, denn bis zu diesem Punkt mussten wir all dies in separate Variablen speichern, damit wir eine Variable haben, die so aussieht , dass ihr Name gleich ist, was auch immer sein Name ist. Zephyr Zephyr. Alter ist gleich vier wie immer Katzen gleich eins ist, dass für Klang ist mir gleich. Oh, und dann müssten wir Rat machen, nicht einloggen. Ist das für Sound? Und so haben wir jetzt vier Variablen geschrieben. Und wenn wir eine Kopie davon an jemand anderes wollten, müssen wir für mehr Variablen richtig sein. Und wenn wir wieder bevölkern wollten, müssten wir erraten, was immer und immer wieder kopiert und eingefügt wird. Und so haben wir jetzt 12 Variablen im globalen Umfang der Dinge. Dies macht wirklich nur einen großen Durcheinander des globalen Umfangs, während mit ah, einem schönen Objekt, wir nur den regulären Variablennamen erhalten. Außerdem erhalten wir diese Eigenschaften und Methoden darin. Nun, als eine kleine Auffrischung hier, habe ich den da drin als eine schnelle kleine Auffrischung vermisst. Werfen wir einen Blick auf die Syntax eines Objekts. So wird die Objektsyntax so aussehen. Habe eine Variable von irgendeinem Typ und Sie haben zu Ihrem Variablennamen ist gleich einem Objekt. Das ist also deine öffnenden und schließenden geschweiften Klammern da drin. Und dann haben Sie einen Schlüsselpunkt, nicht den beizulegenden Zeitwert. Und dann, wenn Sie mehr haben, werfen Sie ein Komma hinein und dann gehen Sie wieder zu Wert. Wenn du mehr Nervenkitzel hast, komm da rein. Andernfalls hat der letzte kein Komma. Und wenn Sie dann auf einen von uns zugreifen möchten, könnten Sie einfach den Objektnamen schreiben und irgendwie wie wir auf Dinge in einem Array zugreifen, anstatt 0123456 zu verwenden und so weiter. So weiter. Wir haben gerade den Schlüsselnamen benutzt. Also Schlüssel wird Wert zurückgeben und ebenso Schlüssel zu wird Wert zurück zu jetzt. Das ist die Gesamtsumme direkt hinter einem Objekt. Sie werden diese wahrscheinlich nicht zu oft verwenden, bis Sie viel mehr Erfahrung mit JavaScript bekommen und dann plötzlich werden sie überall sein. Du gehst irgendwie von 0 200 in fünf Sekunden. Sobald Sie anfangen, sie zu sehen, werden Sie anfangen, sie überall zu benutzen. Aber da Sie nur Javascript lernen, werden Sie diese nicht überall verwenden. Noch nicht. Also was? Ich möchte, dass Sie eine kleine Aufgabe für dieses Video gerade erstellt Objekt zu tun. Vielleicht bist du es. Erstellen Sie also eine Variable. Wie auch immer Ihr Name ist, erstellen Sie das Objekt. Gib ihm einen Namen, ein Geräusch. Ah, in einem Alter, vielleicht dein Lieblingsessen, vielleicht deine Website. Und dann versuchen Sie einfach, einige der Dinge im Rat Ihres Browsers auszuführen. Geh weiter und gib dem eine Chance. Vergiss es nicht. Wenn Sie Fragen, Kommentare, Bedenken haben Kommentare , können Sie sie im Stich lassen. Sei niedrig. Ich bin hier, um Ihnen auf einen Blick zu helfen. Objekte sind eine sehr interessante Sache in JavaScript. Ich hoffe, diese Erklärung war in Ordnung. Es ist Dies ist eine dieser Hürden, wenn es darum geht, Objekte zu verstehen. Aber sobald du es hast, gibt es kein Zurück mehr. Also auf jeden Fall etwas Übung in es wird sehr, sehr wichtig auf der Straße sein. 41. für Schleifen: ein Low-End Willkommen zurück. Wir werden anfangen zu berühren und Konzept, das wirklich wichtig in der Programmierung ist, und dieses Konzept ist eine Schleife. Die Idee ist also, dass Sie eine bestimmte Funktion haben oder einen Code oder etwas gesetzt sind. Sie möchten mehr als ein Mal immer und immer wieder automatisch tun. Und so sagen wir, Sie haben eine Reihe von Namen. Also hast du Caleb, Nathan und Zephyr, und für jeden dieser Namen willst du ihn kapitalisieren. Sie möchten vielleicht an gmail dot com oder etwas am Ende davon setzen, um eine E-Mail-Adresse zu erhalten . Du willst all diesen drei etwas antun. Hier würde eine Vier-Schleife hereinkommen und es muss nicht nur drei sein. Es könnte ein Element sein, das sich in einem Array befindet. Wir werden in einer Sekunde darüber reden. Es könnten zwei Gegenstände sein, drei Gegenstände, 3000 Gegenstände. Es spielt keine Rolle. Es wird nur weiter schleifen, bis im Grunde alles erledigt ist. Lassen Sie uns also einen Blick auf eine Vier-Schleife werfen. Also vier Schleife wird ungefähr so aussehen. Wir haben ein Schlüsselwort für das wir gesagt haben. Eine Variable I ist gleich Null. Das ist also unser Intervall. Was auch immer das anfangen wird, das ist im Grunde unser Zähler. Wir werden in einer Sekunde mehr darüber reden. Wie lange soll das dauern? Nun, sagen wir, ich muss weniger als 10 sein. Und dann nach jeder Lupin-Belüftung nur inkrement ich um eins. Also lasst uns tun, ich plus Rat. Loggen Sie mich nicht. Und was das sagt, ist für die Variable. Ich werde bei Null beginnen, solange ich weniger als 10 ist. Konsole, log, was auch immer diese Zahl ist ich und dann am Ende jeder Generation, es ist irgendwie so, als würde ich sagen, dass ich gleich I plus eins ist. Das machen wir am Ende hier. Nur dieses Mal müssen wir das nicht ausschreiben. Also lassen Sie uns voran und speichern Sie uns und öffnen Sie dies in unserem Browser und aktualisieren Sie unsere Seite und wir werden 0123456789 sehen und Sie bemerken, dass alles online geschieht. 18. Also, wenn ich in das klicke und das über liegend 18 sicher genug schiebe, gibt es das Ratsprotokoll genau so? Also, dieser Punkt denkst du wahrscheinlich, Hey, das ist irgendwie cool, aber ehrlich gesagt, ich weiß nicht, wo ich das benutzen werde. Also lassen Sie uns hier ein echtes Lebensbeispiel erstellen. Lass uns ein A-Rennen erschaffen. Wir haben eine Variable von Namen, und das wird ein Array sein. Wir haben Caleb, Nathan Sud und Henry. Und sagen wir, wir wollen all das durchschauen. Wie sollen wir das machen? Stattdessen werde ich das kommentieren, nur damit du uns später verweisen kannst, wenn du willst. Lassen Sie uns hier eine neue vier Lupin erstellen. Lassen Sie uns tatsächlich sehen, mit welchem V s Code dies automatisch füllen möchte. Ja, das ist eigentlich ziemlich perfekt. Es macht ein paar Dinge hier drin, von denen wir noch nicht gelernt haben, also werde ich das rückgängig machen. Aber wenn Sie V s Code verwenden, können Sie einfach vier Tab drücken. Ihre for-Schleife beginnt also mit Ihrem vier Schlüsselwort für Variable. Ich ist gleich Null. Wir wollen schauen, wie oft wir die Anzahl der Elemente, die in diesem Array sind Schleife wollen. Also lassen Sie uns sagen, Namen Punktlänge und ich ist weniger als Namen Punktlänge. Also, was das sagt, ist eine za lang, wie Augen weniger als vier weiter rollen. Und dann am Ende jeder Generation, sagen wir Inkremente. Ich kaufe einen, den wir um zwei realisieren könnten. Wir hatten mit 10 multipliziert, wenn wir wollten. Aber am häufigsten werden Sie sehen, dass es nur um eins erhöht wird. Und dann könnten wir hier ein neues sehr Bowling kreieren und sagen, Ah, diese Variable ist der aktuelle Name. Und weil dies eine Liste ist, die wir auf diese Namen zugreifen müssen, wird Caleb Index Null Index ein Index drei Index sein. Und so können wir jetzt sagen, ich nenne. Die 1. 1 wird Null sein. Also in der ersten Iteration, und dann, wenn es fertig ist, wird es im Grunde hinter den Kulissen sagen, ich bin gleich I plus eins, und so läuft es ein zweites Mal. Und dann wird das Nathan und dann Zephyr und dann Henry sein. Aber wir speichern all das in einer Variablen namens I Just Interval steht für Intervall. Ich ist gleich Intervall. Lassen Sie uns voran und Konsole Loggers Council protokollieren nicht aktuellen Namen. Aktualisieren Sie unsere Seite Wie wir Caleb Nathan und Henry Cool bekommen. Also jetzt machen wir tatsächlich etwas mit einem Array, weil bis zu diesem Punkt eine Erhöhung für uns. Speichern Sie einfach eine Liste von Daten, und es ist nicht wirklich super hilfreich, es sei denn, wir wissen genau, was jetzt drin ist. Wir müssen nicht wissen, was genau darin ist, also lasst uns das ein wenig komplizierter machen. Lassen Sie uns hier eine Funktion erstellen, in der wir eine Eingabe in Kleinbuchstaben und upend bei gmail dot com machen werden. So Funktion. Lassen Sie uns dies an E-Mail-Adresse nennen, und es wird einen Namen nehmen und wir können es alles in einer Zeile jetzt tun, damit wir Namen tun können, von diesem Parameter kommt hier Punkt in Kleinbuchstaben plus bei Google Mail dot com. Und so ist das einfach kann Captain endet bei gmail dot com auf seinem unteren Gehäuse, alle Namen Also jetzt können wir nehmen, dass Sie es hier anwenden können. Wir sagen, der aktuelle Name wird sein, was auch immer der aktuelle Name in unserem Array ist. Hier wird es ein wenig komplizierter. Wir werden diesen Namen geben. Was auch immer der Name ist. hier als Parameter in die E-Mail-Adresse, und das wird zurückgeben, was auch immer der Name ist. Kleinbuchstaben und Dosenkatze Nate bei gmail dot com Also lassen Sie uns jetzt gehen und geben Sie dies ein Speichern . Und sieh dir das an. Caleb, Ein genialer Nathan Ojima, Zephyr Jima und Henry bei gmail dot com. Das ist nein, wir tun hier tatsächlich etwas Nützliches. Jetzt. Das Schöne daran ist, dass wir eigentlich nicht so viel Code schreiben. Und da dein Reagan länger und länger ist, schreibst du keinen Code mehr, was wirklich, wirklich schön ist . In der Tatkönnten wir, könnten wir, wenn wir das sogar reduzieren wollten, und anstelle des Namens werden wir Namen verwenden. Ich lass uns das loswerden. Lassen Sie es uns nicht wirklich löschen. Lassen Sie uns einfach auskommentieren. Und jetzt, 1234 fünf Zeilen Code, können wir diese vier ausführen. Konsul Lux, das scheint nicht viel zu sein, aber was ist, wenn wir etwas Verrückteres machen? Gehen wir weiter und machen eine Laura Epsom Schleife, also nehmen wir Florham 50. Und so haben wir nur 50 Worte von warmem ipsum hier drin Punkt aufgeteilt auf jeden Raum und was das tun wird, ist, sagen wir, sagen wir, teilen ihre Spaltung, ihre Spaltung , ihre Spaltung dort den ganzen Weg nach unten. Und das könnte Benutzereingabe sein Ball sein. Wir könnten es aufteilen. Und lasst uns von Namen ändern. Zwei Worte, nur weil es ein wenig schöner erscheinen wird, und wir ändern es von Namen. Zwei Worte hier auch. Also starten Sie Unvariable Null oder Intervall Null. Gehen Sie weiter, solange es Worte in diesem aufrechten gibt. Wir wissen, dass dies kein Array ist, weil wir Punktsplit verwenden, nachdem jede Lupin-Belüftung vorangeht und die Zahl erhöht. Ich kaufe einen aktuellen Namen. Also lasst uns diese aktuelle e-Mails machen Was wir sagen werden und was wir hier tun, ist, dass wir sagen, diese aktuelle E-Mail wird sein, was auch immer das Wort ist, kann Katyn acht bei gmail dot com kleinbuchstaben . Das wird also jedes einzelne Wort hier drin nehmen. Kleinbuchstaben jeweils und fügen Sie dann gmail dot com hinzu, was ziemlich sinnloses Beispiel ist. Aber das wird die Macht von Schleifen demonstrieren. Sieh dir das an. Es sind jetzt 50 von ihnen drin. Wir haben keine zusätzlichen Codezeilen geschrieben. Wir haben hier eine Codezeile. Es ist nur in mehreren Zeilen, weil dort eine lange Zeichenfolge drin ist. Mein Redakteur mag es, es in mehrere Zeilen zu zerlegen. Also eine Zeile zu Zeile drei Zeile vier Zeile in genau den gleichen fünf Zeilen Code. Wir haben jetzt 50 Ausgänge, die nicht sehr nützlich sind, und Sie werden die überall sehen. Dies ist in der gesamten Programmierung sehr beliebt, besonders in JavaScript. Nehmen wir an, Sie wollten nur die 1. 10 Ok, Nun, was wir tun könnten, ist, dass wir zu jedem Zeitpunkt aus dieser Schleife ausbrechen können oder wir könnten darüber fortfahren. Nun, was wir tun könnten, ist zu sagen, wenn ich gleich 10 ist. Also ist es das 10. Wort. Ich weiß nicht, warum wir das in diesem Beispiel tun würden, da wir jedes Wort durchlaufen wollen. Aber wir werden sagen, Hey, Hey, sobald ich auf die 10. Zahl Inkremente bis zur Zahl 10 kommt, einfach brechen, sonst läuft normal weiter. Und so wird das nur die 1. 10 zeigen und was wir hier tun können, ist, dass wir das Protokoll I plus die aktuelle E-Mail konsul können, damit wir all diese sehen können und was uns das zeigen wird ist von 0 bis 9. Und da ist es. Wir haben 0 bis 9, technisch 10 Artikel, weil wir bei der Zahl Null beginnen. Also, wenn Sie auf Ihre Hand zählen, 0123456789 Sie haben alle 10 Finger auf Ihrer Hand nach außen zeigen. Da bist du also. Und wir sagten: „ Hey, Hey, im 10. Intervall, brechen Sie einfach aus der Schleife aus. Nicht mehr zeigen. Lassen Sie uns voran und Kommentar sieht nicht, was passiert. Dies wird den ganzen Weg hinunter auf die Nummer 50 oder den 49. Index gehen. Gehen wir weiter und kommentieren das aus. Und lasst uns etwas Interessanteres machen. Wir werden hier ein paar grundlegende Mathematik verwenden. Wir werden dieses Ding namens Module verwenden, dem wir noch nicht wirklich gelernt haben, und es ist okay. Du brauchst nicht wirklich viel darüber zu wissen. Wir werden sagen, wenn ich ISS zwei Modul gleich Null ist. Das heißt also, was ich durch zwei geteilt werde, hat einen Rest von Null weiter, und dies wird über die Schleife überspringen. Also, was auch immer hier unten ist, zum Beispiel dieses Konsolenprotokoll. Das wird nicht laufen. Die Continue-Aussage sagt im Grunde, Hey, alles hier unten. Wenn dies fortgesetzt wird, wird die Anweisung ausgeführt. Dieses Zeug wird nicht ausgeführt. Gehen Sie auf die nächste Generation. Lass uns das speichern und mal sehen, was hier passiert. Wir bekommen jede 2. 1 Also, zum Beispiel, wir sehen nicht die Nummer 10 hier drin. 10 geteilt durch zwei ist fünf mit dem Rest von Null. Und weil das wahr ist, wird es fortsetzen, dass es nicht konsul wird. Also, das ist, wie wir erstellen gerade und ungerade Rose und wie Tabellen, wenn Sie haben, wie eine graue Reihe weiße Straße, graue Straße, weiße Straße, graue Straße, weiße Reihe Dies ist im Grunde alles, was wir tun. Das ist also deine Einführung in vier Schleifen. Dies ist eigentlich auch Einführung in wilde Loops und für jede Loops zu anderen Loops, werden wir sofort in. Was ich möchte, dass Sie tun, bevor Sie fortfahren, ist eine grundlegende for-Schleife zu erstellen. Also gehen Sie voran, verwenden Sie die vier Schlüsselwort-Variable. Ich ist gleich Null. Ich ist kleiner als, oder vielleicht weniger als und gleich ah bestimmte Länge. Ich plus plus, vergessen Sie nicht, das hinzuzufügen und dann vielleicht nur Konsolenprotokoll, was auch immer ich gerade bin. Und das ist alles, was ich von dir möchte. Holen Sie sich einfach ein wenig Erfahrung damit. Sie müssen kein Profi sein, um überhaupt mit der nächsten Lektion fortzufahren. Ich möchte nur, dass Sie sich mit dieser seltsam aussehenden Syntax vertraut machen, wie dieser Code mit lustigen Zeichen in einer lustigen Reihenfolge beschrieben wird. 42. Laufen: Okay, werfen wir einen Blick auf diese Idee einer wilden Schleife eine while-Schleife. Also lernten wir von einer Vier-Schleife in einer for-Schleife. Grundsätzlich sagt, Hey, ich gehe Zehenschleife, bis du mir sagst, ich soll aufhören zu schleifen. Eine wilde Schleife wird keine wilde Schleife. Wenn Sie damit nicht vorsichtig sind, wird man für immer weitergehen, bis Ihr Computer nicht genügend Arbeitsspeicher hat und entweder Ihr Browser abstürzt. Oder wenn Sie sich auf einem älteren Computer befinden, stürzt Ihr Computer ab. Seien Sie also sehr vorsichtig mit dieser wilden Schleife. Dieser ist sehr, sehr wichtig zu verstehen, bevor Sie tatsächlich eine im schlimmsten Fall schreiben hier ist Sie wissen, vielleicht läuft Ihr Computer nicht genügend Speicher und Sie müssen es einen Neustart geben, nicht das Schlimmste, was in die Welt, aber im Allgemeinen sperrt Ihr Computer nur. Sie geben es einen Neustart. Führen Sie das Skript nicht noch einmal aus und Sie können loslegen. Also schauen wir uns eine Weile an. Schleifen, Syntax. Also im Grunde, was hier passieren wird, ist, dass Sie eine Weile haben. Etwas stimmt. Mach ein paar Sachen hier drin. Es läuft wirklich auf etwas so einfaches hinaus, und was wir hier sagen könnten, ist var Numb gleich Null. Und sagen wir, während die Zahl kleiner oder gleich 1000 ist, könnten wir Rat dot log die Taub . Nein, führen Sie es nicht an diesem Punkt aus, weil das für immer laufen wird. Wir haben nichts mit Nummer in der vier Schleife gemacht. Wir haben es getan. Wir haben es automatisch in einer while-Schleife implementiert, die wir nicht getan haben. Also müssen wir dies manuell am Ende unserer Lubar am Anfang einer Schleife einfügen. Irgendwo drin, müssen wir die Nummer erhöhen. Also könnten wir sagen, Zahl ist gleich Zahl plus eins oder wir könnten einfach kein Plus plus und das wird uns 12345 So weiter und so weiter geben. Also lassen Sie uns voran und geben das eine Chance. Und wenn ich das aktualisiere, wird dies die Nummer 1000 mal und sicher genug, da ist es, und ich kann einfach weiter Curling. Scrollen Sie einfach weiter und Sie sehen, dass es tatsächlich 1000 gibt. Wann würden Sie jemals so etwas verwenden wollen? Nun, was wir tun könnten, ist, dass wir den Benutzer um eine Art von Eingabe bitten können. Also lassen Sie uns sagen, var taub wird Nummer sein und wir werden den Benutzer für eine Nummer auffordern . Geben Sie mir eine Nummer und dann werden wir die Aufforderung, was auch immer das sein wird, auf eine Nummer zu werfen . Und dann lasst uns das umschalten und sagen wir, Balken beginnend taub ist gleich Null, nicht 90 und lasst uns das loswerden. Lass uns das ändern. Lassen Sie uns anfangen Numb ist weniger als taub. Und was wir sagen, ist immer die Zahl Null gestartet und gehen, bis es erreicht, was der Benutzer sagt, Vielleicht ist es Nummer 10. Vielleicht ist es die Nummer 10 Millionen wird laufen, bis sie diese Zahl trifft. Außerdem müssen wir hier vorsichtig sein, weil dies die Zahl ist, die wir versuchen zu erhöhen. Also, während das wahr ist, müssen wir weitermachen diese austauschen. Also im Grunde, was das sagt, ist Null. Vielleicht ist der Benutzer, der in 1000 eingegeben wurde, hier weniger als 1000. Ja, das ist es. Also führe eins aus, dann zwei , dann drei , dann vier, dann 5000 mal, bis es 1000 weniger als 1000 ist. Ist es nicht. Das ist falsch. Und so hört es auf, auszuführen. Gehen wir weiter und geben dem eine Chance. Bewegen Sie das hier, damit wir mich um eine Nummer bitten können. Aktualisieren. Gib mir eine Nummer. Ich werde meinen Dyson rollen. Ich werde 89 sagen. Und der Konsul meldete 89, weil ich hier das Falsche gemacht habe. Wenn du auf deinen Bildschirm schaust, Caleb, du vergessen, einen zu wechseln. Du hast recht. Ich habe diesen Konsul protokolliert 89, weil das die Nummer war, die ich eingegeben. Ich wollte, dass Konta die Startnummer meldet. Die Zahl, die ständig inkrementiert wird. Lass uns voran gehen und ihm einen Schuss geben. wir so, als ob der 1. 1 nicht passiert ist und Nummer 89 da ist. Beginnt bei Null. Geht runter auf 88. Denken Sie daran, Computer beginnen mit der Zahl Null zu zählen. Obwohl, wenn wir wollten, könnten wir sagen, dass dies eins ist kleiner als oder gleich sein wird. Lasst uns weitermachen und 89 aktualisieren. Und das wird uns die Nummern eins bis 89 geben. Da ist es. Letzte Zahl ist 89 1. Nummer ist eins. Und so ist das eine Weile. Schlaufe. Nun, in modernem Javascript, sehen Sie diese? Ach, viel weniger als früher früher. Die waren überall. Diese sind jetzt weniger beliebt, weil vier Loops und die für jede Schleife, über die wir im nächsten Video sprechen werden, im Grunde genommen dort übernommen hat. Bessere Formen von Schleifen für JavaScript. Aber du wirst das immer noch da draußen sehen. Und wenn du dich fragst, Caleb, wo wir haben, werde ich eine wilde Schleife benutzen? Nun, was, wenn Sie eine Liste von etwas erstellen wollen Also, bevor wir mit der nächsten Lektion übergehen, machen wir weiter und erstellen ein weiteres Beispiel hier. Also werde ich das auskommentieren, damit es keine Computerressourcen von mir verwendet. Und lassen Sie uns eine Liste erstellen. Also haben wir UL Klassen Eagle Js Liste Schrägstrich Sie gut, und wenn ich meine Seite aktualisiere, sehen wir nichts hier drin. In der Tat, lassen Sie uns dies jede Liste tun. Also haben wir hier eine Auflistung, aber es gibt kein Listenelement, also müssen wir tatsächlich einige Listenelemente erstellen. Also lassen Sie uns Abfrage-Selektor verwenden, um dieses Element zu greifen Bisher, Liste oder besser gesagt, Sie l ist gleich Dokumente Punkt queary Selektoren bei Lecter. Es gibt nur einen, damit wir diesen benutzen können. Lassen Sie uns voran und erstellen Sie etwas HTML dafür. Also vier html ist gleich einer leeren Zeichenfolge. Und dann lasst uns das eine bestimmte Anzahl von Malen durchlaufen. Während etwas wahr ist. HTML ist Eagle zwei html plus Ally, was auch immer die Zahl sein wird. Also nennen wir es einfach Nummer, schätze ich. Könnte alles sein. Wir haben noch nicht so weit, also sind sie nur mit mir zusammen, um Ally zu schrägen. Und jetzt schreiben wir nur ein paar HTML hier drin, die sagen: Hey, Hey, es fängt mit nichts an. Bringen Sie einen Verbündeten da rein. Zweite Iteration kommt rein, sagt, es gibt eine L. Ich habe eine andere da reingesteckt. dritte Generation kommt rein, es ist bereit für Verbündete da drin. Setzen Sie noch einen da rein. Also lasst uns voran gehen und den Benutzer fragen. Für eine Reihe von unserem Taub ist gleich Lasst uns dies als eine Zahlenaufforderung werfen. Geben Sie mir eine Nummer und wir sagen, dass die Startnummer, die taub beginnt, Null sein wird . Und während das Starten taub kleiner ist als die Zahl, lassen Sie uns voran und starten Sie tatsächlich das, damit wir zählen können wie Menschen, nicht wie Computer. Die Startnummer wird also eins sein. Und solange diese Zahl kleiner oder gleich ist, was auch immer die Person Ihnen gibt, ist dies wird weiter laufen. Denken Sie daran, dass dies manuell implementiert werden muss. Also lassen Sie uns das manuell inkrementieren. Und an diesem Punkt wird nichts passieren. Wir haben gerade diese Variable namens HTML mit einer Reihe von HTML geladen. Jetzt müssen wir in rul voran gehen und dies tatsächlich in unser Dokumentobjektmodell hinzufügen. Also lasst uns weitermachen. Geben Sie ein, dass ul inneres HTML gleich ist, was auch immer die HTML-Variable ist. Aktualisieren. Gib mir eine Nummer. Okay, lass uns 42 machen und wieder, es hat nur 42 immer und immer wieder. Lassen Sie uns voran und lassen Sie uns die Iteration in der Oration geben, was auch immer diese Startnummer ist. Versuchen wir es noch einmal. Nummer 42 da ist es. Es Verehrung. 123456789 den ganzen Weg hinunter bis 42. Und während Loop tatsächlich einen Platz in der JavaScript-Welt hat, ist es heutzutage nur ein wenig weniger beliebt. Aber es ist immer noch sehr gut zu wissen. Du musst in diesem Video nichts tun. Lassen Sie uns auf die nächste gehen, wo wir haben, werden wir mit einigen der Dokumentobjektmodelle arbeiten und wir werden dieses Ding verwenden, das eine Vier-h-Schleife genannt wird, was wirklich, wirklich nützlich ist . 43. für jede Schleife: In Ordnung, lassen Sie uns einen Blick auf die wahrscheinlich nützlichste Version einer Schleife im JavaScript-Universum . Dies wird als vier jeder Schleife bezeichnet. Und weil wir dazu neigen, Case-Dinge in Javascript zu camel, sieht es so aus für jeden Kleinbuchstaben F Großbuchstaben E. Wir werden in nur einer Sekunde in die Syntax von uns kommen. Also für jede Schleifen sind relativ neu in JavaScript. Andere Sprachen haben diese Fort Ages gehabt. JavaScript hat dies erst vor kurzem in den letzten Jahren bekommen, und es war eine wesentliche Verbesserung des JavaScript-Ökosystems. Also für Ewigkeiten, im Grunde eine Abkürzung für die vier Schleife, die etwas in dieser Richtung aussieht. Sie hatten also Variable gleich Null. Tun Sie etwas für die Länge eines Arrays und erhöhen Sie automatisch. Was das stattdessen tun wird, ist einfach zu sagen, Hey, Sie haben eine Liste von Namen, Sie haben eine Reihe von Namen. Da sind fünf davon drin. Ich werde jeden für dich durchlaufen. Also lassen Sie uns diesem ein Beispiel hier geben. Far name ist gleich einem Array von Caleb. Nathan ist es immer und Henry hat fast das Wort Ende geschrieben und so vorher, wie wir durchschauen müssten. Diese sind irgendwie tatsächlich wachsen, also müssten wir für var tun. Ich ist gleich Null. Ich bin weniger als oder gleich zu wissen. Nur letzte Nacht Namen Punktlänge I plus plus. Und dann könnten wir Zweifel Log Namen I trösten und das wird uns alle geben. Lassen Sie uns voran und aktualisieren Sie Ihre Seite und wir werden sehen, dass dies funktioniert. Aber wenn du das wirklich schreibst, sieht das ein wenig zu viel aus. Es gibt einen einfacheren Weg, dies zu tun. Der einfachste Weg, dies zu tun, ist durch eine vier jeder Schleifen. Lassen Sie uns voran gehen und geben Sie Namen Punkt für jeden und dies wird eine Funktion zu nehmen, und diese Funktion hat zwei Parameter in ihm als Name und der Index. Und so wird der Name sein, was auch immer der Wert hier ist, so dass er möglicherweise nicht wirklich Name genannt wird. Sie können diese umbenennen, wenn Sie möchten, aber da dies Namen sind, werde ich diese Namen nennen, und das wird die Schleifeniteration sein, also wird der Rat nicht protokollieren, was auch immer der Index ist, und das sieht schon viel einfacher aus. Lassen Sie uns diese Seite aktualisieren. Wir haben Caleb Nathans Mühe und Henry genau so. Schön und einfach, wie es sein sollte. Kein Umgang mit unseren eigenen Generatoren und unserer It Belüfter Integer immer und immer wieder . Wir müssen das nicht inkrementieren. Wir müssen uns nicht mal darum kümmern. Es wird nur sagen, Hey, hier sind vier Gegenstände drin. Lassen Sie uns das viermal durchlaufen Jetzt ist es immer noch wichtig, beides zu wissen, weil dies die ältere Art ist , es zu tun. Sie werden dies überall aus Gründen der Abwärtskompatibilität in JavaScript sehen . Von hier an, werden Sie eine Menge von für jede Schleifen zu sehen. Nun, wo wird das eigentlich nützlich? Nun, was wäre, wenn wir den ganzen inneren Text von jedem einzelnen Verbündeten bekommen wollten , also , ... ich dotiere Js-Text und ich weiß nicht, Punkt eins. Tu das einfach immer und immer wieder. Okay, also habe ich gerade 17 Listenelemente gemacht, alle mit der gleichen Klasse, und ich möchte alle diese in Schleife durch sie auswählen und den Text hier reinbringen. Wie soll ich das machen? Lassen Sie uns voran gehen, kommentieren Sie dies aus und lassen Sie uns einen Abfrage-Selektor verwenden alle Also lassen Sie uns von unseren Verbündeten tun ist gleich Dokumente dot cree selector alle und wir wollen alle Js-Textelemente oder besser gesagt, alle Listenelemente mit einer Klasse von Js -Texte. Jetzt lasst uns diese durchlaufen. Wir haben Verbündete Punkt für jeden für jede nimmt eine Funktion. Das wird alles sein, was hier drin ist. Das wird also unsere besondere Notiz sein und dann wird es uns unseren Index geben. Jetzt. Was passiert, wenn wir nur ein Konsul Dot Logbuch? Okay, nicht ganz. Konsul Dialog Knoten Punkt inneren Text. Gehen Sie voran und aktualisieren Sie Ihre Seite und sicher genug, es zeigt sich alles in ihrem JavaScript. Also haben wir es geschafft, 17 Listenelemente zu durchlaufen und den Text von jedem in 1234 Codezeilen zu bekommen und dies ermöglicht uns auch, den Abfrageselektor zu aktivieren alles Wir konnten uns nicht wirklich zu viel verwenden, weil bis zu diesem Punkt während wir über Listen oder eine Gehaltserhöhung wussten, aber wir wussten nicht wirklich, wie wir sie jetzt durchlaufen sollten. Sie können auch den Old School Loop-Weg verwenden, wenn Sie es so machen wollten. Aber das ist jetzt einfach so viel sauberer, nur zum Spaß. Z's Lassen Sie uns voran und tatsächlich den Intertext dieser Notiz ändern. Also lasst uns Knoten Punkt inter Text gehen. Und nur um dies ultra klar zu machen, wo wir Knoten bekommen haben, war, Wenn ich diesen Typ in Verbündeten mache, gibt es mir eine Notizliste hier unten, und jede davon ist wie eine Abfrage, Selektor, regulärer Abfrage-Selektor. Und so haben wir gerade den regulären Abfrageselektor umbenannt, um im Grunde einen Variablennamen zu haben , der es Note genannt wird. Und da drin haben wir Zugriff auf all diese verschiedenen Dinge, und wir haben gerade gesagt: Hey, Hey, schnappen Sie sich die Notiz und holen Sie sich dann den inneren Text. Lassen Sie uns voran und ändert intertext in etwas anderes. Dieser Inter Tex wird Index multipliziert mit 12 werden. Was auch immer das sein wird. Und lasst uns das versuchen. Lassen Sie uns einige Klammern um dort und die Katze Nate eine Schnur hinzufügen und sehen, ob dies so funktionieren wird , wie wir beabsichtigten zu arbeiten. Das sollte also sagen, eine Zahl ist die Zahl, und sicher genug, da ist es. Null multipliziert mit 12 01 mal 12 ist 12. 16 mal 12 ist 1 92 Es ist jetzt im Grunde wieder, mit nur vier Zeilen Code. Sie können den Kommentar dort ignorieren, der nicht mehr notwendig ist. Mit vier Codezeilen konnten wir jedes einzelne Element hier durchlaufen und es so ändern, dass es sein sollte, was wir wollten. Jetzt gehen wir weiter und machen noch eine Sache. Nehmen wir an, wir wollen diese Liste aufschneiden. Das wird lustig. Nehmen wir an, wir wollen diese Liste auf nur 10 Artikel die ersten 10 Elemente schneiden. Also, was wir hier sagen werden, ist, wenn der Index gleich 10 ist? Nein. Das wird genau zehn sein. Wenn es größer als oder gleich 10 ist, gehen wir weiter und entfernen Sie diese Notiz. Lassen Sie uns es einfach vollständig aus dem Dokumentobjektmodell entfernen. Und dann lassen Sie uns auch weitermachen. Und so wird dies immer nur mit der 10. Iteration oder höher laufen, und das wird immer nur laufen. Angenommen, dass weiterhin nie ausgeführt wird, wird von Null bis in die Zahl 10 laufen. Aber wir sind hier nicht unbedingt in einer Schleife. Dies ist eine Funktion, die von jedem bestimmten Element in einer Liste oder in einem Array ausgeführt wird . Wie werden wir weitermachen? Wir können nicht fortfahren, da continue ein Schlüsselwort ist, das für Schleifen reserviert ist. Ausschließlich sind wir innerhalb einer Funktion. Was wir also tun können, ist falsch zurückzugeben. Und ich möchte, dass Sie auch damit experimentieren, wahr zu werden und einfach nur im Allgemeinen zurückzukehren. Aber gehen wir voran und kehren falsch zurück. Und wenn eine Aktualisierung der Seite, können wir hier sehen. 0123456789 Wir haben insgesamt 10 Artikel darin, und es ist alle anderen losgeworden. Lassen Sie uns voran und kommentieren Sie dies tatsächlich, so dass wir diese Indizes richtig sehen können. Artikel 1 bis 10 ist verfügbar. Wir sind 11 bis 17 losgeworden, also sind das vier. Jeder Schleifen. Auf den Punkt gebracht. Das ist wirklich wirklich schön, denn jetzt können wir tatsächlich sehr, sehr leicht mehrere Elemente von unserer Seite greifen und sie durchlaufen und etwas damit machen . Was auch immer das etwas ist, liegt ganz bei Ihnen. Aber jetzt weißt du, wie man mit vier Loops, wilden Loops arbeitet und für jede Loops würde ich mich sehr freuen, wenn du ein paar Minuten dauern könntest und einfach nur das Beispiel neu erstellt hast, das ich in diesem Video erstellt habe. Nur damit Sie ein wenig Erfahrung mit dem Punkt für jede Notation mit einer Callback-Funktion hier drin bekommen, waren diese unglaublich nützlich. Wenn Sie fortfahren, können Sie grundsätzlich einen Codeblock immer und immer und immer wieder ausführen , ohne immer und immer wieder kopieren und einfügen zu müssen. Also geh weiter, gib dem eine Chance. Und wenn Sie bereit sind, sich zuversichtlich zu fühlen gehen wir zum nächsten Video. 44. Guessing: Okay. Wir haben gerade etwas über Objekte und Schleifen erfahren. Dies sind zwei grundlegende Teile der objektorientierten Programmierung wie Javascript. Nun, was ich möchte, dass Sie für ein anderes Projekt tun, das größere Projekte hört, eigentlich nicht größer. Es wird nur ein bisschen mehr Mühe brauchen, um deine Gedanken zu umhüllen. Ich möchte, dass Sie ein Rätselspiel erstellen. Nun, wie du auch machst, das liegt ganz an dir. Sie können diese sehr nackten Knochen machen, oder Sie können es wirklich, wirklich schön machen und das Dokumentobjektmodell verwenden. Sie können es so einfach oder komplex machen, wie Sie möchten. Die Idee hinter diesem Ratespiel ist, dass Sie jemanden fragen sollten. Vielleicht ist es eine Eingabeaufforderung oder ein Eingabefeld oder ein Textfeld. Sagen Sie, hey, geben Sie eine Nummer ein. Und wenn diese Zahl die richtige Zahl ist, dann brechen Sie aus der Schleife aus. Sonst möchte ich, dass du es weiter durchschleifst. Nein, es klingt ein bisschen kompliziert, aber im Grunde möchte ich, dass du im Wesentlichen eins tust. Erstellen Sie eine Schleife, die immer eine Zahl und dann zwei fragt. Wenn die Nummer falsch ist, fragen Sie noch einmal und seien Sie einfach wirklich ärgerlich darüber. Und dann, wenn die Nummer korrekt ist. Brechen Sie aus der Schleife aus. Also überlasse ich das dir. Ich werde dir keine Hinweise mehr geben. Ich möchte, dass du versuchst herauszufinden, wie du das alleine machst. Eigentlich gelogen. Ich werde Ihnen einen Hinweis geben. Denken Sie daran, dass Schleifen immer so lange fortgesetzt werden, wie eine bestimmte Anweisung wahr ist. Wenn also die Logik der Schleife immer wahr ist, wird sie weiterlaufen. Wenn es nicht wahr ist, wird es nicht weiterlaufen. Es wird aus der Schleife ausbrechen. Geh weiter und gib uns eine Chance. Wenn Sie wirklich, wirklich stecken , können Sie einfach den Rest dieses Videos sehen und ich werde Ihnen die Art und Weise zeigen, dass ich es posten-Video hier. Ich werde dieses Video ausblenden und wieder verblasst, und ich werde dich sehen. Hoffentlich in ein paar Minuten. In Ordnung. Ich möchte eine Schleife erstellen, die nach einer Nummer fragt. Das erste, was zuerst ist, dass ich nach einer Nummer fragen muss. Bisher ist num gleich prompt. Was ist die Nummer? Und ich werde diese sehr nackten Knochen machen, also benutze ich Prompt. Aber Sie möchten vielleicht etwas anderes verwenden und dann werde ich alles, was diese Eingabe als tatsächliche Zahl darstellen. Und dann möchte ich sagen, wenn es tatsächlich eine Nummer ist, könnte ich hier drin etwas tun. Dann kann ich auch sagen, wenn die Zahl gleich der magischen Zahl ist, tun Sie etwas hier drin. Also, jetzt brauchen wir eine magische Zahl in Ihrem die magische Zahl wird 42 sein. Und was wir sagen, ist, den Benutzer nach einer Nummer zu fragen, wenn sie 42 übereinstimmt, was wir hier auch hart codieren könnten , wenn wir so etwas wollen. Dann gewinnst du. Also haben Sie gewonnen und lassen Sie uns voran und machen Sie dieses Konsolenprotokoll. Du gewinnst. Lasst uns weitermachen und erfrischen. Das wird mich um eine Nummer bitten. Wenn ich 41 nichts reinstelle. Wenn ich 42 Protokolle einlege, steht da, dass ich gewinne. Das ist fantastisch, aber es tut nicht ganz, was ich tun wollte. Ich sagte, wenn die Zahlen falsch, fragen Sie noch einmal. Okay, nun, wenn die Nummer falsch ist, könntest du es hier tun und ich werde nochmal gefragt. Aber das wird immer nur einmal laufen. Und an diesem Punkt muss ich das ganze Ding nicht so einfach kopieren und einfügen. Und wenn es wieder falsch ist, muss ich das Ganze hier kopieren und einfügen und wir können sehen, wie das ziemlich eklig wird . Geh weiter, füge das Ganze wieder in hier ein, immer und immer und immer und immer wieder. Wie oft wirst du das machen? Keiner. Ich will nicht, dass du das so oft machst. Hier kommen Schleifen ins Spiel. Also werden wir hier keine andere Aussage machen. Was wir tun werden, ist eine Schleife zu laufen. Also, während wahr, weil wir wissen, dass Schleifen immer ausgeführt werden, wenn sie wahr sind. Wir werden jedes Mal nach der Nummer fragen. Lasst uns das in unsere Schleife setzen. Also für jede Generation wird Sie fragen, was die Nummer ist. Wenn diese Zahl eine gültige Zahl ist und diese Zahl gleich der magischen Zahl ist, wird es sagen, dass Sie gewinnen. Also ist es machtwachsam, du gewinnst. Andernfalls wird dies nicht übereinstimmen. Also nichts tun, wenn Dies ist nicht einmal eine Zahl. Es wird nochmal nach einer richtigen Nummer fragen, aber wir haben hier ein bisschen ein Problem. Das wird einfach immer und immer wieder fragen. Und was ich tun werde, ist, dass ich aus dieser Schleife einfach so ausbrechen werde. Obwohl es also, if-Anweisungen hier gibt , wissen die Schleifen immer noch, dass es in einer Schleife ist, und wir können grundsätzlich immer noch break verwenden, lassen Sie uns voran und geben diesem einen Schuss. Aktualisieren. Was ist die Nummer 12? Nein. 32. Nein, eine verrückte Nummer. Nein. 42. Ach ha! Ich gewinne und das ist ein Rätselspiel. Jetzt gibt es einen Weg, dass wir das wirklich aufräumen können. Wir können zusätzliche if-Anweisungen verwenden, also können wir sagen, ob die Zahl tatsächlich eine Zahl ist, und das muss auch wahr sein. Wenn es also eine Zahl ist und die Zahl gleich der magischen Zahl ist, wird es darauf aufmerksam machen, dass wir eine Schleife ausbrechen und wir fertig sind. In etwa acht oder neun Codezeilen haben wir es geschafft, ein sehr nacktes Rätselspiel zu erstellen, und wenn Sie jemals diese Zahl ändern wollten, könnten Sie diese Zahl auch ändern. Gehen wir und ändern uns 109. Ich weiß nicht, ob das eine bedeutende Bedeutung in meinem Leben hat. Ich würde 108 sehen. Nein, das ist falsch. 110. Nein, das ist falsch. 109 schickte es. Und wenn Sie gewinnen, ändern Sie vielleicht den Hintergrundstil Ihrer gesamten Seite. Ändern Sie die Hintergrundfarbe zu blau, fügen Sie etwas Text in ihrem sagen, dass Sie gewonnen haben, was , eigentlich, wenn wir wollten, um dies ein wenig schicker, wir konnten total. So haben wir unseren Körper ist gleich Dokumenten. niederländische Abfrageselektor griff den Körper. Wir wollen das nicht in die Loop setzen, weil wir es nur einmal wirklich greifen müssen. Es muss nicht in einer Schleife sein, und dann könnten wir Body dot Style tun, dass die Hintergrundfarbe gleich blau ist. Lassen Sie uns tun Körper Punkt Stil Punkt Farbe ist gleich weiß und Körper Punkt inter HD Meilen gleich H eins. Sie gewinnen und brechen dann aus der Schleife. Versuchen wir es noch einmal. Was ist die Nummer 12? Nein. 32. Nein. 109 Ich gewinne. Und von hier aus weiß ich, dass du wirklich einfach diese Fans hier und Fans hier machen kannst, um zu verstehen, was hier vor sich geht . Ich habe gerade gesagt, diese weiße Schleife für immer ausführen. Bis wir etwas anderes sagen, brechen wir absichtlich aus? Wir verwenden keine bestimmten Zahlen oder so etwas. Wir verwenden nur eine Schleife, die für immer ausgeführt wird, bis es anders gesagt wird. Und so erstellen wir ein einfaches Ratespiel. Wenn Sie Fragen, Kommentare oder Bedenken zu diesem bestimmten Projekt haben, gehen Sie weiter. Lassen Sie sie unten. Und vergessen Sie auch nicht, dass Sie Ihr Skill-Share-Projekt mit dem neuesten Code aktualisieren können, den Sie haben. Machen Sie einen Screenshot oder teilen Sie ein Video oder teilen Sie Ihren Mantel auf Codestift. Das Teilen Ihres Projekts ist eine großartige Möglichkeit, um zu zeigen, dass Sie Fortschritte für den Rest der Klasse machen. 45. Lass und Konst.: In den letzten Jahren hat JavaScript als eigentliche Programmiersprache viele Fortschritte gemacht. Es begann nur als Skriptsprache. So das Namensskript. Aber es hat sich in den letzten 5 bis 10 Jahren wirklich zu einer eigenen Sprache entwickelt. Und damit kommen einige ziemlich coole Veränderungen. Aber einige Dinge, die sich auch ein wenig von anderen Programmiersprachen unterscheiden. Und der, über den ich in diesem Video sprechen möchte, ist lassen und const lassen und konstant, so bis jetzt haben wir jede Variable mit var definiert. Var Name ist gleich Caleb. Wir könnten auch verwenden let Name ist gleich Caleb und wir könnten auch konstante Name verwenden gleich Caleb. Wir könnten jede dieser drei jetzt verwenden, es gibt Unterschiede hier. Wir wissen über Var und Hebezeuge. Wenn Sie sich nicht erinnern, was Hebezeuge ist, gehen Sie zurück zu diesem Hebevideo und nehmen Sie einfach eine schnelle Wieder über, dass nur um sicherzustellen , dass Sie vertraut mit dem, was Hissen ist. Wir wissen wieder über den Umfang. Es gibt ein Video auf dem Geltungsbereich. Du wirst dir das noch mal ansehen wollen. Stellen Sie sicher, dass Sie mit der Idee des Bereichs etwas vertraut sind, da lassen Sie und konstante R Block . Und was das bedeutet, ist var Name gleich Caleb ist in einer Funktion wie dieser Funktion zugänglich . Holen Sie sich den Namen Council Dot Logname. Ich könnte das sogar tun. Ich könnte Name ist gleich dem neuen Namen, und dann könnte ich den neuen Namen hier unten Konsole protokollieren. Also Konsolenprotokoll Name wieder und lassen Sie uns voran gehen, kommentieren Sie diese aus. Und dann lassen Sie uns diese Funktion direkt hier ausführen. Und so sagt Caleb und neuer Name. Und so ist das Schöne an weit ist, dass dies jetzt im globalen Bereich ist und eine Funktion es verwenden kann . Wir können sogar überschreiben, was der Wert war, sobald wir die Funktion aufrufen. Und dann ändert sich der Name tatsächlich mit let und ständig. Versteh das nicht. Wir bekommen tatsächlich mehr Einschränkungen. Jetzt. Das Interessante an guten Programmiersprachen, Sie wollen Einschränkungen. Es scheint zunächst nicht so zu sein, aber eigentlich tun Sie das, weil je weniger Freiheit Sie in einer Programmiersprache haben, normalerweise bedeutet, desto schneller wird die Sprache ausgeführt. Mittel wird weniger Speicher in Ihrem Computer benötigen bedeutet, dass mehr Leute Code schreiben , der genau die gleiche Weise aussieht, bedeutet bessere Standards. Grundsätzlich ist es weniger ein Chaos, wenn es mehr Regeln gibt und was lassen und konstant tun, ist mehr Regeln einzuführen. Also lassen Sie uns voran und erstellen Sie hier ein Beispiel. Also haben wir eine Variable, und der Kurs ist gleich JavaScript für Anfänger. Und was wir hier sagen können, ist, wenn der Kurs gleich JavaScript für Anfänger ist, Konsul dot lug diesen Kurs. Ich möchte nur sicherstellen, dass das funktioniert. Also lassen Sie uns fortfahren und unsere Seite aktualisieren. Sicher genug, es steht jetzt dieser Kurs. Wenn ich eine andere Variable definieren wollte, würde ich weit tun Etwas ist gleich etwas anderem. Und dann könnte ich sagen, Konsul, loggen Sie nichts auf. Also sieh dir das an. Das wird immer noch etwas funktionieren. Was lassen Sie tun, ist, dass es Hey sagt , Sie haben eine Variable, aber ich werde es auf diese geschweiften Klammern ausweiten, und wenn Sie versuchen, etwas außerhalb dieser geschweiften Klammern zu protokollieren, wird es nicht funktionieren. Lassen Sie uns das eine Chance geben und sehen, worüber es sich beschwert. Es gibt einen Fehler in der Referenzluft. Etwas ist nicht definiert Ich liebe, wie es etwas verwendet, als ob es tatsächlich Teil der Luft war . Lasst uns das auch ändern . Ein neues Var. Da gehen wir, ein neuer Virus, nicht definiert. Das scheint ein wenig ausführlicher zu sein, obwohl wir sehen können, dass ein neuer Balken tatsächlich definiert ist. Aber was das sagt, ist, dass diese Variable nur innerhalb dieser Klammern verwendet werden kann. Es sind geschweifte Klammern. Und was? Lassen Sie uns diese Variable Onley innerhalb von hier zu verwenden, so dass es auf diese geschweiften Klammern beschränkt ist. Aber wir können es auch überschreiben. Lassen Sie uns also Variablen überschreiben, die Luft zu Ihrem nächstgelegenen Satz von geschweiften Klammern . Und wenn ich das hier oben schiebe, werden wir sehen, dass das Konsolenprotokoll etwas anderes ausspuckt. Sicher genug, es sagt etwas anderes. Und wenn ich versuche zu konsolen, protokollieren Sie dies erneut ein zweites Mal, wir werden sowohl ein Protokoll als auch einen Fehler erhalten, also erhalten wir ein Protokoll und einen Fehler. Also der Hauptunterschied zwischen Var und let ist let ist auf wieder diese geschweiften Klammern begrenzt. Es ist wichtig zu wissen, dass, weil Sie Code da draußen sehen werden, der sagt, Lassen Sie, was auch immer der Variablenname ist , etwas gleich ist, und Sie können dann nicht außerhalb der übergeordneten geschweiften Klammern darauf zugreifen. Aber gehen wir weiter und werfen einen Blick auf Const. Also hören Sie das CONST. Ist etwas das Gleiche. Const. Ist eine Variable, die den Bereich zu den nächstgelegenen geschweiften Klammern darstellt, als Blockumfang bezeichnet wird. Aber Const steht für konstant. Es ist eine Variable, die sich nicht ändern kann, was eine lustige Art ist, im Grunde zu sagen, dass dies ein Wert ist, und dieser Wert wird sich nie, nie , , jemals, jemals, jemals ändern. Und so ist es nicht mehr wirklich eine Variable mehr als es ein konstanter Datenpunkt ist, der sich nie ändern wird und so, mit Konstante, sie nicht überschreiben durfte. Wenn wir das loswerden, wird das perfekt funktionieren. Finanzierung sagt etwas. Wenn wir versuchen, dies zu überschreiben, weil es bereits hier definiert wurde. Wenn wir versuchen, es neu zu definieren, wird es uns einen Fehler werfen. Sehen Sie sich an, dass ungültige Zuweisungen zu Const. Ein neuer Virus. Sie dürfen keinem Konzert etwas zuweisen, also gibt es tatsächlich Nutzen, wenn Sie eine reguläre Variable verwenden, zum Beispiel natürlich, natürlich, es kommt mit einer Reihe von Methoden, die grundsätzlich auf der Zeichenfolge -Objekt. Es kommt mit einem Haufen verschiedener Dinge hier drin. Wir können eine Tonne von ihnen auch in Ihrem sehen, und einige von ihnen erlauben es uns, den Wert tatsächlich zu ändern. , verfügt Const natürlich Während Const uns das nicht erlaubt, verfügt Const natürlichnicht über alle Funktionen, mit denen eine reguläre Variable kommt, weil sie sich nicht ändern kann. Was ist also der Sinn, ihm eine Methode oder Funktion zuzuweisen, wenn wir diesen Wert überhaupt nicht ändern können ? Es gibt also tatsächlich einen ziemlich großen Leistungsgewinn, und weil es blockübergreifend ist, müssen Sie sich keine Sorgen darüber machen, dass aus diesem Leck austritt. Wenn Sie Ihre Javascript-Funktion angeben, muss Ihr JavaScript-Programm sich nicht darum kümmern, viel davon zu lange im Speicher zu speichern , und so ist es nur eine wirklich schnelle Möglichkeit, Variablen zu verwenden. Nun, wenn das alles ein wenig zu verrückt für dich klingt, kannst du dir das so vorstellen. Var ist im Grunde eine Variable, die auf die globale Umgebung beschränkt werden kann. Lassen Sie den Bereich zu den nächsten geschweiften Klammern blockieren. In der Tat, lassen Sie uns dies tun und const unseren Block auf die nächsten geschweiften Klammern. Lassen kann geändert werden. Konstante kann nicht geändert werden. Und das ist der Hauptunterschied. Und Sie werden diese überall in modernem JavaScript sehen. Also haben wir bis jetzt VAR verwendet. Aber wenn wir vorwärts gehen, werden wir wahrscheinlich Feuer benutzen. Lassen Sie und const Sie wissen, was ich möchte, dass Sie tun, Ah, schnelle kleine Aufgabe hier ist, eine let-Variable innerhalb einer vielleicht einer if-Anweisung oder einer for-Schleife oder etwas zu erstellen , und versuchen Sie dann, es außerhalb Ihrer if -Anweisung und dann rechts, eine const-Variablenkonstante. Und dann versuchen Sie einfach, den Wert dieser const-Variablen zu ändern, und es wird Ihnen einen Fehler werfen . Sobald Sie diese Fehler erlebt haben und wie sie tatsächlich funktionieren, beginnt es viel mehr Sinn zu machen und wir werden diese vorwärts verwenden. Sie werden viel mehr Erfahrung mit diesen erhalten, während wir den Rest dieses Kurses durchlaufen 46. Einführung in OOP: Okay, jetzt kommen wir in ein paar der lustigen Bits. Das ist die eigentliche Programmierung. Dies hat weniger mit dem Dokumentobjektmodell zu tun. Mehr als mit tatsächlichen Programmiergrundlagen mit einer Sache zu tun hat, die in 00 P. eine objektorientierte Programmiersprache genannt wird. Nun, Nun, während das klingt irgendwie komplex und zunächst ein wenig komplex, wirklich Alles, was es ist, ist eine Möglichkeit für Sie, Ihre Variablen und Funktionen zusammenzufassen, um Ihren Code gut organisiert zu halten und die Koduplizierung zu reduzieren. Also erinnern Sie sich, als wir ein Personenobjekt im Objektvideo erstellt haben? Wir haben so etwas wie diesen Namen Fortsetzung Kaye Love erstellt und das Alter ist gleich 30 Yadi Yadi Yadi auf so etwas. Das ist es, was wir am Ende erschaffen haben. Dies ist im Grunde objektorientierte Programmierung, weil wir hier ein Objekt haben, und dann haben wir Objekt-Punkt-Eigenschaft, die zurückgibt. Caleb Person dot Alter ist gleich 30. Es gibt tatsächlich eine schönere Art, dies in modernerem JavaScript zu schreiben, und das ist durch diese Idee einer Klasse. Und das Schöne an einer Klasse ist im Grunde, dass Sie Ihr gesamtes Personenobjekt nehmen können und Sie es immer und immer wieder kopieren und einfügen können. Sie können ihm Standardwerte geben, so dass es im Grunde dieses Objekt für Sie mit nur einer einzigen Codezeile erstellt . Sie müssen nur diese Funktionalität zuerst ausschreiben. Also schauen wir uns das an. Wir haben Klasse, Person, und so sieht Ihre Syntax im Wesentlichen aus. Es ist nur Keyword-Klasse. Was auch immer Ihr Klassenname ist, im Allgemeinen beginnt es mit einem Großbuchstaben P , aber wirklich, das liegt an Ihnen. Und dann haben wir hier Funktionen und Variablen genannt Methoden und Eigenschaften. Also haben wir hier eine Funktion namens Make sound, und all dies wird tun, ist Rat. Loggen Sie mich nicht ein. Oh, jetzt zwei in Stan, sie aß oder um eine Klasse wie diese zu starten, weil dieser Code möglicherweise im Hintergrund ausgeführt wurde , aber nicht wirklich irgendwo gespeichert ist. Nun, das ist irgendwie so, wie es aussehen würde, wenn wir hier eine reguläre Funktion schreiben. Lass uns weitermachen und das loswerden. Wir brauchen es nicht, weil Javascript klug genug ist, um es zu wissen. Hey, das ist keine Variable. Das ist eine Funktion. Und jetzt in Stan. Sie hat das gegessen, um diese Klasse zu beginnen. Wir tatsächlich, um dies in eine Art Variable zu speichern, damit wir Const tun können. Caleb ist gleich einer neuen Person. Das ist also unsere Syntax hier. Wir haben Schlüsselwort Klasse. Was auch immer Klassenname ist, der hier zum Öffnen und Schließen von geschweiften Klammern passt. Und dann haben wir hier nur eine einfache Funktion. Es ist eine Funktion innerhalb eines Objekts, dass Klassen Objekte sind. Und so nennen wir dies eine Methode. Und so sagten wir, Hey, benutze Const. Kayla, weil dies nicht wird, um das Zeug in es ändern könnte. Aber das selbst wird sich nicht ändern und dann machen Caleb dot klingen mit Klammern da drin , weil es eine Funktion ist, es ist eine Methode. Lassen Sie uns voran Auffrischungsseite gehen, und wir können sehen, dass es mich sagt. Oh, warum ist das so genial? Nun, denn jetzt kann ich eine andere Person machen. Ich kann ihn Nathan nennen, und wir können beide dasselbe Geräusch machen. Und alles, was ich getan habe, war richtig. Eine zusätzliche Codezeile und es nahm alles hier hinein und wandte es auf diese eine zusätzliche Codezeile an, die in einer Variablen in einem konstanten alten Nathan begann. Und jetzt werden wir beide den Klang von Miao machen, also wird das zweimal auftauchen. Miami. Du siehst, dass zu ihnen das bedeutet, dass zweimal aufgetaucht ist. Gehen Sie weiter und machen Sie das rückgängig. Lassen Sie uns nun voran und fügen Sie einige Standardwerte hinzu. Nehmen wir an, eine Person braucht einen Namen und Alter und ihr Lieblingsessen. Im Gegensatz zu einer Funktion, bei der es wie Name, Alter und Essen sein würde , tun wir dies irgendwie. Aber wir müssen den langen Weg dafür gehen. So erstellen wir eine neue Funktion, eine neue Methode in hier namens Construct. Äh, das ist ein magischer Funktionsname. Sie können tatsächlich sehen, dass es rosa ist. Das ist ein reserviertes Wort, das ein Schlüsselwort ist. Und dann können wir diese Werte hier hineingeben, damit wir sagen können: Wie ist der Name der Person? Wie alt ist das Alter der Person? Was ist das Lieblingsessen der Person? Dies ist eine Funktion, die sie einfach nicht sagt, Funktion davor. Aber das ist eine Funktion. Und dann könnten wir sagen, Konsul, diesen Lognamen, Alter Essen und lassen Sie uns voran gehen und werfen die Standardwerte hier rein. Also wird mein Name Caleb sein. Mein Alter wird 30 sein und mein Lieblingsessen wird zahk sein. Refresh sagt Caleb. dreißiger Jahre sind jetzt so. Wir haben tatsächlich Werte in unsere neue Klasse gesetzt. Wir könnten weitermachen und ein neues schaffen. Lassen Sie uns loswerden, Ton zu machen. Wir brauchen diese neue Person nicht. Dieser wird Nathan sein und er wird 28 sein, sein Lieblingsessen wird ein Salat sein . Und wir werden Caleb sehen, 30 Pizza Nathan, 28 Salat. Und wir könnten das immer und immer wieder tun. Und jedes Mal, wenn wir hier mehr Code hinzufügen, wird dies beide gleichermaßen beeinflussen, was wirklich schön ist. Und jetzt schreiben wir ein Stück Code, der mehrere Bereiche einer Website oder mehrere Funktionen beeinflussen kann . , Was wäre,wenn ich wollte, dass Caleb sagt mm zu, und was auch immer das Essen gut ist, leider, weil das Objekt ist, können wir nicht einfach Essen sagen, und wir können nicht einfach sagen, Name. Das wird einfach nicht funktionieren. Also lassen Sie uns voran tun Caleb Punkt machen Sound machen Yammer-Sound. Es ist tatsächlich, dass die Syntax dort repariert wird. Speichern Sie das und aktualisieren und Essen ist nicht definiert. Obwohl Essen hier ist, haben wir es hier gegeben. Wir haben es sogar hier und hier vorbeigefahren. Aber aus welchem Grund auch immer sind coda sagen Essen ist nicht definiert. Und das ist wieder, wo diese Idee des Schlüsselworts ins Spiel kommt. Also in unserer magischen Konstrukt er Methode hier, könnten wir dies tun. Dot Name ist gleich zu nennen, dieser Punkt Alter ist gleich Wir könnten es werfen, wenn wir wollten, Alter dieser Punkt Essen ist gleich Nahrung und wir könnten loswerden, dass. Und was das sagt, ist, Hey, es gibt eine Eigenschaft in dieser Personenklasse namens Name. Es gibt noch einen, den man Alter nennt, und es gibt einen anderen namens Essen. Und wenn wir also unsere Parameter in diese Personenklasse Caleb, 30 Pizza übergeben , wird das sagen OK, naja, ja , sicher, ich verstehe, dass diese alle an die erste Funktion, sondern auch diese über die gesamte Klasse verfügbar machen. Also, jetzt könnte ich dies zu diesem Punkt-Namen ändern sagt Essen sagt ihm zu diesem Punkt-Essen, eher. Und lassen Sie uns das auf mehrere Zeilen setzen, weil wir es können. Und jetzt wird das sagen, Caleb sagt MM zu Pizza. Und wieder alles, was ich hier tue, zu sagen, Const. Caleb ist gleich einer brandneuen Personenklasse. Der Name ist Caleb. Das Alter 30 Lieblingsessen ist Pizza, und wieder, das passt einfach hier oben wie eine normale Funktion. Es ist zufällig, dass dieser Konstrukt genannt werden muss. Äh, lasst uns das auffrischen und sagt, Caleb sagt zu Pizza und wieder, der Schlüssel hier ist wirklich das Schlüsselwort dieses Schlüsselwort. Dies ermöglicht es Ihnen, diese Variable in jede andere Funktion innerhalb der Personenklasse zu transportieren . Aber wenn es hilft, finde ich, dass das mir tatsächlich geholfen hat, als ich ursprünglich so lernte. Es sieht so aus, als ob dieser Name gleich ist, was auch immer der Name sein wird. Dieses Punktalter ist gleich, was auch immer das Alter sein wird, und diese Punktnahrung ist gleich, was auch immer das Essen sein wird. Und all das sagt: Hey, Hey, es gibt eine Variable außerhalb dieses Funktionsbereichs, die diesen Punktnamen genannt wird und sie einfach dem zuzuweisen was auch immer das ist. Es gibt noch einen, der dieses Punktalter genannt wird. Weisen Sie es zu, was auch immer wir ein Richter sein wollten und dieses Punkt-Essen. Und so denken Sie es im Grunde so. Wir nehmen nur eine Variable aus einem höheren Bereich und ändern den Wert davon auf Lee. müssen wir nicht ausschreiben. Und wenn wir es wollten, könnten wir auch hierher kommen. Und wir könnten sagen, Nathan Dot Ton machen, Zahlen klingen Auffrischung Seite. Das wird sagen, Caleb sagt, gehen Sie in Pizza. Der nächste wird auch sagen, Nathan sagt bald zu Salad, genau wie das jetzt, das mag diesem Zeitpunkt nicht super nützlich erscheinen, aber wenn Ihre Logik wächst, macht es Sinn, Dinge zu gruppieren die zusammen sind. Anstatt also ein Array, ein Objekt und eine Reihe von Funktionen für eine einzelne bestimmte Person und dann für eine zweite und die dritte und vierte Person immer und immer wieder zu kopieren und einzufügen , könnten wir wickeln Sie all dies zusammen, weil es alles in eine Klasse verwandt ist und dann sagen Sie einfach hey, benutze eine neue Person. Wir können dies sogar weiter ausdehnen, wenn wir es wollten, um zusätzliche Dinge zu tun, also könnten wir sagen, dass dies die Basis ist. Aber dann, wenn wir sagen wollten, ob die Person Teil des Militärs ist, haben sie zusätzliche Funktionen oder zusätzliche Funktionen. Wir werden in diesem Video nicht darauf eingehen. Dies schließt im Grunde die gesamte Unterrichtsstunde ein. Was ich möchte, dass Sie tun, ist, das eine Chance zu geben. Erstellen Sie eine Klasse, erstellen Sie eine magische Konstrukt er Funktion. Wir können alle Parameter nehmen, die Sie wollen. Sie werden definitiv das Schlüsselwort this verwenden und dann eine Funktion erstellen möchten. Eine andere Funktion spielt keine Rolle, wie sie genannt wird, und versuchen, darauf zuzugreifen. Zum Beispiel, dieses Punkt-Essen. Auch wenn wir hier kein Essen hineingezogen haben, konnten wir es bekommen, indem wir dieses Punktfutter sagen, weil dies sich auf die gesamte Klasse selbst bezieht . Schließlich stattdessen Ihre Klasse, aß sie stattdessen Ihre Klasse,indem sie sagte, Const, Ihr Name ist gleich einer neuen Person oder was auch immer Ihre Klasse sein wird, und führen Sie dann die Methode dort aus, dass Funktion Mine hieß Make sound. Sie können Ihren Namen mit Ihrem Namen ausführen, und dann Klammern. Dies ist auch eine dieser Ideen, die eine große Hürde für Programmierer ist, um über zu kommen. Aber sobald Sie etwas über objektorientierte Programmierung erfahren und es beginnt, viel mehr Sinn für Sie zu machen , wird das Leben als Entwickler viel einfacher und Sie springen von diesem Anfänger oder Junior-Status zu einem Zwischenstatus. Weil man anfängt zu verstehen, wie sich Daten für zwei andere Funktionen auf sich selbst beziehen oder wie man Dinge gruppiert, und alles fängt an, sich zusammenzufinden. Also gib uns definitiv eine Chance. Und, hey, wenn Sie Fragen haben, vergessen Sie nicht, dass es einen gemeinsamen Abschnitt unten gibt. Sei niedrig. Ich bin jederzeit gerne behilflich. Bitte stellen Sie Fragen, wenn Sie Hilfe benötigen. 47. Erweiterte Kurse: Alles klar. In dieser letzten Lektion sprachen wir über eine Einführung in die objektorientierte Programmierung, und wir sprachen über Dinge wie Eigenschaften, Methoden, Methoden, magisches Konstrukt, er und das Schlüsselwort dieses Schlüsselwort in dieser Lektion, Wir werden noch etwas davon durchgehen. Ehrlich gesagt, wenn Sie brandneu in JavaScript sind, wird das jetzt sehr theoretisch für Sie sein. Es wird viel mehr für Sie als Ihre Karriere als JavaScript-Entwickler auf der Straße anwendbar sein. Aber ab heute, wenn Sie brandneu in JavaScript sind, ehrlich gesagt, fühlen Sie sich frei, dieses Video zu sehen. Du musst eigentlich gar nichts damit machen. Es ist einfach gut, über das Konzept dahinter zu wissen, so dass, wenn Sie dies auf der Straße eingeführt werden, es wird nicht super beängstigend oder so etwas. Sie werden ausreichend ausgerüstet sein, um sich mit Klassen zu beschäftigen, und in dieser Lektion werden wir eine Klasse erstellen, und dann werden wir sie erweitern. Und ein wirklich gutes Beispiel dafür ist einfach etwas super Basic. Nehmen wir an, wir haben eine Klasse eines Tieres, und was hat jedes Tier gemeinsam? Also haben wir eine Konstrukt er Klasse oder konstruieren Ihre Methode hier. Und hier setzen wir alle unsere Standardwerte oder Standardparameter ein. Und so sagen wir, jedes Tier hat einen Namen oder besser gesagt keinen Namen, sondern eine Spezies. Es hat auch ein Gewicht und ja, und dann nur eine Höhe. Also werden wir einfach diese drei hier machen, und dann werden wir nur sagen, dass das Species gleich Arten ist, was wirklich seltsam erscheint, dass wir das so schreiben, aber es erlaubt uns, diese Variablen über die gesamte Tierklasse. Warten Sie. Wir könnten das auch als Zahl ausgeben, wenn wir es wollten. Wir wollten es. Wir könnten das als eine Schnur werfen. Es ist also immer eine Schnur. Und dann könnten wir sagen, diese Punkthöhe ist gleich gegossen. Das ist eine Zahlenhöhe. Und dann könnten wir eine nette kleine Methode erstellen. Und hier nur angerufen, ich weiß nicht, Informationen zu bekommen. Also erhalten Sie Informationen über dieses bestimmte Tier. Es hat keine Parameter, weil es magisch nur wird, um diese Punktart zu bekommen. Das ist nicht Warte. Das ist keine Höhe, denn das ist so, als würde man Tierpunktspezies sagen. Was auch immer dieses Tier ist Tierpunkt Warten Sie, was auch immer dieses Tier ist, Tierpunkthöhe, was auch immer dieses Tier ist. Und so versteht diese Funktion bereits das Konzept davon. Jetzt können wir sagen, Konsul, nicht diesen Punkt Spezies Konsul, wie dieses Zeug, Warte, wir wissen nicht, ob es Kilogramm oder so ist. Also werden wir das hier einfach ohne jede Art von Metriken verlassen oder wir wissen nicht, ob das Pfund oder Kilogramm ist, also lassen wir das einfach, wie es eine normale Nummer ist. Und ist diese Kanalhöhe hoch? So zum Beispiel ist zum Beispiel ein Tiger Ways 400 drei Meter hoch. , Wir wissen nicht,ob das Pfund oder Füße sind oder so etwas. Also bleiben wir gerade bei regulären Nummern, um das ziemlich einfach zu halten. Und ich werde das etwas kleiner machen, damit wir mehr davon auf dem Bildschirm sehen können. Lass uns voran gehen und ein brandneues Tier stehen. Also sagen wir const. Tiger ist gleich einem Tier. Ein neues Tier. Wir werden sagen, Tiger, es ist Gewicht 200, seine Höhe ist 36 Zoll. So etwas. Und dann könnten wir Tiger Dot bekommen Informationen und das wird nur Konsolenprotokoll. Es ist Artengewicht und -größe in einem Satz für uns. Lass uns voran gehen und erfrischend. Das ist Tiger wiegt 200 ist 36 groß. Also nicht das größte Englisch dort, aber Sie bekommen den Punkt. Das ist also eine reguläre Klasse, und das ist im Grunde genau das, was wir im letzten Video gemacht haben. Jetzt gehen wir weiter und erweitern das. Was das bedeutet, ist, dass wir eine andere Klasse schreiben können, die alle über diese Daten bereits erbt, und wir können mehr hinzufügen, wenn wir wollten. Also lasst uns weitermachen. Und was ich hier tun werde, ist, aber das alles in einer Zeile, nur damit wir das in einer Ansicht etwas einfacher zusammenfassen können. Und lassen Sie uns eine neue Klasse für ein Haustier wie normale Katze erstellen. Also tun wir Klasse Katze Schlüsselwort erweitert Tier, und so wird diese Katze bereits Konstruktoren wie Spezies, Gewicht und Höhe zu bekommen, und es wird auch die Methode bekommen Info jetzt. Was wir hier tun könnten, ist, wir bauen er kamau Lehrer. Lassen Sie uns die Spezies, das Gewicht und die Größe passieren und wir könnten all das ausführen, wenn wir wollten, oder wir könnten sagen, weil es sich vom Tier erstreckt, wir könnten genau die gleiche Funktion ausführen. Sie können sehen, dass sie tatsächlich hervorgehoben sind, wenn ich einen auswähle. Es wählt beide aus, weil sie etwas Ähnliches haben. Haben ähnliche Funktionalität hier, so können wir diese Sache namens Super tun, die wirklich cool ist, weil dies erstreckt sich, weil Katze erstreckt Tier. Wir können diese Funktion namens Super ausführen und es steht, Oh, geh zum Tier und lauf, was diese Funktion derzeit ist. Gehen wir weiter und werfen Spezies Gewicht und Größe hinein. Und wir können auch etwas ganz Neues hinzufügen, damit wir diese Punktfarbe machen können und sagen wir, ich habe eine orangefarbene Katze, die eigentlich falsch ist. Ich habe eine große und eine schwarze Katze. Lass uns das machen. Kein Tier hat also diese Farbe nicht. Das ist das überhaupt nicht hier oben. Aber Katze tut es. Cat hat all das Zeug. Wir sagen, Hey, laufen Super Also im Grunde laufen all das Zeug mit diesen drei Parametern da drin, was genau das ist, was es tut, wird die Spezies Gewicht und Höhe einstellen. Und sie sagten, Hey, Hey, füge auch die für Farbe hinzu. Also ist er großartig. Und damit wir das Zeug immer noch hier behalten können. Wenn wir ihm in einem Kommentar das wollten, muss es das dort ändern. Ich werde das kommentieren und ich werde eine neue Katzenklasse erstellen. Also gehen wir weiter, Const. Seine Anstrengung ist gleich neuer Katze, nicht Tier. Wir definieren hier eine neue Klasse. Es erstreckt sich nur von Tierarten. Ist er eine Katze sinnlos, weil wir wissen, dass es eine Katze sein wird. Was ist sein Gewicht? Er wiegt 13 Pfund. Und was ist diese Höhe? Ich weiß es nicht. Ich glaube, er ist etwa 13 oder 14 Zoll groß, etwas, das eine ziemlich große Katze ist. Und dann könnten wir Konsolenpunktprotokoll Zephyr machen und einen Blick darauf werfen, was hinter den Kulissen hier passiert und sehen, ob Farbe auftaucht, also aktualisieren. Wir kriegen hier ein Objekt. Farbe ist großartig. Sieh mal, da ist es. Höhe von 13 Arten ist eine Katze und die Löhne 13. Was, wenn wir tun wollten, ist jemals keine Informationen zu bekommen. Es ist eigentlich nicht hier drin. Es ist in der übergeordneten Klasse. Es ist derjenige, von dem wir uns ausdehnen. Und so wird das sagen, Cat wiegt 13 und ist wieder 13 groß. Schreckliches Englisch. Aber das ist nicht wirklich der Punkt hier. Katze wiegt 13 und 13 hoch, genau wie erwartet. Und es ist wie zu sagen, wenn ich all das im Jahr kopiere und es hier loswerde und dann sage, dass diese Punktfarbe gleich Gray ist , ist es so, als würde ich sagen, dass wir nur dieses Mal weniger Code schreiben konnten. Schön daran ist, wenn wir dies jemals wieder erweitern, könnten wir sagen, Klasse Hund erweitert Tier und Hund wird auch Artengewicht und Größe bekommen, also müssen wir das nicht neu definieren. Es wird hier eine Methode namens Get Info haben, so dass wir das nicht neu definieren müssen. Und es ist nur eine einfache Möglichkeit, das immer und immer wieder zu kopieren. Und so könnten wir Const sagen. Thiago ist gleich neuen Hund Vito. Wie groß ist er? Ich weiß es nicht. Er ist riesig. Es ist wie 3,5 Meter hoch. Und das war eigentlich ist warten, damit sein Gewicht etwa £140 sein würde, er ist 3,5 Meter groß. Er ist ein großer Hund. Aber jetzt könnten wir Zephyr leiten. Wir könnten Dargo dot bekommen Informationen zu diesem wird sagen, Vito wiegt 140 ist 3,5. Und so wieder, das ist ziemlich theoretisch. An diesem Punkt werden wir das nicht zu sehr auf der Straße benutzen. Aber Sie werden dies in der Wildnis sehen und sein JavaScript wächst und wächst und wächst. Du wirst das noch viel mehr sehen. Sie werden dies tatsächlich in vielen anderen Programmiersprachen sehen, wie Python und PHP. Lassen Sie uns noch ein Beispiel machen. Du. Lassen Sie uns den Hund loswerden. Wir brauchen das da drin nicht. Und lassen Sie uns eine brandneue Methode für unsere Katze erstellen. Lassen Sie uns also eine Methode erstellen, bei der die Katze Schlafregeln ist. Nennen Sie es Schlafkonsul Dot Protokoll diesen Punktnamen Nun, das ist in Ordnung. Da ist kein Name drin. Diese Punktart schläft 16 Stunden am Tag, also schläft die Katze 16 Stunden am Tag. Wir könnten weitermachen und das jetzt benutzen. Also anstelle von Zephyr dot get info, könnten wir seinen Aufwand dot sleep verwenden und dies ist nur in der Katzenklasse verfügbar. Also, wenn wir Tier hier schreiben, würde das nicht funktionieren. Aber wenn wir Cat schreiben, wird das funktionieren. Also lasst uns weitermachen. Aktualisieren Sie unsere Seite. Die Katze geht für 16 Stunden am Tag. Perfekt. Nun, das ist es, was Sie eine perfekte Klasse nennen würden. Und schließlich noch ein Beispiel hier drin, das wir in der Tierklasse hier tun könnten. Lassen Sie uns eine Sprechfunktion tun, Speak Methode Rat Punktprotokoll. Ich sage etwas. Wir wissen nicht, was dieses Tier ist. Wir wissen nicht, was sagen wird. Und eine Katze, sagen wir, dass eine Katze mich immer sagt. Oh, damit wir das überschreiben können, indem wir sprechen Rat, nicht loggen, nicht sprechen Wir wollen nein sagen. Und dann könnten wir statt Schlaf machen und dann reden und dann schlafen und sagen wir, es ist ein Nickerchen zu machen, also hat Cat ein Nickerchen. Dann wird er aufstehen. Er wird reden, und dann wird er wieder ein Nickerchen machen. Refresh Cat macht ein Nickerchen. Miao Katze hat es auf und so haben wir uns erfolgreich über geschrieben. Und wenn dies nicht existiert, wird dies die sprech-Methode von ihrer Elternklasse von der Klasse erben, die die Tierklasse erweitert. Es wird also sagen, dass ich etwas sage, das nicht nützlich ist. Da steht, dass Cat ein Nickerchen macht. Ich sage etwas. Cat macht ein Nickerchen. Also im Grunde alles, was wir getan haben, war die Standardmethode zu überschreiben, die mit Animal kam. schließlich lernen, Lassen Sie unsschließlich lernen,wie Sie Funktionen miteinander verketten und Methoden miteinander verketten, denn in anderen Teilen von JavaScript werden Sie Dinge wie diese sehen, wo es wie seine Anstrengung ist, nicht schlafen. Sprich nicht über Schlaf. Es ist wie, wie änderst du die zusammen? Das ist eigentlich ziemlich einfach. Wenn Sie also mit einem Objekt irgendeiner Art zu tun haben, wissen wir, dass Klassen Objekte sind. Alles, was Sie tun müssen, ist zu sagen, das zurückzugeben. Dies wird das gesamte Katzenobjekt zurückgeben. Und wenn Sie es hier unten tun, um dies jedes Mal zurückzugeben, wenn Sie seine Anstrengung ausführen, nicht schlafen, wird es zur Konsole Log-Spezies ein Nickerchen haben, dann wird dies zurückgeben, was im Grunde all dieser Code hier drin ist. Es wird die ganze Sache zurückgeben, was bedeutet, dass wir jetzt in der Lage sind, ihre zusammen zu ändern. Dann können Sie sprechen verwenden und weil es sich im Grunde diesen ganzen Code wieder zurückgibt, können Sie dann den Schlaf ausführen. Also lasst uns weitermachen. Speichern Sie diese Aktualisierung und Walla einfach so. Jetzt haben wir eine erweiterte Klasse und wir ändern gemeinsam Methoden. Also kommen wir in wirklich, wirklich nettes JavaScript hier und ehrlich gesagt, ich, ich, zusammen mit den meisten Javascript Devs bevorzugt, nur diese Punktnotation hier drin zu haben. Also statt seiner Anstrengung, nicht schlafen und hat dann jemals nicht sprechen. Und dann Zephyr nicht schlafen und Trennen ist immer und immer wieder. Wir können das alles einfach auf eine Zeile setzen, so dass eine Klasse wieder erweitert wird. Du brauchst nicht zu viel darüber zu wissen. Wir werden eigentlich nicht üben, Klassen in dieser Klasse zu erweitern, nur weil es nicht etwas ist, das für Sie im Moment unglaublich nützlich sein wird. Was? Es ist eine dieser Fähigkeiten, die Sie gerade in Ihrer Gesäßtasche für jetzt sprechen sollten, weil schließlich Sie gehen, um dies in der Wildnis zu sehen. Und es wird wichtig für Sie sein zu verstehen, was das ist, oder zumindest eine vage Erinnerung daran zu haben. Einmal, als Caleb 15 Minuten lang mit Ihnen darüber sprach, was das Schlüsselwort „erweitern“ mit Konstruktions- und Verkettungsmethoden zusammen und solchen Dingen bedeutet . Also stecken Sie dieses Video einfach in Ihre Gesäßtasche, und wenn Sie sich ein wenig scharf fühlen, können Sie dies eine Chance geben. Sie können versuchen, dies auszuschreiben, wenn Sie möchten. Ich persönlich denke, es wäre eine gute Idee. Aber wenn Sie keinen Druck wissen wollen, können wir zu dieser nächsten Lektion weitergehen, wann immer Sie sich nett und bereit fühlen. 48. Modelles Projekt: Okay, jetzt ist die Zeit, wo wir anfangen, eine Menge dieser Fähigkeiten zusammen zu bringen. Dieses Projekt wird ein bisschen schwieriger. Wir werden ein Motil von Grund auf erschaffen. wissen, Wenn Sie nichtwissen,was ein Motil ist, wissen Sie, wann immer Sie auf eine Schaltfläche klicken und dann wie der Hintergrund der Seite dunkler oder dunkler wird, und dann haben Sie, wie ein kleines internes Fenster innerhalb Ihrer Seite. Das ist ein Motil. Wir werden einen von denen von Grund auf erschaffen. Nun, wenn Sie nicht viel CSS kennen, ist das okay. Du bist motil muss nicht schön sein mit irgendwelchen Mitteln. Es muss nur funktional sein. Das ist der Schlüssel zu JavaScript ist Funktionalität. Ich möchte also, dass Sie einen Knopf erstellen, der ein Motel öffnet, einen Knopf erstellt, der das Motil schließt, und dann möchte ich, dass Sie all das innerhalb eines Objekts oder einer Klasse schreiben. Es liegt an dir. Wenn Objekte an dieser Stelle sinnvoller für Sie sind, richten Sie es in einem Objekt. Wenn eine Klasse für Sie mehr Sinn macht, rechts sie innerhalb einer Klasse. Stellen Sie sicher, dass Sie Ihre Funktionen oder Methoden in Ihrem Objekt in Ihrer Klasse haben und tun Sie alles, was Sie tun müssen, um dies zu ermöglichen. Jetzt müssen Sie auch ein wenig HTML schreiben, weil Ihre Seite die tatsächliche motile Struktur benötigt, die sie sagen, erfordert sehr lose, dass es nicht wirklich benötigt. Sie könnten auch Javascript erhalten, um das dynamisch zu erstellen, wenn Sie möchten. Dazu müssen Sie ein paar Ereignis-Listener schreiben, und Sie müssen sie auch innerhalb eines Objekts oder einer Klasse schreiben. Also, wenn Sie diese beiden zusammen mischen, sollten Sie in der Lage sein, ein Motil ziemlich leicht zu erstellen. Wieder einmal geht es hier nicht unbedingt um Schönheit. Es geht um Funktionalität. Sie können immer etwas schöneres Zeh machen. Sehen Sie sich CSS an. Das ist völlig in Ordnung. Das ist eher eine CSS-Sache, die wir nur JavaScript tun wollen, die sich größtenteils auf Funktionalität konzentriert . Geben Sie das eine Chance. Versuchen Sie es auf eigene Faust zu tun, ohne etwas zu googeln, ohne auf andere Videos verweisen zu müssen . Lass dein Gehirn schwitzen. Dieses viele Projekt dieses objektorientierte Programmiermotil soll ein wenig schwieriger sein . Gehen Sie so weit wie möglich mit diesem. Versuchen Sie, die Lösung selbst herauszufinden. Aber weißt du was? Wenn Sie wirklich stecken bleiben und Sie einfach keine Fortschritte machen können, können Sie auf jeden Fall auf die anderen Videos verweisen. Hop auf die alte Google-Maschine oder schauen Sie sich einfach den Rest dieses Videos an, denn ich bin dabei, Ihnen zu zeigen, wie ich es tun würde. Aber geben Sie uns eine Chance. Ich werde das zu schwarz ausblenden und dann kannst du schlagen, pausieren, pausieren, und dann entweder, wenn du fertig bist oder wenn du stecken bleibst, kannst du dieses Video einfach fortsetzen und du kannst sehen, wie ich es machen würde. Also lasst uns weitermachen und uns einen Schuss geben, okay? Das Erste ist das Erste. Wir brauchen das eigentliche motile html. Also werde ich hier ein Div erstellen und ich werde etwas ekliges im Linienstyling machen. So Stil Position. Absolute, eigentlich, lassen Sie uns Position Fixed oben 50% links, 50% Rand, ein Pixel, solide rot. Das wird super hässlich. Die Hintergrundfarbe wird ebenfalls gelesen. Das mit wird 50% sein und wir werden ihm eine Polsterung von 20 Pixeln geben Mal sehen das aussieht. Ja. Okay, also ist es, weißt du, eine große rote hässliche Kiste. Transformieren wir übersetzen. Minus 50% minus 50%. Und da gehen wir. Es ist in der Mitte unserer Seite. Lass uns weitermachen und das einfach rüber bewegen. So ist es jetzt in der Mitte unserer Seite. Und schließlich wollen wir keine anzeigen. Stellen Sie sicher, dass es überhaupt nicht auftaucht. Da gehen wir. Es, als ob es nie existierte. Als Nächstes. Wir müssen in der Lage sein, das zu packen. Also lasst uns voran gehen und uns eine Klasse Js motile geben. Und während wir das machen, weißt du was? Wir könnten das auch in richtiges CSS werfen. Also lasst uns das schnappen. Und lassen Sie uns dies eine Klasse von nur eine regelmäßige motile werfen unsere Klasse erscheinen Stil dot motile und ich werde nachbessern. Wählen Sie nicht nur Semikolons Neue Zeile bam einfach so aus. Und nur um sicherzustellen, dass dies funktioniert, lassen Sie uns Display keine loswerden, und es wird immer noch nicht angezeigt. Und ich wette, das ist eigentlich, weil ich Bootstrap installiert habe. Also werde ich Bootstrap deinstallieren, verschwinde von hier. Bootstrap, wir brauchen dich nicht. Wir wissen, wie man unser eigenes CSS und JavaScript schreibt. Jetzt geh weiter und hol dir das Rot des Displays. Keiner. Bam! Da ist es. Okay, cool. Ja, es war eine Bootstrap-Sache, und es benutzte nur die Klasse der Motile. Also haben wir dieses Ende loswerden. Jetzt haben wir das komplette Eigentum darüber. Okay? Wir müssen einen Knopf erstellen, der das Motil öffnen wird, und wir müssen über erstellen wird, um das Motil zu schließen. Also lassen Sie uns einen Knopf hier erstellen es reguläre Knopfklasse Js öffnen motile offen motile Das wird immer sagen, große hässliche Taste und tut derzeit nichts. Lassen Sie uns nun voran und erstellen Sie einen Ereignis-Listener für offenes Motil. So öffnen Sie die Taste so konstant öffnen BT N ist gleich Dokumente Punktabfrage Selektor, dass Jazz Motile geöffnet Es gibt nur einen, so dass wir Cree Selektor anstelle von Crease Lecter verwenden können alle und wir könnten tun, öffnen Sie bt n Punkt hinzufügen Ereignis-Listener es ist ein Klick Funktion wird das Ereignis sein und alles, was wir wollen, ist das Motil zu greifen und es anzuzeigen Also jetzt müssen wir das Modell CONST greifen . Motile Modellmodell ist gleich Dokumenten Punkt Abfrage Selektor Punkt Js Modell. Wir werden nur dieses auswählen und wir werden Motile sagen, dass Stil nicht angezeigt wird, ist gleich Lasst uns es einfach in anfängliche ändern, was immer es war, bevor wir sagten, dass es keine Anzeige sein soll. Aktualisieren Sie Ihre Seite. Ha! Es funktioniert. Ich meine, es öffnet sich nur, aber das ist ziemlich gut. Okay, gehen wir eigentlich und stylen das auf. Nur ein wenig schöner Grund, dass Rot ist einfach phänomenal schrecklich mit 80%, die von max mit 800 Pixeln für super riesige Browser, Border wird ein Pixel sein. Solider schwarzer Hintergrund wird weiß sein. Das ist in einem Kastenschatten. Fünf wählt diese fünf Pixel schwarz anzeigen keine. Entfernen Sie das. Ja, wieder gut genug. Wir suchen nicht nach Schönheit. Wir sorgen nur dafür, dass das funktioniert. Gehen wir weiter in unserem Motil. Es ist bei einem Titel. Das ist ein Modellabsatz, Laura, um, 50. Und wenn wir Ihre Seite aktualisieren und öffnen, ist dies ein Motil und es wird nur über den Rest der Seite. Jetzt brauchen wir hier ein enges Element, also lassen Sie uns voran und fügen Sie hier einen Knopf hinzu. Button Klasse ist gleich Js schließen motile. Wir könnten es auch durch seine Idee bekommen, wenn wir wollten. Es spielt keine Rolle in der Nähe Modell. Und jetzt müssen wir das schließende Ereignis hinzufügen. Also lasst uns das machen. Und ich weiß, ich sagte, Lasst uns das tun und Objekte oder innerhalb einer Klasse und wir werden zu Aber weil wir lernen JavaScript wird einfacher sein, wenn wir auf die Art und Weise, wie wir wissen, und dann irgendwie machen es von dort weiter fortgeschritten. Also haben wir eine offene Schaltfläche jetzt haben wir eine Schließen-Schaltfläche und es ist sehr, sehr ähnlich dem Open-Button Event Listener. So motile Punkt-Stil Punktanzeige wird nicht angezeigt werden. Lass uns weitermachen. Wir haben einen Fehler. Was sagt jemals Schließen Taste ist nein. Es ist, weil es nicht Jazz ist, sondern motil Es ist Jazz in der Nähe motil. Wenn Sie auf Ihrem Bildschirm schreien und Caleb sagen, haben Sie nicht falsch Guter Fang. Okay, kein Fehler mehr. Offene motile schließen Motile offen motile nah motil OK, wir kommen jetzt ziemlich nah. Das letzte, was wir tun mussten, war, dass wir all dies innerhalb eines Objekts oder einer Klasse schreiben mussten . Jetzt wieder, weil wir neu in JavaScript sind. Wir werden das nicht sofort in ein Objekt oder eine Klasse werfen. Wir werden es so schreiben, wie wir es schreiben können, und dann können wir es komplizierter machen. Also lasst uns voran gehen und eine Klasse erstellen, so Klasse, nennen wir es motil. Wir könnten hier ein Konstrukt haben und es könnte einiges tun, und dann hätten wir das etwas größer machen können. Und dann haben wir eine offene Methode und dann könnten wir eine enge Methode haben. Und so lassen Sie uns ungewöhnlich, dass okay, und dann in ihrem Konstrukt, oder was ist ein Stück Daten, auf das wir durch das Konstrukt der offenen und der Kleidungsmethoden zugreifen müssen ? Während wir brauchen das Motil jedes Mal, wenn wir brauchen, dass motile wir nicht verwenden konstant hier weil, wenn wir wollen, um die motile innerhalb der offenen in der close Methode zugreifen, tun wir diesen Punkt Motile ist gleich dem einzigen Motel auf der Seite. Was passiert dann, wenn wir offen sagen, während wir diesen Motor öffnen müssen. Also werden wir das greifen und wir werden sagen, dieses Punkt-Motil Das ist dieser Kerl hier Punkt-Stil Dot zeigt in der Lage, anfänglich und dann werden wir es zu schließen, indem wir im Grunde das gleiche tun . Dieser Punkt motile Punkt Stil. Diese Anzeige ist gleich keiner. Okay, lassen Sie uns das schnell speichern und aktualisieren. Haben wir Fehler oder Warnungen in Ihrem neuen Buch? Funktioniert das neu, weil das Modell nicht mehr definiert ist. Und das liegt daran, dass wir hier Ereignis-Listener haben, die danach suchen. Stattdessen, was wir tun können, ist, dass wir hier tatsächlich eine Mischung machen können, also haben wir ein regelmäßiges Motil und lassen Sie uns voran gehen und einfach das Zeug hier unten beschleunigen. Aber jetzt müssen wir dieses Motil definieren. Also was wir sagen könnten, ist konstant motile ist gleich neue motile und anstatt dies zu setzen , könnten wir motile dot offen und hier drin könnten wir dio motile dunkle Kleidung und in der Tat könnten wir tatsächlich all das zusammen halten, was tut nicht über Modell überhaupt sein müssen. Und was wir taten, war, dass wir uns einfach das Motil verbergen und das Motil dieser Art von Funktionalität öffnen , plus den eigentlichen Selektor selbst. Und wir haben es in seine eigene Klasse gebracht. Und jetzt könnten wir einfach tun, wie sterbliche Punkt öffnen motile dot Kleidung und aktualisieren Sie Ihre Seite. Dies ist ein Motil schließt das Modell. Ah, das ist also ziemlich nett. Und genau so haben wir eine Arbeiterklasse mit Konstrukt er dieses Top-Modell, das es uns ermöglicht, dieses Punktmotil über mehrere Methoden hinweg zu verwenden . Ob wir das Styling geändert haben, er ist ein Falte Lector da drin. Er ist ein paar andere Karriereselektoren. Wir haben ein neues Motil erstellt und dann ein paar Ereignis-Listener hinzugefügt. Nein, was wäre, wenn wir uns verlängern wollten? Könnten wir. Wir könnten das leicht erweitern. Was wäre, wenn wir den Titel und den Text ändern wollten? Nun, lasst uns voran gehen und ändern Diese Klasse verdaut motile Titelklasse Js motile Text und wir könnten Sie wissen, Phyllis mit regelmäßigen Standardeinstellungen und wir könnten auch diese ändern, so dass wir so etwas tun könnten . Construct wird einen Titel nehmen. Es wird auch etwas Text nehmen und sofort könnten wir diesen Punkt Motile Dot Query Selektor tun . Wir könnten Js motile Titel ändern, dass inneren Text zwei Titel, nicht Text und dann könnten wir das gleiche tun wieder mit dem Text ist gleich Text. Das heißt also, dass wir bereits das Motiv haben. Dies ist unsere Elemente Notiz und dann werden wir eine neue finden hier, nur die erste 1 genannt Titel und in der 2. 1 genannt Text Text. Dort gehen wir endet am Inter Text auf den Titel und den Text. Lassen Sie uns dies jedoch optional machen. Sagen wir also, wenn Titel nicht gleich undefiniert ist, können wir dies tatsächlich setzen. Wenn Text jetzt nicht gleich undefiniert ist, können wir dies auch setzen. Und so, wenn wir öffnen Modell Kleidung Modell aktualisieren, das funktioniert. Was wäre, wenn wir unser Motil mit einem neuen Titel, einem neuen Titel und einem neuen Text öffnen wollen Neuer Text hier drin? So sieht es derzeit aus. Dies ist ein Motiv Ein Haufen warmer ipsum Refresh. Dies ist ein motile neuer Titel neuer Text hier. In der Tat könnten wir sogar diesen einen Schritt weiter gehen, könnte man sagen, dass dieser Punkttitel gleich dem Titel ist . Dieser Don't Text ist gleich Text, und dann könnten wir dies auch in seine eigene Methode werfen. Also lasst uns voran gehen und sagen Neue Methode, Inhalt ändern. Es muss nichts nehmen. Werfen wir das hier rein und wir werden sagen: Wenn nicht, ist der Titel nicht undefiniert. Diese Steuer ist nicht undefiniert. Dann schnappen wir uns das Motil. Wählen Sie auch den Titel aus dem Inneren des Titels. Es ist wie im Inneren zu erkennen. Und statt Titel, wollen wir diesen Punkttitel diesen Punkt Tex. Und wieder, wir tun das, weil das hier eingerichtet wurde. Wir haben Titel. Für alles, was wir wissen, ist das eigentlich nur undefiniert. Wir setzen sogar einen Standard in Ihrem, so dass es kein Standardtitel ist. Und lassen Sie uns hier einen Standardtext festlegen. Standardtext. Okay, gehen wir weiter. Diese Seite aktualisieren Fehlender Parameter. Wo vermisst du etwas? Text ist gleich der Standardeinstellung. Da ist es. Danke, Counsel, mir ohne ihren Bugger geholfen hast. lieber Gehen wirlieberzurück zum Rat. Aktualisieren Keine Fehler. Öffnen Sie Motile. Das ist ein Motel. Der Grund, warum es sich nicht geändert hat, war, weil wir noch nicht wirklich Änderungsinhalte verwendet haben, also lassen Motile öffnen, wir haben dies. Wir haben hier ein Objekt mit einem Haufen Zeug. Wir haben einen beweglichen Titel und Text. Die motile Eigenschaft ist das eigentliche Notenelement selbst. Also lasst uns motile dot machen und was wir hier drin haben, haben wir in der Nähe Wenn wir meinen kleinen Punkt öffnen wollten, wenn wir motile dot ändern wollten und da ist es. Okay, das war also ein lustiges Motiling, das wir dort gemacht haben. Wir haben einiges getan. Wir haben es viel mehr erweitert, als ich eigentlich erwartet hatte, dies zu verlängern, aber ich denke, das ist eigentlich eine ziemlich gute Übung, um Ihr eigenes Motil zu kreieren. Wenn Sie mit CSS nicht großartig sind, vergessen Sie nicht, dass Sie meinen Code hier immer kopieren können, was ein grundlegendes Motil für Sie schafft . Ich ging weit über das hinaus, was diese ursprüngliche Aufgabe verlangte, aber ich denke auch, dass ich hier auch ein paar coole Dinge gezeigt habe. Eigentlich gibt es noch einen, den ich dir zeigen möchte. Eine weitere ist, dass wir Titel überhaupt nicht im Text verwenden müssen. Gehen wir weiter und lassen Sie uns diesen Punkttitel loswerden und lassen Sie uns dieses loswerden, nicht Text, und wir könnten direkt hier Titel und Text sagen. Und dann, wenn wir öffnen motile aktualisieren, haben wir ein Modell in hier Punkt ändern Inhalt Titel wird neuer Titel ha motile, die neuen Titel ändern und neuen Text in hier wie eine reguläre Funktion. Also, jetzt übergeben wir tatsächlich Parameter in eine Methode. Und du könntest diesen Code auch hier drinnen schreiben, wenn du es wolltest. Da hast du nicht. So würde ich ein Motil mit JavaScript-Klassen und ein paar Ereignis-Listener erstellen. Eigentlich, nur ein paar Ereignis-Listener, und ich ändere sogar einige der Inhalte darin. Fühlen Sie sich frei, dies zu replizieren. Spüren Sie, dass Friedas genau diesen Code stehlen und einfach damit herumbasteln und herausfinden, wie es funktioniert. Wenn Sie mit Ihrer Lösung zufrieden sind oder mit meiner Lösung zufrieden sind, können wir zum nächsten Video weitergehen. Und vergiss nicht, dass du dein Skill Share Projekt mit dem neuesten Code aktualisieren kannst , den du hast , oder du kannst einen Screenshot davon teilen, wie du motil aussieht oder ein Video oder einen Codestift. So oder so können Sie Ihr Skill-Share-Projekt mit Ihrem neuesten Code aktualisieren. Sobald du das getan hast, lass uns zum nächsten gehen. 49. Home: Okay, wir sind auf der Heimstrecke. Wir gehen über ein neueres JavaScript, Dinge, die Sie überall sehen werden. Einige von ihnen beinhalteten Template-Liberale. Also ein besserer Weg nach Katyn. Acht, diese groben Saiten, die wir verunreinigt haben. Es gibt einen viel netteren Weg, das zu tun. Objekt-Liberale. Du wirst diesen Begriff überall hören. Und sie sind nicht wirklich eine beängstigend, wie sie dort scheinen, Eigentlich, sehr, sehr nett und einfach. Wir werden über Zerstörungs- und Aero-Funktionen und solche Dinge reden. Dann werden wir dazu kommen, Klassen dynamisch mit JavaScript hinzuzufügen und zu entfernen , so dass Ihre gesamte Seite tatsächlich sehr, sehr dynamisch sein kann . Und Sie könnten es sehr dynamisch aussehen lassen, indem Sie ganze CSS-Klassen zu einem Element hinzufügen oder sie aus einem Element entfernen. Dann können Sie CSS Dinge wie Übergänge und Animationen machen lassen, was wirklich schön ist, denn im Grunde würden wir unsere allgemeine Javascript-Animation entladen. Also eine Reihe von Mathematik müssten wir herausfinden, um nur die CSS-Engine tun zu lassen, was sie tut. Und schließlich schließlich werden wir ein letztes Projekt haben, bei dem ich Ihnen sagen werde, was es ist, um dorthin zu gelangen und es herauszufinden. Aber es wird viele verschiedene Komponenten von Dingen, die wir bereits gelernt haben, verwenden . Also, sobald Sie bereit sind zu gehen, gehen wir über zum nächsten Abschnitt und springen in die Vorlage. Liberale weisen Liberale auf, die Aero-Funktionen strukturieren und vieles mehr. 50. Template: Okay, schauen wir uns das Ding an, das Temp genannt wird. Spät, wörtlich, also Vorlage, wörtlich. Es ist eine schönere Möglichkeit, Nate-Variablen mit Ihren Strings zu katzen und im Grunde Seitenvariablen innerhalb einer Zeichenfolge zu setzen . Und so, wenn Sie jemals eine Aussage ausdrucken wollten, zum Beispiel, Name ist gleich Caleb, und Sie wollten Council Dot Log sagen. Hi, mein Name ist. Dann schließen Sie Ihre Zeichenfolge mit einem Pluszeichen und dann Ihre Variable. Und wenn es noch mehr auf einem Pluszeichen gibt, klingle ich hier nur noch mehr Sachen. Schließen Sie das Zeichenkettenpluszeichen bei einer Variablen usw. Und so hat es einen schrecklichen Satz. Hallo, mein Name ist Caleb Moore. Stecken Sie Ihren Caleb. Und so haben wir bisher String-Verkettung gemacht. Es ist eigentlich ein viel besserer Weg in relativ neuerem JavaScript. Sie können dieses Ding tun, das ein Template-Literal genannt wird, und anstatt diese grobe Syntax schreiben zu müssen, die, sobald Sie anfangen, wie HTML und so darin zu schreiben, wird es ziemlich eklig. Was wir stattdessen tun könnten, ist, könnten wir sagen, Council Dot Log verwendet zurück Zecken. Beachten Sie, dass dies kein Apostroph ist. Dies ist kein Anführungszeichen. Es ist eine hintere Zecke. Und dann kannst du Hi sagen. Mein Name ist Dollar-Zeichen öffnen und schließen Curly Brace. Und dann setzen Sie den Variablennamen genau so hinein. Und sieht das nicht so viel sauberer aus? Weil das buchstäblich nur Hallo sagt, mein Name ist Oh, übrigens, das ist Variable, die von außerhalb dieser Zeichenfolge kommt. Mein Name ist Caleb Bam. Genau so. Und so ist das alles, was es wirklich zu einer Vorlage gibt, wörtlich. Jetzt sieht die Syntax dahinter ein bisschen lustig aus. Also lassen Sie uns voran und erstellen Sie ein weiteres Beispiel Hier, lassen Sie uns einen Satz erstellen. Ein ständiger Satz, weil wir uns nicht ändern werden. Wir werden ein Template-Literal verwenden, und es wird Hallo sagen. Mein Name ist wieder Dollar Zeichen öffnen und schließen Curly Klammer. Dann legen Sie Ihren Variablennamen darin ein. Dieser Variablenname kommt gerade von hier oben. Willkommen zu meinem Kurs auf Javascript JavaScript. Und dann hat es nur diesen schließenden Back Tick und einen öffnenden Back Tick. So ist es nicht Apostrophe ist keine Anführungszeichen. Es ist ein Back Tick gehen Sie voran, Slam, die Taste eingeben. Es wird sagen, undefinierte Ursache Alles, was wir getan haben, war eine Variable hier oder eher eine Konstante zu definieren, und lasst uns voran gehen und Satz und voila eingeben, heißt es. Mein Name ist Caleb. Willkommen zu meinem Kurs auf JavaScript und nur zum Spaß, Z's Lassen Sie uns voran und werfen Sie einen Blick auf die Art des Satzes. Es ist immer noch eine Zeichenfolge, und so ist das eine schönere Art, Variablen in einen String für jede Form der Ausgabe zu erstellen . Es ist wirklich, wirklich nett, aber ich möchte, dass du es tust, ist nur eine kurze Minute zu nehmen und einfach einen dieser Trainer zu schreiben , oder? Ah, konstant mit einer Variablen. Vielleicht ist es dein Name. Vielleicht ist es in deinem Alter. Vielleicht ist es die Anzahl der Haustiere, die Sie haben und werfen Sie es einfach in eine Vorlage wörtliche Zeichenfolge. Sobald du das herausgefunden hast, lass uns zu diesem nächsten Video gehen 51. Object: Hallo und herzlich willkommen. Zurück im letzten Video haben wir etwas über ein Template-Literal erfahren. In diesem Video werden wir über eine Sache lernen, die ein Objektliteral genannt wird. Und so ist dieser ein wenig komplizierter als eine Vorlage, wörtlich und kompliziert. Ich meine, es reduziert tatsächlich nur, wie viel Code wir schreiben müssen, was wirklich nett ist. Lassen Sie uns also voran und erstellen Sie hier ein neues Objekt, nur ein normales Objekt. Also sagen wir, CONST. Die Person ist gleich und dann werde ich meinen Namen hier reinsetzen und mein Name wird Caleb sein , und dann kann ich auf das mit Person Punktnamen zugreifen. Das ist also ein normales Objekt. Was wäre, wenn ich hier eine Funktion oder eine Methode definieren wollte, wie sie heißt? Wir werden Caleb zum Sprechen bringen, und es wird nur eine Funktion namens Speak sein, und es wird einfach etwas trösten. Konsolenprotokoll, ich sage Wolf. Ich habe mich immer ausgesprochen. Jetzt sage ich Wolf, und das ist zugänglich durch sprechen. Lasst uns das retten. Und da steht, ich sage Wolf. Okay, nun, was was für ein Objekt Literal sagt? Sie brauchen das nicht wirklich, weil dieser Name und dieser Name genau gleich sind. Gehen Sie weiter und schneiden Sie das Zeug hier aus, und so werden Sie einfach oben sehen. Es ist ein Komma, weil es Schlüsselwertpaar gibt und anstatt zu sagen, sprechen ist gleich zu sprechen, sagen wir nur, Hey, es gibt eine Funktion hier drin. Es heißt „Speak“. Gehen Sie einfach voran und speichern Sie das und aktualisieren Sie es. Es funktioniert auch, Und das ist, was ein Objektliteral tut. Es ist eine Abkürzung in einem Objekt. Also, wenn ich hier eine weitere erstellt habe, aber dieses Mal möchte ich es mit einer Eigenschaft oder Variable innerhalb eines Objekts tun. Ich werde nur ein zufälliges Wort verwenden. Hier s so lassen Sie uns eine weitere Konstante hier erstellen. Es heißt Computer, und es wird nur eine Zeichenfolge namens Computer sein. Nun, Moment, was wir tun müssten, ist Computer gleich Computer oder so. Im Wesentlichen ist das das Gleiche. Aber weil das die gleichen Werte sind, lassen Sie uns voran gehen, schneiden Sie das aus. Und anstatt hier im Grunde Klammern zu haben, die Javascript sagen, Hey, das ist eigentlich eine Funktion, die sagen: Hey, Computer, der Schlüssel und der Wert sind genau gleich. Lass uns weitergehen und trösten. Loggen Sie das ein. Lasst uns Computer. Das ist für den Konsul Dot Log. Und da ist es Computer. Und so schreiben wir jetzt nicht auf dem langen Weg. Wir müssen nicht mehr schreiben. Computer ist gleich dem Computer oder der Art, wie wir es ursprünglich geschrieben hätten. Computer. Wir müssen es nicht so machen. Wir können es jetzt einfach so machen, was wirklich, wirklich nett ist . Und das ist alles ein Objekt, Literal sagt, dass Ihr Schlüssel der gleiche wie Ihr Wert ist, oder wenn es um eine Methode geht, sagen Sie, dass der Schlüssel für die Methode auch der Name der Funktion ist. Und so ist es nur eine Abkürzung. Schreiben von weniger Code macht das Leben ein wenig einfacher. Wenn Sie sich würzig fühlen, gehen Sie voran und geben Sie dem einen Schuss. Vergiss es nicht. Wenn Sie Fragen dazu haben, wie das funktioniert, können Sie sie untätig lassen. Sei niedrig. Ich bin hier, um zu helfen. Andernfalls, wenn Sie sich sicher fühlen, gehen wir über zum nächsten Video 52. Verkrustung von Arrays, Objekten und ganzen Rest: Hallo. Lassen Sie uns über diese Idee der De-Strukturierung sprechen. Jetzt. Bevor wir überhaupt darauf eingehen, werde ich Ihnen sagen, dass es zwei Möglichkeiten gibt, Daten im Grunde aus einem Array oder einem Objekt zu ziehen . Und so denke ich, dass der beste Weg, das wirklich zu lernen, nur indem du es tust. Also werde ich einen Teil der Abstände hier und dieser Seite reduzieren, weil das ein wenig groß wurde. Und wenn wir also ein Array haben, lassen Sie uns eine reguläre Variable erstellen. Es wird ein Are short for array genannt, und es hat Namen hier drin. Es hat Caleb, Nathan und Zephyr. Wenn ich Caleb O dazu bringen wollte, müsste ich sagen,dass das eine Konstante ist. Wenn ich Caleb O dazu bringen wollte, müsste ich sagen, Caleb ist gleich einer RR Null und Const. Nathan ist gleich einer R R eins. Wir könnten dies durchlaufen und versuchen, dies zuzuweisen, aber im Grunde weisen wir es nur einer anderen Variablen in Form eines Arrays oder eines Objekts zu . Und sowissen Sie, wissen Sie, wenn Sie zum Beispiel ein Array haben , das 100 Namen enthält, möchten Sie dies nicht 100 Mal tun. Das ist ziemlich schmerzhaft. Und was wir stattdessen tun können, ist diese Idee der Strukturierung. Und wirklich alles, was wir sagen, ist , Hey, wir wollen die packen und sie in ihre eigenen Variablen werfen. Also lasst uns voran gehen und d strukturieren dieses Array. Lass uns voran gehen und erstellen. Lassen Sie uns eine Let verwenden und dies wird wie eine Liste aussehen, aber auf der falschen Seite einer Variablen. Das ist also auf der linken Seite. Statt der rechten Seite der Gleichheitszeichen wird es so aussehen, was ein wenig bizarr aussieht, aber wir werden das zusammenbrechen. Also zuerst wollen wir Caleb, Nathan und Zephyr bekommen , und dann statt und genau hier, lassen Sie uns einfach die Array-Variable setzen. Lassen Sie uns voran und speichern Sie diese Aktualisierung Unsere Seite sieht aus wie nichts passiert, aber es ist alles hier jetzt, plötzlich, diese Luft tatsächlichen Variablen, die in Ihrer Anwendung zugegriffen werden kann. Nun, das ist nicht wirklich ein super nützliches Beispiel, um völlig ehrlich zu sein. Okay, also lasst uns hier ein neues Beispiel erstellen. Etwas Nützlicheres. Äh, ich werde nach meinem Namen fragen. Eingabeaufforderung. Wie lautet Ihr vollständiger Name? Und so wissen wir, dass dies eine Zeichenfolge zurückgeben wird. Das wird also eine Zeichenfolge sein. Wir wissen, dass mein Name Calebs Abschleppen sein wird, und so können wir es hier aufteilen. Und dann könnten wir var tun oder besser gesagt, lassen Sie Vorname Nachname gleich dem vollständigen Namen Punkt Split auf jedem Leerzeichen. Jetzt gibt es einige Logikfehler darin, denn was ist, wenn jemand mehrere Leerzeichen hier reinlegt ? Ja, das wird das Drehbuch brechen. jedoch In diesem Beispiel wird esjedoch nicht tun. Also, idealerweise, wenn Sie in der Produktion oder professionellem JavaScript arbeiten, haben Sie Möglichkeiten, dieses spezielle Problem zu mildern, in dem jemand mehrere Leerzeichen platziert . Vielleicht haben Sie nur mehrere Räume in einen Raum reduziert. Lass uns weitermachen. Console Loggers Council dot log Vorname ist der Vorname und Nachname ist der Nachname . Lass uns weitermachen, Refresh. Wie lautet mein vollständiger Name? Caleb. Groß schlank. Es geht um meinen eigenen Namen. Sie irren sich. Caleb ist der Vorname. Calling ist der Nachname. Und so ist dies eine bessere Strukturierung. Ohne d Strukturierung hätten wir dies auf eine andere Weise tun müssen, also lasst uns voran und kommentieren das aus. Was wir tun mussten, war der vollständige Name ist gleich dem vollständigen Namen dot split. Also müssen wir es so oder so teilen. Und dann könnten wir var let oder const tun. Lass uns Nachteile machen, weil mein Name sich nicht ändern wird. Der Vorname ist gleich einem vollständigen Namen, und es ist der Nullindex in der 1. 1 im Array und der Nachname. Und wenn ich die Seite aktualisiere, gib uns eine Chance. Lass uns meinen Namen nicht benutzen. Verwenden wir John Smith. John ist der Vorname Smith sein Nachname, so dass es immer noch funktioniert. Aber auf diese Weise mussten wir tatsächlich mehr Codezeilen schreiben, die wir drei weitere Codezeilen hatten , oder, ich denke, zwei weitere Codezeilen. Anstatt nur eine Codezeile zu schreiben. Das wird es aussagen. Halten Sie das hier oben und Sie können diesen Code jederzeit referenzieren. Das ist also D, das ein Array strukturiert. Es gibt tatsächlich viel mehr dazu, also ist dies nur eine regelmäßige de Strukturierung. Ich werde das Zeug aussagen, weil ich nicht will, dass das jetzt läuft. Was, wenn wir das haben? Gehen wir zurück zu unserem ersten Beispiel hier. Was ist, wenn wir mehr als diese Namen haben, aber wir wollen einfach die 1. 3 aus irgendeinem Grund. Ich will Caleb, Nathan und Zephyr holen. Aber was, wenn es auch Prairie Henry Veto und Maya gibt? Wenn wir das ausführen, was passiert dann? Und ich lade immer Leute ein, Dinge auszuprobieren, die Sie nicht sind. Sie werden nichts brechen , indem Sie Javascript lokal auf Ihrem Computer ausführen. Es ist in Ordnung, Dinge zu testen, also wenn es kaputt ist, ist das völlig in Ordnung. Gehen wir weiter und schlagen. Aktualisieren. Okay, wir haben Caleb. Wir haben Nathan. Wir haben Zephyr. Wir haben wahrscheinlich keine Prärie. Nein. Wir haben Henry nicht. Nein setzt das andere Veto. Maya, das sind alle Referenz-Airs. Diese Variablen existieren noch nicht, also was, wenn wir den Rest von ihnen bekommen wollten? Nun, in JavaScript gibt es diese Sache namens Ruhe. Und stattdessen, was wir sagen können, ist, dass ich das wirklich kopieren werde, weil ich nicht mehr darüber reden will . Also lasst uns Caleb, Nathan und Zephyr strukturieren . sind nur die 1. 3 sie müssen nicht wirklich der gleiche Name sein, der irgendetwas anderes sein könnte . Und in JavaScript schauen Sie in dieses Ding, wo wir diesen ausgefallenen Punkt, Punkt Punkt Ruhe haben , und dann gehen wir weiter und Konsul, protokollieren Sie nicht, was auch immer der Rest ist. Gehen wir weiter und erfrischen wir uns. Konsolenprotokoll Wir haben Prairie Henry Veto und Maya, das sind alle anderen, die hier drin sind Das nennt man Verhaftung. Sie müssen den Namen Rest nicht verwenden. Es könnte alles andere sein. Es wird durch den Punkt, Punktpunktnotation, Hurley Punkt, Punkt, PunktSyntax bezeichnet Punktpunktnotation, Hurley Punkt, Punkt, Punkt . Sagen wir einfach, dass alle anderen das genehmigt haben. Wir müssen es nicht Ruhe und Voila nennen, es funktioniert genau so, wie wir es erwarten. In Ordnung, ich werde das ausmachen, und wir haben noch eins. Wir können auch Objekte d strukturieren. Lassen Sie uns also voran und erstellen Sie ein neues Objekt. Objekt Person wird sein. Es wird gemein sein, weil ich es schätze. Der Name wird Caleb in meinem Alter sein. Was 30 sein wird und die Anzahl der Katzen, die ich habe, wird auch sein . Und mein Lieblingsessen wird Pizza sein Also wieder stoßen wir auf das gleiche Problem, wo, wenn ich nur meinen Namen bekommen und das in einer Variablen speichern wollte, ich schreiben müsste. Konstante Name ist gleich Person Punktname. Const. Alter ist gleich Person dot Alter Const. Katz ist gleich Person Punkt Katzen. Ich denke, du bekommst stattdessen die Idee. Schwäche d Struktur dies und so lasst uns gehen und alles hineinwerfen. Lass es uns tun, lass hier. Ich schätze. So. Lass es uns tun. Lasst uns und wir arbeiten nicht mit einem Array, also werden wir nicht das A-Rennen und die Steuer benutzen. Wir werden die Objektsyntax verwenden, und es wird so aussehen, im Grunde, im Grunde, ist das Objekt-Zeichen auf dem rechten Objekt-Zeichen auf der linken Seite auf der rechten Seite. Wir können uns tatsächlich durch die tatsächliche Objektvariable selbst ersetzen. Das ist, als würde man sagen, dass das alles hier drin ist. Und dann sagen wir, ich wollte nur den Namen und das Essen bekommen, das ich tun könnte. Name und Lebensmittel Rat Dot Log-Name ist Name und Essen ist Essen. Lass uns weitermachen. Geben Sie das eine Chance. Der Name ist Caleb. Essen ist Pizza. Dieser musste nicht in Ordnung gehen. Hat es getan. Mit dem Array, wenn wir ein Array strukturiert haben, aber mit einem Objekt, weil alles immer benannt ist, ist hey, erhalten Sie den Namen. Das ist also der Schlüssel hier. Holen Sie sich auch den Schlüssel namens Essen Alle anderen Jetzt kümmern wir uns nicht darum, aber lassen Sie uns diesen einen Schritt weiter gehen. Wir können damit tatsächlich ein wenig komplizierter werden, denn was ist, wenn dieser Schlüsselname etwas dunkles ist wie der Vorname für den Benutzer? Warum würde das passieren? Ich weiß es nicht, aber gelegentlich passieren solche Dinge. Und so müsstest du diesen Namen da reinlegen. Das ist einfach schrecklich. Und so Aber stellen Sie sicher, dass das funktioniert. Lass uns frisch sparen. Und da ist es. Mein Name ist Caleb, aber jetzt haben Sie diese Bruttovariable namens Vorname für den Benutzer. Was wir tun können, ist dies neu zuweisen und weil wir im Grunde ein Objekt auf der linken Seite hier erstellen und dann den Schlüssel einem Variablennamen neu zuweisen, ein wenig verwirrend war. Wir können im Grunde sagen, Hey, das ist der Schlüssel, den wir extrahieren wollen. Und was ist der Variablenname, den wir verwenden möchten. Nennen wir es einfach Vornamen und wir können, wenn das für Sie sinnvoller ist, setzen Sie dies auch auf mehrere Zeilen. Lass uns weitermachen. Aber es gibt auf mehreren Zeilen und das sieht einfach ein wenig sauberer aus, besonders wenn mein Spaß so groß ist. Aber das sagt im Grunde, Hey, schnappen Sie sich den Schlüssel und dann werden wir es der Variablen namens Vorname wieder zuweisen. Gehen Sie weiter, speichern und aktualisieren Sie. Und sicher genug, es funktioniert immer noch. Und nur um sicherzustellen, dass es funktioniert. Definitiv nicht. Caleb. Da ist es. Name ist definitiv nicht Caleb. Wir wissen also, dass dies funktioniert und so zu neu zugewiesen wird. Das alles, was du tun musst, ist Essen zu sagen. Legen Sie einen Doppelpunkt da rein. Es ist also dein Schlüssel. Also ist es tatsächlich tun, dass das dein Schlüssel sein wird. Und was auch immer dein neuer VAR-Name ist, in diesem Fall werden wir sagen, dass das Essen auf Lieblingsessen umordnet wird. Und jetzt ist dies im Rest unserer Anwendung etwas ausführlicher. Also könnten wir Lieblingsessen sagen. Da ist es. Wir könnten sogar so weit gehen, wie Eigenschaften gesetzt werden, die noch nicht einmal existieren, also werde ich nur etwas davon rückgängig machen. Lass das einfach schön und ordentlich aussehen. Okay, also habe ich nur einen Haufen dieses Sortiercodes rückgängig gemacht. Sieht immer noch schön und sauber aus. Und was, wenn es hier eine Immobilie gibt, nach der ich suche? Das gibt es nicht. Also sagen wir aus irgendeinem Grund, ich soll eine Lieblingsfarbe haben. Und sagen wir, die Farbe soll blau sein. Aber aus welchem Grund auch immer, diese Person Objekt hat nicht, dass, während das, was wir hier sagen, ist Farbe und dann können wir einfach sagen, ist gleich blau. Und wenn ich dieses Lieblingsessen zu tun, ändert sich dies in Glaubensfarbe, und da ist es. Lieblingsfarbe ist blau, und so jetzt setzen wir tatsächlich den Standardwert. Aber was passiert, wenn dies in Ihrem Dies bereits existiert? Wir ändern zu lesen. Glaubst du, das wird blau bleiben, weil wir Farben wie Blau signieren? Oder glaubst du, das wird versuchen, das zu packen? Und wenn es nicht existiert, dann verwenden Sie die Farbe Blau. Lassen Sie uns voran und experimentieren und herausfinden, und ich empfehle immer, immer nur Dinge zu testen. Es könnte Spaß machen. Nur ein Test, um zu sehen, wie sie hinter den Kulissen funktionieren. Okay, also habe ich Refresh getroffen, und seine Lieblingsfarbe ist rot. Trotz dieses Sprichworts blau, liegt es daran, dass es tatsächlich im Personenobjekt existiert. Dies setzt nur einen Standardwert ein, wie wenn wir eine Funktion mit einem Standardwert für einen Parameter geschrieben haben. Das ist genau das Gleiche, was wir hier tun. Was ich Ihnen als kleines Experiment hier erlauben werde , ist, dass Sie ein Objekt wie dieses erstellen, und dann möchte ich, dass Sie dieses Objekt strukturieren. Aber ich möchte, dass Sie Verhaftung verwenden, und ich möchte, dass Sie herausfinden, was in dieser Ruhe gespeichert ist. Möglicherweise müssen Sie hier neue Eigenschaften hinzufügen, um sicherzustellen, dass dieser Rest tatsächlich etwas zusätzliches zeigt . Oder vielleicht nicht. Hängt davon ab, wie Sie es schreiben. Aber ich locke Sie dazu, das hier zu schießen. Basteln Sie einfach mit ihm herum und haben Sie Spaß. Sehen Sie, was dieser Rest tut Konsolenprotokoll Punkt Rest. Also am Ende des Rates, ich melde keine Ruhe und sehe nur, was das zurückkehrt, also geh voran, gib dem einen Schuss. Wenn du nicht alles in diesem Video verstehst, rate mal was? Das ist völlig okay. Es wurde nicht erwartet, dass Sie jede einzelne Sache aus jedem einzelnen Video kennen, das sich dauerhaft vorwärts bewegt . Es ist Codierung funktioniert nicht so. Lerne so viel du kannst. Und wenn Sie sich ein wenig satt fühlen oder Board de Strukturierung und gehen Sie auf die nächste , die nächste Lektion. Und wenn Sie jemals De Strukturierung in der Wildnis sehen, vielleicht lesen Sie einige Quellcode und Sie gehen, wie kommen, es sagt, Lassen Sie uns geschweifte Klammer Name. Lebensmittelfarbe. Geschweifte Klammer ist gleich einem Objekt. Oder vielleicht sehen Sie ein D-strukturiertes Array. So oder so, Sie werden auf den Code vorbereitet sein, der auf Sie geworfen wird. 53. Zeitauslöser: Hallo, Ende. Willkommen zurück. Werfen wir einen Blick auf diese neue Sache, die eine Auszeit genannt wird. In der Welt von JavaScript können wir tatsächlich sagen, dass Code für eine bestimmte Zeit nicht ausgeführt wird. Und das nennt man eine Auszeit. Lassen Sie uns also einen Blick auf die Syntax hinter einer Auszeit werfen. Wir verwenden dieses Schlüsselwort namens Set Time out. Es ist nicht wirklich ein Schlüsselwort als Funktionsname festgelegt Timeout, und dann könnten wir es eine Funktion übergeben, wenn wir wollten. Und das ist unser Rückruf. Und dann wird unser zweiter Parameter einfach sein. Wie lange sollten wir eine Auszeit in Millisekunden machen? So sind 1000 Millisekunden gleich einer Sekunde, bis wir dies in Millisekunden schreiben. Darüber hinaus könnten wir auch einfach Callback-Funktion sagen, was auch immer diese Funktion aufgerufen wird. Das würde also wie Funktion aussehen, so etwas. Und so ist das wirklich alles eine festgelegte Zeit. Es sieht so aus, als würde es eine bestimmte Funktion ausführen, und es wird 1000 Millisekunden, 5000 Millisekunden oder 42 Millisekunden warten , bevor es tatsächlich ausgeführt wird. Also lassen Sie uns einen Blick auf, wie das tatsächlich aussieht Says, um eine Auszeit zu setzen. Legen Sie eine Auszeit fest. Ist das eine Funktion hier drin? Und wir gehen nur zum Council Dot Log Timeout und wir werden drei Sekunden warten. Denken Sie daran, das sind Millisekunden. Das ist also das Äquivalent zu drei Sekunden, und ich werde meine Seite hier aktualisieren. Du kannst mir dabei zuschauen, und dann zählen wir zusammen, und da ist es. Es dauerte drei Sekunden. Nun, das ist etwas schwieriger zu erkennen. Was wir stattdessen tun können, ist, dass wir unsere Seite aktualisieren können, und dann können wir wie die Hintergrundfarbe der Seite ändern. Lasst uns den Const Körper machen. Denken Sie daran, const wird Block hier auf diesen speziellen Block beschränkt sein. So Körper wird Dokumente Punkt-Abfrage Selektor, Körper und dann Körper Punkt-Stil, dass die Hintergrundfarbe ist gleich blau. Das ändert sich auch. Farbig bis weiß, nur die Textfarbe. Lasst uns weitermachen. Gib dem eine Auffrischung und wir warten nur, Mann. Da ist es. Und nach drei Sekunden, sicher genug, änderte sich die Seite. Was passiert, wenn wir hier ein Konsolenprotokoll anlegen? Konsolenprotokoll, erstes Konsolenprotokoll Und wir haben einen hier unten gelegt. Dies ist das dritte Konsolenprotokoll. Und lasst uns nur für die Nachwelt. Angenommen, dies ist das zweite Konsolenprotokoll. Also, weil es hier draußen eine Zeit macht, denken wir, dass das läuft? Warten Sie drei Sekunden, dann führen Sie das aus und führen Sie dann diese Zeile aus? Oder glauben wir, es wird das laufen? Sag mal, Jep, es gibt eine Zeit hier draußen. Führen Sie das dritte Konsolenprotokoll aus und dann drei Sekunden, nachdem es diese bestimmte Zeile hier erreicht hat ,wird es dies ausführen. , Was denkst du, wird passieren? Lasst uns weitermachen. Speichern Sie die Aktualisierung und finden Sie heraus, 1. 3. und Boom zweite Konsolenprotokoll. Und so ist dies eine leichte Einführung in die Welt des asynchronen Codes. Was das bedeutet, ist, dass Ihr Computer diesen Code von oben nach unten lesen wird. Es wird auch diese Zeile lesen . Ja. Ja. Okay, ich kann das hinrichten. Es wird diese Zeile lesen und sagen: Oh, Oh, das ist eine Zeit von drei Sekunden. Ich verstehe, dass ich das protokollieren werde, also werde ich das in den Hinterkopf stellen und ich werde weitermachen. Aber von der absoluten Millisekunde oder Mikrosekunde, dass Ihr Computer diese Zeile hier trifft . Es wird anfangen, bis drei zu zählen. Es wird eins zu drei gehen. Und während es das im Hintergrund macht, ist es bereits ausgeführt, dass wahrscheinlich eine Reihe von anderem Code und dann weit unten, nachdem eine Reihe von anderem Code bereits ausgeführt wurde. Es wird diese festgelegte Timeout-Funktion ausführen, also wird es hier unten laufen. Und so ist das eine leichte Einführung in festgelegtes Timeout und asynchronen Code. 54. Intervalle: in der Welt von Javascript. Es gibt diese Idee, dass Sie Code immer und immer und immer wieder ausführen können, bis gesagt wird , dass Sie aufhören zu laufen. Und das ist ein Intervall. Und genau wie eine Auszeit, sagten wir ein Intervall sehr ähnlich. Also würden wir ein festgelegtes Intervall verwenden. Es nimmt eine Funktion als Art der Callback-Funktion und dann eine Zeit als zweiter Parameter . Und so sagen wir für jede Sekunde, das ist wieder Millisekunden genau wie in festgelegtem Timeout. Das ist eine Sekunde. Also werden wir uns in Millisekunden verwenden und wir wollen nur Dot Log konsolen. Ich laufe ab. Und wenn wir unsere Seite aktualisieren, werden wir sehen, dass dies jede Sekunde immer und immer wieder läuft. Wir können tatsächlich sehen, dass das hier zählt. Jede Sekunde wird immer und immer weiter laufen, und es tut nichts Nützliches, sondern in freier Wildbahn. Wenn Sie Riel-Code schreiben, möchten Sie möglicherweise tatsächlich jede Sekunde eine Ajax-Anfrage an einen Server ausführen, um zu sehen, ob ah Benutzer das Abendessen protokollieren, um einen Cookie am Leben zu halten oder vielleicht Browserdaten an einen Dienst zurück zu senden. Dafür gibt es viele Verwendungen. Es gibt auch einen guten Anwendungsfall, um dies loszuwerden. Was wir also tun können, ist, dies in eine Variable zu setzen, also sollte hier eine reguläre Variable erstellt werden. Rufen wir es uns an. Es ist länger und so wird es sich nur anmelden, und wenn ich die Seite aktualisiere, wird es immer noch ausgeführt. Es ist in einer Variablen, aber diese Funktion, diese eingestellte Intervallfunktion wird tatsächlich ausgeführt und sie wird in dieser Variablen gespeichert. Nehmen wir an, wir wollten das gut loswerden, als ein besseres Beispiel. Machen wir es richtig im Konsul. Wir werden klares Intervall machen, und wir geben ihm einfach den Variablennamen länger und Sie können sehen, dass es bei der Nummer 22 gestoppt ist. Nummer 22 ist nicht wichtig. Es war zufällig, dass ich es gestoppt habe, als es bei der Nummer 22 zählte. Und so lassen Sie uns voran und erstellen Sie eine Auszeit mit einem Intervall. Lassen Sie uns eine Auszeit machen. Wir setzen hier eine Funktion ein, und wir werden dieses Intervall des Lagerintervalls löschen. Und diese Auszeit wird nach fünf Sekunden stattfinden. Und so wird das vermutlich fünf Mal laufen, und nach fünf Sekunden wird es aufhören zu laufen. Lassen Sie uns voran und erfrischen, und wir warten nur auf drei, vier, fünf. Ich weiß es nicht. Sieh dir das an. jetzt nicht ganz zu fünf gekommen, oder? Jetzt kommt es auf die Verarbeitungszeit Ihrer Computer an. Was, wenn wir 5,5 Sekunden machen? Mal sehen, was hier passiert. Also geht es auf zwei, dann drei und dann vier. Und dann ist es da. Fünf. Und so war alles, was wir dort tun mussten, wirklich diese Zahl nur ein bisschen hoch, nur um sicherzustellen, dass dies immer fünf Mal läuft. Es gibt definitiv einen besseren Weg, dies zu tun, aber das ist nur eine Möglichkeit, es zu mischen und anzupassen. Ein festgelegtes Intervall, und er setzte Zeit zusammen 55. APIs und Ajax mit Fetch: Okay, werfen wir einen Blick auf eine Ajax-Anfrage mit dem Fetch A p I Jetzt wird das ziemlich JavaScript e und ehrlich gesagt, das ist nicht super anfängerfreundlich, aber ich werde das sowieso da draußen machen, weil es eigentlich sehr wichtig, wenn es darum geht, einseitige Anwendungen zu erstellen, zum Beispiel. Weißt du, wenn du auf Facebook dot com bist und auf einen Link klickst und die Seite nicht blinkt, nur bestimmte Abschnitte tatsächlich aktualisiert. Das benutzt den Abruf eines P I. Also das schafft im Grunde eine Ajax-Anfrage, die sagt, Hey, Server facebook dot com oder app dot facebook dot com Was auch immer es ist, ich möchte eine Reihe von Daten zurück, und dann werde ich rendern, was auch immer die Daten verwenden JavaScript wird mein eigenes HTML schreiben und dann werde ich die Seite nur in diesen speziellen Abschnitt Sie müssen also keine vollständige HTTP-Anfrage machen und die Datenbank für Benutzerinformationen und solche Dinge löschen . Es wird nur einen kleinen Abschnitt der Seite aktualisieren. Das ist im Grunde das, was Fetch tut. Und deshalb brauchen wir dafür ein A P I. Also lasst uns die Star Wars machen. A P Ich sumpfig gut alt, sumpfig und lasst uns voran gehen und ah, lasst uns die sumpfige AP holen, die ich höre. glaube, Ichglaube,es ist hier unten. Ja, das ist die Verbindung, die wir wollen. Es wird uns sagen, dass es sumpfig ist. Dot dot c o Schrägstrich ap ich Menschen ein noch Planeten drei oder Raumschiff neun Gehen Sie mit Menschen. Eins. Wer ist dieser Luke Skywalker? Natürlich. Natürlich ist es Luke. Was, wenn wir diese Jason Data bekommen wollen? Wie sollen wir das zum Laufen bringen? Nun, was wir tun können, ist richtig. Ein Abruf. Und so gehen wir weiter und schreiben ein paar Abholungen hier. Wir könnten einfach das Wort Fabrik gebrauchen, es Ihnen geben oder ich, was tun sollte, um dies zu tun. Ihr seid alle hier, und es sieht so aus, als wäre es erledigt, aber es ist eigentlich nicht. Dann werden wir das Then-Schlüsselwort verwenden, also im Grunde wird dies die Ajax-Anfrage ausführen. Es gibt andere Einstellungen, die Sie hinzufügen können, wenn Sie keine reguläre Get-Anfrageausführen möchten , wenn Sie keine reguläre Get-Anfrage , können Sie einen Beitrag machen , eine Reihe anderer Dinge anfordern. Wir werden nicht über all diese Rubriken gehen. Also der nächste Schritt ist die Verwendung von dot Dann alles, was ich hier getan habe, war es auf eine neue Zeile zu setzen. Also ist es das gleiche wie das hier. Es sieht nur ein wenig lesbarer auf diese Weise Funktion aus, was auch immer diese Antwort sein wird. Und ich werde Antwort Punkt Jason zurückgeben. Also bin ich nur um sicherzustellen, dass, was immer von diesem zurückkommt, du Earl in dem Variablennamen namens Antwort, ich werde dann j sahn Wenn ich sicherstelle, dass das nicht Jason Format ist, weißt du, wenn du noch nie Jason angeschaut hast vorher, sieht es viel wie ein JavaScript-Objekt aus. In der Tat ist es fast identisch mit einem Javascript-Objekt. Sie haben Ihre öffnende geschweifte Klammer. Sie haben ein Schlüssel-Wert-Paar, Komma, Schlüssel-Wert-Paar, Komma, Schlüssel-Wert-Paar. Zugegeben, dies könnten wahrscheinlich keine Strings sein. Das könnten nur Zahlen sein, aber wir können es vorerst als String belassen. Also, was das tut, ist zu sagen, Hey, warten Sie, bis das passiert. Und wenn das erledigt ist, wenn wir eine Antwort in dieser Funktion bekommen, machen Sie das in Jason. Stellen Sie sicher, dass es Jason ist, und wir wissen, dass es Jason ist, denn das ist Jason-Format Hoops. Ich klicke dort auf einen Link. Wir wissen, dass es Jason ist, weil das Jason-Formatierung ist, und dann werden wir noch einen Punkt hier schreiben, dann Funktion. Und wir könnten alles tun, was wir wollen, mit dieser Antwort. Wirklich? Also setzen wir unsere s und hier für eine Antwort, es war nur Konsolenprotokoll sind ja. Gehen wir zurück zu unserer Seite und drücken Sie Aktualisieren und Sie können nicht sehen, dass es all diese verschiedenen Dinge getan hat . Aber es hat hier ein Objekt für uns geschaffen. Und so haben wir unser Geburtsjahr. Wir haben erstellt, bearbeitet die Filmsaison mit der U R. L ist, dass wir dann auf Hit gehen könnten Es ist eine Liste, so dass wir gehen und durchlaufen alle von denen, wenn wir wollten. Geschlecht, Haarfarbe, Heimatwelt, all das Zeug, das wir gehen können und all diese Informationen bekommen, wenn wir es auch wollten. Nun, das ist eine sehr einfache Möglichkeit, eine Ajax-Anfrage mit Vanille-JavaScript mit dem Fetch a p zu erstellen , ich wieder nur eine Art zeigen Ihnen, wie das funktioniert. Verwenden Sie das Wort „Abrufen“. Es sieht so aus, als hätte eine Funktion Klammern. Es nimmt einen Parameter hier drin. Das ist deine UL. Es gibt zusätzliche Einstellungen, die Sie festlegen können. Das überlasse ich dir, wenn du das jetzt erkunden willst oder vielleicht zu einem späteren Zeitpunkt in deiner Karriere erforschen willst. Sobald wir fertig sind, darauf zu warten, dass das zurückkehrt, sagen wir: Okay, wenn das fertig ist, dann geh und tu das. Und wir sagten, OK, na ja, was auch immer das antwortet, wir wollten sicherstellen, dass es Jason ist, nicht unbedingt Jason sein muss. Vielleicht ist es XML. Vielleicht müssen Sie etwas XML analysieren, etwas anderes mit einem A p I tun. Und wenn das erledigt ist, wird das, was auch immer dies zurückgegeben wird, diese Variable hier sein. Also nannte ich es nur Rez. Eine kurze Antwort. Du siehst unsere ES ziemlich viel. Gelegentlich werden Sie sehen, einige Leute sagen einfach unsere Das ist auch kurz für rez, die kurz für die Antwort ist. Dann ändern wir diese zusammen und sagen: Hey, Hey, wenn das fertig ist, machst du das hier und logge es einfach auf. Jetzt können wir viele andere Dinge bündeln, die wir gelernt haben, wie Scoping und sagen: Hey, Hey, lass uns voran gehen und Luke Skywalker holen, so dass Constant Luke gleich einem leeren Objekt ist. Und dann könnten wir sagen, Luke ist gleich, was auch immer diese Antworten Council dot log Luke. Und genau wie in ihrem Set, Intervall weniger. Und lassen Sie uns sehen, was hier passiert, wenn wir Konsulat vor Konsul Dot Log danach tun . Und wo glaubst du, wird das laufen? Wir könnten sogar ein Konsolenprotokoll hier Council Dot Log machen, dann Nummer eins Konsolenprotokoll, dann Nummer zwei. Und so als Menschen lesen wir das auch. Dies wird die 1. 1 dann eins, dann zwei und danach sein. Aber funktioniert es so wirklich? Lassen Sie uns voran und aktualisieren Sie die Seite, die wir bekommen, bevor Sie dann eine, dann zwei, und dann erhalten wir eine ungültige Zuweisung zu const. Weil sieh dir das an. Ich sagte, eine Konstante sei ein leeres Objekt. Was das hätte sein sollen, war ein Let Ok, hier, Sie Das funktioniert besser. Also haben wir vorher nach dann eins, dann zwei und dann alle Luke Skywalker Informationen vor, nachdem dies auf eine Antwort von einer anderen Website wartete. Vielleicht wird das Gefühl, eine Sekunde, fünf Sekunden oder 30 Sekunden zu nehmen, es dann verarbeiten, ein zweites Mal verarbeiten und dann Konsolenprotokoll. Lukas. Was bedeutet das alles? Dies ist im Grunde Ihr Abruf ein p I mit JavaScript-Versprechen. Und das Schöne daran ist, dass Sie diese tatsächlich in Funktion eins aufteilen können. Und dann könnten Sie dies in eine Funktion aufteilen, um wenn Sie es wollten, und das sieht einfach viel sauberer aus. Tun Sie das und behalten Sie das so, wie es war, obwohl jetzt das Problem mit dem, was wir hier geschrieben haben, ist, wenn Sie dies entdeckt haben, wir haben Luke gleich Justin leeres Objekt ist, und wir setzen. Luke ist gleich, was auch immer die Jason-Antwort war, aber da dies ausgeführt wird, hat dies eine Wartezeit. Es ist also asynchron. Also macht es etwas im Hintergrund, und dann läuft das sofort nach diesem. Wenigstens sieht es so aus. Wir haben noch keinen Zugang zu schauen, also meldet der Rat Luke nicht und lasst uns voran und sagen Luke, damit wir dieses Protokoll des Rates identifizieren können. Wir hatten ein leeres Objekt. Das ist, weil wir das hier eingerichtet haben. Wir sagten, es sei ein leeres Objekt und Onley nach einer Weile. Haben wir tatsächlich die Antwort zurückbekommen und gesagt: Hey, Hey, überschreiben Sie sie? In Ordnung, also habe ich das gerade aufgeräumt. Ich denke, wir sollten hier noch etwas tun. Also gehen wir zurück zu unserem Objekt, das wir vom sumpfigen Punkt c o a p I bekommen und lassen Sie uns die Filme holen. Das ist also eine Liste, die wir sehen können. Es ist eine Liste, weil es die harten Klammern hier hat. Luke Skywalker ist nicht fünf Filme, also 1234 und fünf Sie können auch sehen, dass es eine Länge von fünf gibt. Lassen Sie uns voran und d strukturieren dies und lassen Sie uns einfach die ersten 3 Filme bekommen, damit wir wissen, dass dies ein Array ist , aber es ist innerhalb eines Objekts. Also, wie bekommen wir Filme? Nun, Filme stammen von einem Objekt namens Well, wir nannten es Luke, damit wir uns Filme anschauen konnten und das wäre ein Array. Jetzt wissen wir, dass das Array jetzt schwächen D Struktur, dass Daten. Also könnten wir sagen, Const, du bist ein Eins. Sie waren alle auch, und Sie sind alle drei. Wir wissen nicht unbedingt, was das sind. Wir wissen, dass wir mit einem Array arbeiten, also müssen wir die Rate Typ Syntax verwenden. Lassen Sie uns auch andere Filme verhaften, also nennen wir es nicht, Sie helfen 12 und drei. Lassen Sie uns diesen Film tun 12 und drei ist gleich Luke Dot Filme. Nun, das wird nichts tun, weil wir nicht Film 123 oder Filme verwenden und auch Constance Block auf dies beschränkt sind, so dass wir es nicht wirklich über diese spezielle Funktion hinaus verwenden können. Aber wir könnten sagen, Was ist die zweite Filmkonsole Log-Film, was auch immer das sein wird . Und hier ist es. Das ist der Film. Also lassen Sie uns fortfahren und Link Position kopieren. Dies wurde gefilmt Nummer sechs und Identität. Es würde, äh, wir schauen uns Luke Skywalker Filme an, um 6317 263 eins von sieben. So Film hatte eine Idee von sechs und wir können sehen, dass genau hier, das war Film zu. Wir haben das mit einer Ray de Strukturierung gemacht, und das hat uns dazu gebracht. Und dann könnten wir Abholanforderung ausführen, wenn wir es auch wollten, eine andere Sache, die wir tun könnten, ist, lasst uns das aussagen, weil das irgendwie ordentlich, aber nicht nützlich ist. Das werde ich auch ändern. Wir könnten durch jeden Film schleifen und jeden von denen bekommen, so dass wir dio luke dot Filme dot für jede Weitergabe einer Funktion. Dies wird die URL sein und dann der Index Council dot protokollieren Sie den Index und dann der Earl , dies wird nicht in einer bestimmten Reihenfolge sein wird, was auch immer Reihenfolge dies ein p Ich gibt eine Erhöhung zurück, halten ihre Bestellung. So wird dies sagen, 6317 Lassen Sie uns voran, speichern aktualisieren. Und so haben wir jetzt 26317 in der gleichen Reihenfolge, die Swap edotco gab uns. Aber in unserer Schleife haben wir Index Null bis vier in der Reihenfolge. Nun, wenn Sie wirklich wollen, um Phantasie zu bekommen, was Sie tun können, ist, dass Sie das für jeden nehmen können und Sie jeden Film hier holen und diese Daten sowie so weiter und so weiter und so weiter und so weiter. Und während Sie dies tun, haben Sie tatsächlich Ihre eigene Form einer einzigen Seite Anwendung erstellt. Wir verwenden im Grunde nur ein A P I, um Daten zu erfassen. Nun, dies ist ein ziemlich komplexes Konzept in JavaScript. Ich erwarte nicht, dass du das sofort weißt. Ich erwarte nicht einmal, dass du das seit einiger Zeit weißt. Aber es ist gut zu wissen, dass diese Option da draußen ist. Du wirst das sehen, vor allem in den kommenden Jahren. Fetch ist überall. Es ist eine gute Möglichkeit, Ajax-Anfragen und nur für die Nachwelt zu verwenden. wir sicher, dass wir wissen, was Ajax ist. Ajax ist eine Senkstraße, dieses Javascript und XML, oder in diesem Fall ist es Jason. Also ein Richter, schätze ich. Alter J A. J Ursprünglich wurde es für XML entwickelt. So gibt es schnelle Lektion über Ajax und holen und versprechen. Wir verwenden de Strukturierung. Wir haben eine für jede Schleife verwendet. Wir bekommen jetzt super Javascript e mit einem A p I. Das ist wieder super cool. Ich erwarte nicht, dass Sie all das wissen, also fühlen Sie sich nicht, dass Sie von uns allen überwältigt werden sollten. Fühlen Sie sich frei, diesem einen Schuss zu geben, um damit herumzubasteln? Absolut. Aber weißt du was? Wenn es nicht sofort in dein Gehirn klickt, ist das okay. Das wird es irgendwann. Sobald du damit zufrieden bist, lass uns das nächste Video ansehen. 56. Arrow: in modernem JavaScript. Es gibt diese Idee einer Pfeilfunktion und wirklich, was das ist eine spezielle Art von Funktion. Dies ist relativ neu und unterscheidet sich ein wenig von den anderen Arten von Funktionen, die wir in diesem Kurs gelernt haben. So wie eine schnelle kleine Zusammenfassung hat eine reguläre Funktion eine Schlüsselwortfunktion und dann einen Namen, und dann entweder keine Parameter oder einen Parameter oder mehrere Parameter, und dann gibt esetwas zurück, etwas zurück, es gibt eine Sache zurück. Es gibt auch anonyme Funktionen, so dass Sie das in wie einen Variablennamen einfügen können. Also, wie Const, Caleb ist gleich Funktion. Mach ein paar Sachen zurück, Caleb. Und dann konnten wir diese immer einwickeln und ich f e und sofort aufgerufene Funktion. Das wird also automatisch laufen, und wir könnten das Gleiche hier machen. Das ist also ein kurzer Rückblick auf das, was wir bereits über Funktionen gelernt haben. Jetzt, in JavaScript, wenn Sie richtig zu funktionieren, genau wie wenn Sie ein Objekt haben, haben Sie Zugriff auf das Schlüsselwort dasselbe mit einer neuen Klasse und einer Methode darin. Also haben Sie einen im Grunde einen Funknamen hier haben Sie Zugriff auf dieselbe Sache in einem Objekt, also ist CONST Person gleich dem Funknamen hier, Funktionsnamen hier, und Sie haben Zugriff darauf. Und was das wirklich bedeutet, ist, dass es sich auf diese Funktion bezieht. Dies bedeutet diese Klasse, das bedeutet dieses Objekt. Was auch immer es definiert, das ist, was dieses Schlüsselwort bedeutet, wenn wir anfangen, über Aero-Funktionen zu sprechen, die nicht mehr existieren. Wenn wir also eine Pfeilfunktion verwenden, ist der große Unterschied zwischen einer schmalen Funktion und einer unregelmäßigen Funktion anders als die Syntax, die anders aussieht. Es hat auch diesen Punkt nicht, was auch immer Name oder diesen Punkt, was auch immer Name Funktion nicht hat, dass dies nicht gebunden ist. Nein, Das Schöne daran, dass eine Pfeilfunktion ist, wenn dies nicht an Ihre Funktion oder das definierende Objekt gebunden ist, was schnelleres JavaScript bedeutet. Wenn Sie Variablen nicht ständig neu zuweisen oder Dinge im Speicher speichern müssen, kann Ihr Computer tatsächlich schneller laufen. Jetzt ist es für einen Menschen nicht merklich schneller, aber wenn Sie 10 Millionen Zeilen JavaScript haben, ja, es könnte ein bisschen schneller werden, ziemlich viel schneller, abhängig von der Logik, die Sie schreiben. Werfen wir einen Blick auf eine normale Pfeilfunktion hier, also sagen wir einfach Grüß. Lassen Sie uns machen, dass ein wenig größer gleich dem Öffnen und Schließen von Klammern ist. Also haben wir unsere Klammern da. Fatter Pfeil. Deshalb nennen wir es eine Pfeilfunktion und dann Klammern. Nein, du sagst nur Hallo Welt. Und um dies auszuführen, könnten wir einfach mit Klammern grüßen. Gehen wir weiter. Laden Sie diese in unserem Browser. Ich benutze Firefox. Ich drücke Aktualisieren, und es tut nichts. Gehen wir weiter und führen es hier sowieso, und es wird sagen vereinbart. Der Grund, der nichts tut, ist, weil es etwas zurückgibt. Also, wenn wir Const gesagt haben. Hoch ist gleich zu grüßen Auffrischungsseite, sagen hallo und es sagt auch hallo Welt. Es ist also wie eine normale Funktion. Es sieht an dieser Stelle einfach ein wenig anders aus. Das heißt also, dass dies Ihre Funktion ist. Name ist gleich einer Pfeilfunktion, also gibt es kein Schlüsselwort, das in diesem Punkt nicht existiert, was auch immer nicht existiert und es wird nur dies jetzt ausführen. Was wäre, wenn Sie einen Parameter in Ihrem Brunnen wollten, wenn Sie einen Parameter hier drin wollten, könnten Sie so etwas wie den Namen sagen. Hallo. Und dann gehen wir weiter und verwenden ein Template-Literal. Also zurück tickt. Hallo, Name und Konsolenpunktprotokoll. Hallo Refresher Seite. Und da steht, 00 ist es undefiniert. Es liegt daran, dass wir keinen Namen da reingesteckt haben. Also gehen wir weiter und setzen meinen Namen Caleb. Hallo, Caleb. Hallo, Zephyr. Und so weiter und so weiter und so weiter. Wir könnten auch einen anderen Parameter hier setzen, der als Ort bezeichnet wird. Also, äh, willkommen und dann Ort und sie müssen nicht Name oder Ort sein. Sie könnten alles sein, was Sie wollen. Wir werden hier in Atlantis einen Ort aufstellen, an dem meine Katzen es wirklich hassen würden, weil es wässrig ist. Aber da steht Hallo, Zephyr. Willkommen in Atlantis. Und so würden wir direkt in einer Reihe funktionieren. Lassen Sie uns das letzte Beispiel hier rückgängig machen. Und lasst uns voran gehen und einfach diese Klammern loswerden. Wenn hier nur ein Parameter vorhanden ist, brauchen wir keine Klammern. Es ist nur, wenn wir zwei oder mehr Parameter haben, dass wir diese Klammern in Ihrer brauchen wir haben nur die eine, also sagen wir die Funktion. Greet hat einen Parameter namens name, und dann wird es ausführen, was in diesen geschweiften Klammern ist, und so können wir voran gehen und das loswerden. Und lasst uns das in Henry ändern. Und das wird nur Hallo sagen, Henry. Jetzt können wir sogar Mawr schlank mit uns machen. Wir brauchen das hier nicht wirklich. Wenn das, was Sie tun, nur etwas sofort zurückgeben, können wir das wirklich vollständig loswerden. Und so sieht das ein wenig seltsam aus, aber dies ist eine Funktion, die den Parameter verpasst, und dies wird zurückgeben, was gerade hier ist. Und wenn ich meine Seite aktualisiere, funktioniert es immer noch. Und dann wieder für mehrere Parameter, könnten wir hier einfach Platz setzen. Hallo. Ich werde nichts Nettes sagen. Interessanter Ort. Machen Sie das etwas kleiner. Also Funktion Greet hat einen Namen Parameter Ort Parameter wird Hallo sagen. Was auch immer der Name ist, was auch immer die Orte sind. Und Henry ist in Kanada. Und so hallo, Henry Canada. Und das heißt, zum größten Teil, alles, was es wirklich zu einer Pfeilfunktion gibt, und das ist wirklich das gleiche wie die Funktion zu sagen. Greet hat Namen an einem Ort. Zurück. Nun, richtig. Das ist der alte Weg. Hallo, Name, bitte. Dies ist also die ältere Art, eine Funktion mit der alten Art zu schreiben, Strings zu kontaminieren. Und das ist die neue Art, es zu tun. Sie werden diese beiden Methoden überall auf der Welt sehen, also ist es gut, mit beiden vertraut zu sein. Aber das ist wirklich alles, was es über die Pfeilfunktion zu wissen gibt. Das und dieser Punktname ist gleich Name. Und dann könntest du Consul tun, diesen Punktnamen nicht protokollieren, wenn du willst. Das gibt es hier nicht. Es gibt einfach kein Schlüsselwort. Es ist einfach nicht gebunden. Werfen wir nun einen Blick darauf, wie das funktioniert. Vielleicht ein vier jeder Schleifen. Lassen Sie uns das aussagen. Das muss ich wirklich ändern. Lassen Sie uns das kommentieren und lassen Sie uns eine Liste von Dingen hier drinnen bekommen. Also, äh, lassen Sie uns ein Array erstellen. Lassen Sie uns eine const A r r erstellen Ist gleich JavaScript, Python PHP. Und dann in V s Code, Ich werde nur für jede Nope für jeden Hit Tab eingeben und wird sagen, Was ist Ihr erstes Array, wenn meine Erhöhung ein R Das ist genau hier und dann für jedes Element . Das ist ein feiner Pfeil. Dies ist eine fette Aero-Funktion. Also sagen wir dieses Element hier, was auch immer das sein wird, wir können jetzt damit arbeiten. Lassen Sie uns also von Elementen zur Sprache wechseln, weil es JavaScript, Python oder PHP sein wird . Und lassen Sie uns Konsole tun, nicht Sprache protokollieren und aktualisieren Sie Ihre Seite Transcript. Python Patri. Also gehen wir hin. Wir beginnen tatsächlich, die reguläre Funktion durch eine fette Aero-Funktion zu ersetzen. Wenn Sie das Schlüsselwort dieses nicht benötigen, können Sie auch nur die fette Pfeilfunktion verwenden. Es ist technisch weniger Code und auch weniger Belastung für Ihren Computer. Lassen Sie uns voran und erstellen Sie eine bestimmte Zeit mit einer Pfeilfunktion, so setzen Sie Zeit aus. So haben wir es vorher geschrieben, und wir sagen „Warten Sie eine Sekunde. Nun, das müssen wir jetzt nicht tun, weil es hier keine Parameter gibt. Was machen wir? Wir können das nicht einfach machen. Stattdessen übergeben wir es einen leeren Satz von Parametern und dann sagen wir, Konsul Dot Log ja, ich wartete Jascha Python PHP und dann, ja, ich wartete. Machen wir das hier drinnen etwas dramatischer und das ist Spam. Der Rat wartet nur darauf. Ich bin da, es ist. Ja, ich habe immer und immer wieder gewartet und das sind deine fetten Errol-Funktionen. Okay, also würde ich vorschlagen, uns eine Chance zu geben. Sie werden eine Menge von Aero-Funktionen in der Zukunft schreiben, wenn Sie ein JavaScript-Entwickler sein werden und so können Sie sich genauso gut daran gewöhnen Nun ist das Schöne daran, es ist eigentlich sehr einfach, sich daran zu gewöhnen. Eine Zeile statt mehrerer Zeilen ist immer sehr schön. Und wie immer, vergiss nicht, dass ich hier bin. Wenn Sie Fragen haben, hinterlassen Sie Ihre Fragen, Kommentare oder Bedenken Boogaloo und ich helfe Ihnen gerne weiter 57. CSS hinein/-e: Werfen wir nun einen Blick darauf, wie wir CSS-Klassen hinzufügen und entfernen können. Zwei Elemente in unserem Dokumentobjektmodell. Also vor und Web-Entwicklung verlassen wir uns sehr stark auf diese Klasse ist gleich, und dann, was auch immer Klassennamen lüften hier. Also vielleicht haben wir hier einen Klassennamen von rot, blau und weiß, ich denke, wo wir die Textfarbe ändern können, um Textfarbe zu blauer Textfarbe zehe weiß zu lesen . Wie gehen wir eigentlich davon aus, diese zu entfernen? Nun, erste Dinge zuerst, Um diese Demo einzurichten, werden wir einige CSS-Styling erstellen müssen. So Stil Punkt rote Farbe ist gleich zu lesen Punkt Blau wird blau sein. Und lassen Sie uns nicht tun Weiß, weil es einen weißen Hintergrund führt statt schwarz zu tun . Keine Schwarzen werden auch nicht funktionieren, weil Schwarz Standard ist. Gehen wir voran und gehen mit Grün. Befreien Sie sich von unseren Klassen. Lassen Sie uns voran und aktualisieren Sie Ihre Seite. Und doch natürlich passiert natürlich nichts. Wir haben diese Klassen noch nicht hinzugefügt. Wenn wir gelesen hinzugefügt haben, werden wir sehen, wie unsere Technologie ihre Textfarbe dreht, um zu lesen. Lassen Sie uns das loswerden und was wir tun müssen, ist dieses Element mit einer Art Abfrageselektor zu greifen . Sagen wir mal, wir haben hier eine Const. H eins ist gleich Dokumente Punktabfrage-Selektor und wir wollen nur dieses Alter eins greifen. Nun, was wir tun können, ist H ein Punkt Klasse Liste Punkt Anzeige, und wir können hinzufügen, Das ist ein blau. Und so wird das die Liste der Klassen zu greifen. Momentan ist nichts drin, und es wird blau hinzufügen. Also lasst uns voran sparen. Und sobald ich Refresh anklicke. Das wird genau so blau werden. In der Tat haben wir schon einen hier drin. Wir haben Zugang dazu. Wir können H eine der Klassenliste Punkt-Anzeige Nein tun, lassen Sie uns nicht hinzufügen Lassen Sie uns blau OK entfernen, Textänderungen. Wieder, Lassen Sie uns tun H ein Punkt Klasse Liste Punkt Add rot Perfekt. Lassen Sie uns voran und fügen Sie blau sowie und wir können sehen, wenn wir uns die h eine Note ansehen, dass es Klasse rot und blau darin hat. Nun ist der Grund, der blau ist, weil CSS Styling. Also kam zuerst Rot, dann war Blau der letzte, der hingerichtet wurde. Natürlich wird CSS sagen, dass ich mir die letzte Regel anhören werde, von der ich erzählt wurde. Ich werde das benutzen. Das ist also der Grund, warum es das tut. Hätten wir auch gesagt, jeder Punkt Klassenliste Punkt grün hinzufügen, das ist der letzte auf ihrer Liste unten hier unten, wird es grün. Alles klar, was passiert, wenn Sie mehrere Klassen hinzufügen möchten? Nun, Sie könnten H ein Punkt Klasse Liste Punkt ad blau, rot, grün, so weiter und so weiter. Das wird nicht funktionieren. Dies wird Ihnen wahrscheinlich tatsächlich einen Fehler werfen. Werfen wir einen Blick auf das. Ja, ungültige Zeichenfehlerzeichenfolge enthält ein ungültiges Zeichen. Grundsätzlich heißt es, da ist das. Da ist ein Raum drin und es sollte nicht so sein, Stattdessen, was wir tun, ist, dass wir ihm eine unendliche Liste von Parametern übergeben. Die 1. 1 wird blau sein, und dann wird die 2. 1 jetzt gelesen werden. Dies wird nicht notwendigerweise funktionieren, weil sie bereits eingestellt sind. Also lasst uns voran gehen und diese entfernen. Lassen Sie uns grün und blau entfernen und es sollte wieder rot werden. Grün/Blau. Und da ist es unser CSS. Unser H dreht sich zu rot und einfach so. Und so ist es, wie Sie hinzufügen und entfernen. Und wenn Sie möchten entfernen, nur als ein kurzes Beispiel, noch einmal Klassenliste Punkt ad einen Parameter blauen zweiten Parameter grün. CSS wird sagen, was auch immer man zuletzt kommt, ich werde die meisten ehren, also wird dies grün werden, wie erwartet. 58. Endziel: Alles klar. Es ist an der Zeit, dass wir an unserem endgültigen Projekt arbeiten werden, und dieses abschließende Projekt wird nicht alles, was wir gelernt haben, sondern einen guten Teil all der wirklich wichtigen Dinge verwenden . Und so sollte Ihr endgültiges Projekt dies tun. Immer wenn Sie Ihre Maus über einen dieser Buchstaben setzen, wird es nur ein wenig animieren. Dies wird eine Mischung zwischen CSS und JavaScript sein. Wenn Sie nicht super stark und CSS sind, ist das in Ordnung. Sie müssen es nicht unbedingt so animieren lassen. Sie könnten es haben ah, Rand oder ändern Sie die Schriftfarbe oder so etwas. Es muss nicht wie Fantasien sein. Ich habe es hier geschafft. Nun, um damit zu beginnen, möchte ich, dass Sie einen Titel erstellen. Erstellen Sie also etwas Text auf Ihrer Seite. Ich habe gerade „Final Project“ für meins geschrieben. Wählen Sie den Titel mit Ihrem Javascript und dann werden Sie sich fragen. Teilen Sie den Titel nach allen Zeichen. Sie werden jedes einzelne Zeichen hier greifen wollen, und dann werden Sie im Grunde alle diese Zeichen mit einem kleinen HTML um sie herum neu verbinden wollen und dann können Sie jedes Zeichen nach der Klasse auswählen, die um sie herum ist, und fügen Sie ein Ereignis-Listener für jeden. Also müssen Sie hier ein paar Schleifen verwenden. Und wenn Sie dann die Maus über einen legen, sollten Sie in der Lage sein, das Klassenstyling zu ändern. Fügen Sie also eine Klasse erneut hinzu oder entfernen Sie sie. Dies wird ein wenig CSS erfordern. Aber hey, weißt du was? Wenn Sie mit CSS nicht super stark sind, muss es nicht schick sein. Es muss nur funktional sein. Das ist, was Javascript ist. JavaScript-Dysfunktionalität. CSS ist Schönheit, also habe ich die beiden hier gemischt, aber wir müssen uns wirklich nur auf die Funktionalität konzentrieren. Das ist also meine letzte Anzeige. Das ist genau das, was ich hier habe, und ich möchte, dass Sie versuchen, dies auf eigene Faust zu schreiben, weil das ziemlich komplex ist . Auf jeden Fall fühlen Sie sich frei, die anderen Videos wieder zu referenzieren, oder einer der Quellcode auf jeden Fall verwendet Google oder Stack Overflow oder Mozilla Developer Network, MD Ende als jede Art von Referenz. Sie müssen dies erledigen, sich viel Zeit nehmen, wie Sie brauchen und versuchen, es selbst zu durcharbeiten. Also in nur einem Moment werde ich den Bildschirm schwarz drehen. Und ich möchte, dass du das Video pausierst und dem eine Chance gibst. Versuchen Sie Ihr Bestes, dies auf eigene Faust zu tun. Nun, offensichtlich, wenn Sie stecken bleiben, können Sie einfach auf Lebenslauf auf dem Video und Sie können sehen, wie ich es tue. Ich zeige Ihnen genau, wie ich zu diesem Punkt gekommen bin, damit ich das tun kann. Also mach weiter, pausiere das Video jetzt und gib dem einen Schuss. Alles klar, ich beginne mit meiner Überlegung dieser speziellen Lösung. Das erste, was wir tun müssen, ist einen Titel zu erstellen. Ich werde nur das H benutzen, das hier heißt Final Project. Also, dass man fertig ist. Lass uns weitermachen, das von unserer Liste loswerden. Als nächstes wählen Sie den Titel mit JavaScript, so müssen wir diesen Titel auswählen. Also lassen Sie uns voran und schaffen eine Konstante. Jeder ist gleich Dokumenten dot query selector se verriegelte Tür, und ich werde nur das H auswählen. Es ist das einzige H auf der Seite, also kann ich das tun. Dann möchte ich alle Titelfiguren greifen. Also will ich all das bekommen. Also lassen Sie uns voran und erstellen Sie hier eine neue Konstante namens Text und das wird 81 Punkt innerer Text sein. Ich möchte das gesamte Titelzeichen teilen, also möchte ich jedes einzelne packen. Und was ich hier tun möchte, ist, dass dies in ein Array verwandelt wird. Also werde ich Dot Split verwenden und wir werden uns auf absolut nichts teilen. Und lasst uns das und jenes loswerden. Und jetzt müssen wir jeden Brief wieder mit einer Klasse verbinden. Und so müssen wir diesen ganzen Text durchlaufen und für jeden einzelnen hier drin müssen wir eine Art Klasse um ihn herum legen. Also, was ich denke, ist überspannte Klasse Js Brief, so dass ich es mit Javascript so etwas auswählen kann , und wird durch jeden einzelnen gehen. So wird es eine Spannweite um die F A Spannweite um das Auge und ein l p r o j E C T und ich werde auch den Raum nicht einschließen wollen. Also, wie machen wir das? Nun, wir müssen ein neues HTML erstellen, um es hier einzufügen. Einige würden eine neue Variable namens HTML erstellen, und es wird nur eine leere Zeichenfolge für den Moment sein. Dann möchte ich den ganzen Text durchschauen. Also das ist nicht wirklich Text diese unsere Buchstaben und lassen Sie uns Buchstaben Punkt für jeden Buchstaben, den wir haben, haben wir einen einzigen Buchstaben und wir werden hier einen fetten Pfeil verwenden. Und wir könnten einfach mit diesem Brief arbeiten. Also, jetzt können wir sagen, HTML ist gleich HTML plus span. Klasse ist gleich, was auch immer die Klassen sein werden. Wir wissen es noch nicht. Was auch immer der Brief offen ist, ich werde das vorerst mit L füllen. Und so muss es so aussehen. Jetzt müssen wir die Daten hier reinlegen. Ich will hier nicht viel Verkettung machen. Ich möchte ein Template-Literal verwenden, und der Buchstabe kann nur der variable Buchstabe sein. Jetzt wird die Klasse hier drin Buchstaben und J s Brief sein. Also wird Brief sein, was ich CSS verwende, um auszuwählen und J s Brief wird nur ein JavaScript-Selektor sein , also halte ich diese zwei Welten getrennt. Jetzt, an dieser Stelle, kann ich mein H wieder auswählen und inneren Punkt HTML ist gleich HTML. Öffnen wir ihre Seite und erfrischen Sie unseren Konsul und wo ist unser H? Sieh dir das an. Wir haben eine Spanne um jeden einzelnen mit Buchstaben und J s Buchstabenklassen darin. Also, das ist wirklich gut. Das ist genau das, was wir wollen. Leider hat es auch den Platz da drin. Also müssen wir das erkennen. Also, wenn der Buchstabe nicht gleich einem leeren Raum ist, dann können wir eine Art von Klassen setzen. Klassen sind dir etwas gleich. Und auch lassen Sie uns Klasse angezeigt Klassen gleich standardmäßig wird leer sein. Und dann, wenn der Buchstabe etwas anderes ist als ein Leerzeichen, das auch diese Klassen und sich selbst zu Buchstaben J s Buchstaben hinzufügen und wir wollen dies nur durch Klassen ersetzen. Und das ist auch Blockbereich. Diese Klammern hier Also muss ich mich nicht darum kümmern, dass dieses Leck außerhalb meines Bereichs für die für jede Schleife läuft . Lassen Sie uns voran, aktualisieren Sie unsere Seite. Und da gehen wir. Wir haben jetzt keine Kurse da drin. Es gibt andere Möglichkeiten, dies auch zu tun. Sie könnten das im Grunde einfach mit ein paar zusätzlichen Verbesserungen sagen, aber wir werden das nicht tun. Okay, was steht als Nächstes auf der Liste? Wir müssen jedem von diesen einen Ereignis-Listener hinzufügen. Okay, bevor wir das tun, müssen wir eigentlich jede einzelne auswählen. Nun, diese alle haben eines gemeinsam, dass diese Klasse ist. Was? Sie werden beide Klassen gemeinsam haben, aber wir werden den Js-Buchstaben-Selektor verwenden, also lassen Sie uns voran. Eine grüne neue const Js Buchstaben ist gleich Dokumenten, holländische Abfrage Selektor alle, weil wir alle von ihnen wollen und wir werden R J s Buchstaben auswählen . Jetzt müssen wir durch jede von ihnen schleifen und fügen zwei Ereignis-Listener ein für, wenn wir unseren Mund über einen Brief und einen für, wenn wir unsere meisten aus dem Brief entfernen. Also werden wir eine für jede Schleife erstellen, also zeigen Js-Buchstaben für jeden, den wir im Knoten übergeben werden, und die Notiz, die wir hier bekommen, ist jedes einzelne Js-Buchstabenelement. Das ist also eine Notiz. Das ist ein Knoten. Das ist ein Knotenknotenknoten. Wir wählen nicht diesen Knoten Knoten Knoten aus. Nein, nein, nein. Und kein Zweifel. Also sagen wir für jeden dieser Knoten die individuelle Note ergriffen und etwas damit tun . Und es ist an dieser Stelle können wir unsere Ereignis-Listener hinzufügen. Lassen Sie uns das einfach nach oben scrollen, kein Punkt-Add-Ereignis-Listener und welchen wollen wir? Wir wollen die Maus über, wenn wir den Mund über den Ereignis-Listener legen, und es wird hier mit dem Ereignis funktionieren, und das ist nur Konsole. Protokollieren Sie diese Konsole protokollieren Sie diesen Punkt intertek So wird es zu Konsole. Protokollieren Sie den Buchstaben jetzt der Grund, warum wir die Funktion hier anstelle einer Aero-Funktion verwenden Nun, wir verwenden hier eine Pfeilfunktion, aber wir verwenden hier eine reguläre Funktion, weil wir dies brauchen. Wir brauchen dies, um sich auf den Knoten zu beziehen , der von hier kommt. Lassen Sie uns voran, sparen, geben Sie uns eine Auffrischung. Öffnen Sie sich. Unser Konsul und Abfrage-Selektor ist nichts. Abfrage-Selektor ist eine Sache. Da gehen wir und lassen uns unser Meistes über das endgültige Projekt legen und Sie können sehen, dass es beginnt, es in meinem Rat zu buchstabieren. Das ist also perfekt. Das ist es, was wir wollen. Jetzt müssen wir noch einen hier für die Maus hinzufügen, Maus aus. Also, wenn wir unsere Maus aus diesem bestimmten Element bewegen und lassen Sie uns einfach sagen, gehen wir voran, aktualisieren und legen Sie es über das P out p out aus f heraus. Das funktioniert also perfekt. Also jetzt haben wir Event-Listener auf jedem. Das Letzte, was wir tun müssen, ist auf dem Mund vorbei. Der Brief sollte mit CSS animieren, also müssen wir Klassen hier hinzufügen und entfernen. Also hier können wir diese Punkt-Klassenliste Punkt-Anzeige tun, und ich werde eine Klasse namens Aktiv und auf der Maus aus hinzufügen. Wir werden diese Klasse entfernen und werfen einen Blick darauf, wie das funktioniert. Lassen Sie uns unsere Inspektor Refresher Seite öffnen, und wann immer ich meine Maus hierher lege, können Sie tatsächlich sehen, dass sich die Klassen tatsächlich ändern. Also, jetzt ist das letzte, was wir tun müssen, die Maus über Buchstaben tatsächlich mit etwas CSS animieren zu lassen . Moment können wir die Klasse namens letter verwenden, und wenn wir darüber bewegen, gibt es auch eine Klasse dort namens Active, so dass wir beide zusammen verwenden können. Also werde ich das loswerden, weil das nicht mehr benötigt wird. Und lasst uns zuerst ein paar CSS schreiben. Ich werde etwas von der Leiche ändern wollen. Ich möchte die Hintergrundfarbe so ändern, dass es nicht nur ein gerades Weiß ist. Lass es uns weiß machen. Dann lasst uns die Zeilenmitte texten, weil ich möchte, dass der gesamte Text auf der Seite zentriert wird. Als Nächstes. Lassen Sie uns fortfahren und wählen Sie Buchstaben und lassen Sie uns jedem Buchstaben ein Standard-Styling hinzufügen. Nehmen wir an, die Schriftgröße, die es ziemlich groß sein wird, würde 90 Pixel sparen. Die Familie Forint. Ich habe hier schon eine benutzerdefinierte Front geladen, und es ist Pazifik. , Sagen wir,die Schriftfamilie wird Pazifik sein. Oh, oder kursiv. Wenn es nicht von Google geladen wird, wird nur etwas Fluch der Anzeige in Linienblöcken laden, die wir einige dieser Animationen richtig funktionieren lassen könnten . Lassen Sie uns die Farbe ändern, zu 999 Refresh. Okay, okay. Es kommt jetzt schön vorbei. Wir müssen eine aktive Klasse hinzufügen, also Punkt Buchstabe Punkt aktiv. Und lasst uns einfach diese Transformationsskala verwandeln 1.5 machen den Buchstaben nur 50% größer. Und das ist auch gedreht, denke ich, Drehen Sie 20 Grad. Nun, lasst uns die Farbe in etwas wie Grün ändern. Oh, sieh dir an, dass es da ist. Okay, das sieht also ein wenig abgehackt aus, aber wir könnten uns ziemlich leicht mit etwas CSS reparieren. Lassen Sie uns voran und fügen Sie eine trans ish im Übergang hinzu. Wir werden alles sagen, weil ich hier ein bisschen faul sein werde. Sagen Sie, alle werden 250 Millisekunden brauchen, um sich ein- und auszuschalten. Er ist rein und raus. Aktualisieren Sie unsere Seite. ich. Sehen Sie sich das endgültige Projekt abgeschlossen an. Werfen wir einen kurzen Blick auf das, was ich getan habe. Wieder einmal habe ich das h geschnappt. Das ist dieser Kerl hier, packte alle Buchstaben darin, und dann habe ich es auf absolut nichts aufgespalten. Also habe ich jeden Buchstaben hier in ein Array zerbrochen. Ich sagte dann für jeden einzelnen Buchstaben in diesem Array, lasst uns durch ihn schleifen und lasst uns einen Stift, einige HTML Zehe eine Zeichenfolge. Jetzt hätten wir ein Array verwenden können und auch Dot Joint verwenden können. Das ist eine andere Art, es zu tun. Ich habe gerade eine normale Saite benutzt. Wir verwenden hier ein Template-Literal mit ein paar Variablen, die unsere Cap Nation schön und glatt aussehen lassen. Dann sagte ich, Hey, wenn du fertig bist, diese Änderung, dass jeder innere HTML-Zehe ist, was auch immer aus der Schleife herauskam. Und dann sagte ich: OK, OK, nun, denn da ist dieser Js-Brief für jeden einzelnen Buchstaben drin. Gehen wir weiter, schnappen wir uns all die an. Dann lasst uns jede einzelne durchlaufen und da drin haben wir jede Note. Jedes einzelne Element, das Js-Buchstaben als Klasse hat, ist seine eigene Note. Und so hat dieser Knoten jetzt einen Ereignis-Listener für die Maus über. Und wenn wir die Maus über die Klasse der aktiven und es gibt einen anderen Ereignis-Listener. Also, wenn wir unseren Mund herausnehmen, entfernt es die Klasse der aktiven. Schließlich habe ich es mit etwas CSS hübsch aussehen lassen. Also nur wenig Körper Hintergrund Styling gibt. Der Buchstabe selbst hat eine größere Schriftgröße Ah, Benutzerdefinierte Punktfamilie Anzeige im Linienblock, weil wir eine Spanne verwenden. Also müssen wir das in der Reihenfolge verwenden. Teoh verwenden richtig transformieren, ändern Sie die Telefonfarbe, die Standardschriftfarbe und gab ihm einen Übergang. Es wird also 0,25 Sekunden dauern, um in und aus seiner Animation zu wechseln, und seine Animation kommt aus seinem aktiven Zustand. Also, wenn der Buchstabe, wann immer es ein Element gibt, das die Klasse des Buchstabens hat und es auch eine Klasse von aktiv gleichen Zeit hat, zurgleichen Zeit hat,werden wir es transformieren, um 50% größer, 20 Grad gedreht und die Schriftfarbe grün, fertig und fertig. Schließlich überprüfen wir unseren Rat. Wir stellen sicher, dass es keine Protokolle mehr gibt, also sind wir nicht konsul Logging etwas, weil das nicht notwendig ist. Und auch gibt es keine Warnungen. Es gibt keine Fehler. Es gibt keine Info oder Debug. Alles sieht gesund und glücklich aus. Wir haben unser endgültiges Projekt gemeinsam abgeschlossen, und das ist meine Meinung zu der Lösung. Es gibt wieder mehrere verschiedene Möglichkeiten, dies zu tun, aber das ist mit einer Menge der größeren Stücke von Javascript, die wir gelernt haben Hals diesen Kurs und schließlich für alle, die Sie Fähigkeiten teilen Entwickler da draußen? Ich würde wirklich gerne, wenn Sie Ihren Code teilen könnten, einen Screenshot davon machen und ihn in ein Skill-Share-Projekt einfügen könnten. Es wird toll für mich sein, die Art von Fortschritt zu sehen, die Sie machen, aber ich kann Ihnen auch mit Tipps und Feedback im Support helfen. Vergessen Sie also nicht, Ihr JavaScript-Projekt zu aktualisieren und dann werde ich es mir ansehen. 59. JavaScript: Alles klar. Du hast es geschafft. Du hast den ganzen Weg durch diesen Kurs geschafft. Das ist eine wirklich große Sache. Stellen Sie sicher, dass Sie sich selbst gratulieren. Kaufen Sie sich etwas Nettes. Kaufen Sie sich ein nettes Essen. Tun Sie etwas, um sich wirklich zu belohnen, weil Sie über 50 Videos von JavaScript und, ah, es lohnt sich, sich zu belohnen. Jetzt. Wir haben viel JavaScript gelernt, aber ehrlich ist dies nur eine Einführung in JavaScript. Es gibt eine viel größere JavaScript-Welt da draußen, einschließlich Dinge wie Node Package Manager NPM oder Frameworks wie React und View Dot Js oder Bibliotheken wie Slick Dodge. Wie zum Erstellen von erstaunlichen Pflegezellen oder J Query für das Erstellen und Schreiben von JavaScript , das abwärtskompatibel ist. Sie müssen sich also keine Gedanken darüber machen, dass JavaScript nicht in älteren Browsern funktioniert. Es gibt auch viele Tools, die Sie mit installieren können, wie Knoten, wie Knoten, Paketmanager und node.js. Und es kann Ihr Javascript in das kompilieren, was ich Dummy JavaScript nenne, wo Sie im Grunde, richtig schickes modernes JavaScript, und es kompiliert es in eine andere Datei, die ältere Browser, wie Internet Explorer 11 verstehen. Also, wenn Sie die Welt von Javascript lieben und Sie immer tiefer und tiefer in sie. Ihre nächste Wette besteht wahrscheinlich darin, weiterhin JavaScript zu lernen. Also, wenn Sie daran interessiert waren, Javascript fortzusetzen und ein wirklich, wirklich starker, leistungsstarker JavaScript-Jet zu werden, dann werden Sie wahrscheinlich beginnen, einige der fortgeschrittenen Dinge zu lernen in die echten düsteren Details all dieser verschiedenen Dinge, die wir gelernt haben, all die verschiedenen Methoden, die Sie verwenden können, wie Strings und Arrays und solche Dinge. All die verschiedenen Ereignis-Listener, richtig, mehr Klassen, Dinge wie das. Und dann werden Sie wahrscheinlich in einen Notiz-Paketmanager springen wollen, damit Sie den Code anderer Leute in Ihren Projekten verwenden können und dann vielleicht anfangen, einige Reaktoransicht Dot Js zu lernen und Sie haben Ihr Ziel war, Javascript zu lernen, damit Sie eine Front sein könnten und Webentwickler . Nun, Sie haben jetzt genug Fähigkeiten, die Sie tatsächlich gehen und bewerben können, um ein Front- und Webentwickler zu sein . Wissen Sie, eine Menge JavaScript direkt aus dem Kasten. Und das ist ein sehr starker Vorsprung. Noch einmal, herzlichen Glückwunsch zum Abschluss dieses gesamten Kurses. - Ja. Bitte stellen Sie sicher, dass Sie sich selbst belohnen. Es ist wirklich wichtig für Sie, sich für all die harte Arbeit zu belohnen, die Sie geleistet haben. Mein Name ist Caleb und sagt, dass du mich überall im Internet finden kannst. Aber noch wichtiger ist, wenn Sie Fragen, Kommentare, Bedenken oder Feedback haben Kommentare, , können Sie sie immer im Kommentarbereich unten hinterlassen. Ich lese alles, was hereinkommt, und ich versuche, alle rechtzeitig zu beantworten. Also, nochmals, vielen Dank, dass Sie diesen Kurs besucht haben. Ich hoffe, du hast viel gelernt. Ich hoffe, Sie hatten eine gute Zeit, etwas JavaScript zu lernen. Du hast gute Erfahrungen gemacht, und schließlich würde ich mich freuen, dich in der Welt zu sehen. Also vergessen Sie nicht, Sie können der Facebook-Gruppe beitreten, die Lerngruppe Facebook Code. Sie können immer einfach Kommentare oder Fragen unten lassen Sie niedrig. Ich lese alles, was rein kommt und versuche, so hilfsbereit wie möglich zu sein. Und ich hoffe, du hattest eine gute Zeit in diesem Kurs.