4 przydatne instrukcje JavaScript, które powinieneś wiedzieć

Instrukcje JavaScript dają nam moc implementuj różne typy logiki w naszym kodzie. JavaScript udostępnia nam kilka z nich, z których każdy ma własne przeznaczenie i składnię. Wśród najbardziej znanych przykładów możemy znaleźć wyrażenia wyrażenia, instrukcje iteracyjne, instrukcje warunkowe i inne

W dzisiejszym poście zobaczymy cztery mniej popularne instrukcje JavaScript być może wcześniej nie wiedziałeś, ale możesz pogłębić swoją wiedzę na temat JavaScript i umożliwić Ci pisanie lepszego kodu.

1. Pusta instrukcja

W miejsce dowolnej instrukcji JavaScript możesz dodać pustą instrukcję, która jest zapisana jako pojedynczy średnik ;. Gdy interpreter JavaScript interpretuje pustą instrukcję, żaden kod nie jest wykonywany, dlatego mogą być przydatne zastąp podwyrażenia, których nie chcesz wykonywać.

Załóżmy na przykład, że istnieje zmienna o nazwie lakmus z wartością domyślną neutralny. Na podstawie wartości innej zmiennej o nazwie pH, lakmus zmienia się na jeden kwaśny kiedy pH < 7 or podstawowy gdy pH> 7.

Jeśli wartość pH okazuje się być nieprawidłowy, zgłaszany jest błąd. Dla stan w ten sposób obowiązują następujące instrukcje warunkowe:

 var litmus = „neutralny”; var pH; jeśli (pH> 0 && pH<7) litmus = 'acidic'; else if(pH>7 && pH<15) litmus = 'basic'; else throw "Invalid pH value"; 

Jednak powyższy zestaw instrukcji powoduje błąd, gdy pHWartość wynosi 7, co nie powinno mieć miejsca.

Gdy pH jest 7, lakmus powinien zachować domyślną wartość neutralny. Tak więc w przypadku takim jak ten dodaj warunek, kiedy pH jest 7 z końcowym pustym wyrażeniem.

 var litmus = „neutralny”; var pH; jeśli (pH> 0 && pH<7) litmus = 'acidic'; else if(pH===7) ; /* empty statement */ else if(pH>7 && pH<15) litmus = 'basic'; else throw "Invalid pH value";

Teraz, kiedy pH wynosi 7, interpreter nie wykonuje żadnych instrukcji i lakmus zachowuje domyślną wartość, neutralny.

Puste instrukcje mogą być również używane do wypełnienia tablicy za pomocą dla pętla.

 var ary = []; for (var i = 0; i < 5; ary[i++] = i) ; /* empty statement */ console.log(ary); // [1, 2, 3, 4, 5]

Zazwyczaj a dla po instrukcji pętli następuje instrukcja podrzędna składająca się z pojedynczej lub instrukcji blokowej (tej zawartej w nawiasy klamrowe) do wykonania. Używając pustej instrukcji zamiast instrukcji podrzędnej, interpreter nie będzie miał nic do wykonania po każdej pętli, więc tylko zapętlanie występuje, a warunki pętli zostają wykonane.

W powyższym przykładzie, ary [i ++] = i wykonuje dla każdej iteracji pętli jako część warunku pętli i tablicy ary pobiera instancję z wartościami ja.

2. The debugger Komunikat

W narzędziach do debugowania możemy dodaj znaczniki nazywa punkty przerwania do dowolnej linii kodu źródłowego do zaznacz linie, z których narzędzie debugera rozpocznie debugowanie.

W JavaScript, debugger komunikat działa tak samo jak punkt przerwania, poza tym, że to jest bezpośrednio do kodu źródłowego, zamiast w narzędziu. Dowolny działający debugger będzie zatrzymać wykonywanie skryptu kiedy osiągnie debugger oświadczenie w celu ułatwienia debugowania kodu.

Pamiętaj, że debugowanie zostanie uruchomione tylko wtedy, gdy skrypt działa w trybie debugowania, tj. program do debugowania działa już nad wykonaniem skryptu. Jeśli nie ma aktualnie uruchomionego programu debuggera podczas interpretacji debugger oświadczenie, tłumacz będzie kontynuował swoją pracę tak, jakby nic się nie stało.

Jako szybki test uruchom następujący kod w Codepen, zachowując otwarte narzędzie debugera przeglądarki:

 console.log ('tesing'); debugger; console.log („instrukcja debugowania”);

Zobaczysz punkt przerwania oprócz debugger instrukcja jak pokazano poniżej w narzędziu debugera przeglądarki.

3. Oznaczone oświadczenie

W JavaScript możesz dodawać etykiety również do niektórych instrukcji. W ten sposób możesz później przeskocz do oznaczonej instrukcji używając swojej etykiety w kodzie, rodzaj jak iść do oświadczenie działa w innych językach.

Oznaczone instrukcje mogą być używane tylko razem z złamać i dalej instrukcje, ponieważ w JavaScript nie ma dosłownego iść do komunikat.

Obie złamać i dalej może być używany tylko w instrukcjach pętli, takich jak dla pętla (z jednym wyjątkiem, złamać może być używany w przełącznik oświadczenie). Możemy więc oznaczyć pętle i użyć złamać i dalej kontrolować ich wykonanie.

The składnia etykietowanych instrukcji jest prosty, wystarczy dodać nazwę etykiety z następującym dwukropkiem, co widać w poniższym przykładzie, gdzie pętla to nazwa etykiety, którą dodajemy do dla pętla.

 loop: for (var i = 0; i<5; i++) if(i===2) continue loop; console.log(i); // 0, 1, 3, 4 

Kiedy wartość ja jest 2, wykonanie przeskakuje z powrotem do pętli zamiast kontynuować i tym samym zapobiega wyjściu konsoli “2”.

Teraz zobaczmy inny przykład z złamać komunikat. Wystarczy wymienić dalej słowo kluczowe z złamać w powyższym przykładzie zauważysz, że zamiast skakać z powrotem do pętli, tak jak w przypadku dalej, pętla kończy się / pęka całkowicie.

 loop: for (var i = 0; i<5; i++) if(i===2) break loop; console.log(i); // 0, 1 

Powyższe przykłady były dość proste, dzięki czemu można szybko zrozumieć, jak działają instrukcje oznaczone, ale w kodowaniu rzeczywistym etykiety są częściej używane w pętlach złożonych, gdy konieczne jest rozróżnienie różnych pętli, jak w poniższym przykładzie:

 loop: for (var i = 0; i<4; i++)  for(var j=0; j<2; j++)  if(i===2 && j===1) break loop; console.log(i+"-"+j); 

Tutaj zewnętrzna pętla przerwy przy wartości 2 dla zmiennej ja i na 1 za jot, konsola zwraca następujące dane wyjściowe:

 0-0 0-1 1-0 1-1 2-0

4. The z Komunikat

Kiedy tłumacz JS natrafia na niekwalifikowaną nazwę to nie określa, z którym obiektem lub funkcją jest związane połączenie przeszukuje łańcuch zasięgu dla dowolnego odpowiedniego obiektu lub funkcji, do której może dzwonić połączenie.

Używając z oświadczenie, możemy dodaj obiekt do góry łańcucha zasięgu, i określ obiekt, z którym połączenie jest powiązane.

W poniższym przykładzie widać, że właściwości osoba obiekt jest wywoływany za pomocą samych nazw wewnątrz z komunikat.

 var person = firstName: "John", lastName: "Doe", wiek: "18", kraj: "Grenlandia"; z (osoba) console.log ("Cześć, mam na imię" + firstName + "" + lastName + ". Jestem" + wiek + "lat i mieszkam w" + kraju + ".");  // "Cześć, nazywam się John Doe. Mam 18 lat i mieszkam w Grenlandii."

Porównaj, jak wyglądałby powyższy kod bez użycia z komunikat:

 var person = firstName: "John", lastName: "Doe", wiek: "18", kraj: "Grenlandia"; console.log („Cześć, mam na imię„ + person.firstName + ”” + person.lastName + ”. Jestem„ + person.age + ”lat i mieszkam w„ + person.country + ”.” ); // "Cześć, nazywam się John Doe. Mam 18 lat i mieszkam w Grenlandii."

Możesz zobaczyć z instrukcja może być świetnym skrótem, jeśli pracujesz z wieloma właściwościami tego samego obiektu.

Należy jednak pamiętać, że używanie z komunikat w trybie ścisłym jest niedozwolone, ponieważ może to spowodować zamieszanie w pewnym zakresie.

Zaleca się także używanie z instrukcja, jeśli jej wewnętrzne instrukcje używają obiektu skojarzonego z z oświadczenie, w przeciwnym razie tłumacz będzie tracił czas, patrząc na obiekt, o którym wspomina z po pierwsze, dla wszystkich niekwalifikowanych nazw właściwości, które później znajdują się wewnątrz z blok.