Pokud jste nedávno sledovali vydání TypeScript, už víte, že v TypeScript 3.7 bylo zavedeno volitelné řetězení a nulové slučování. Obě jsou součástí připravovaných funkcí JavaScriptu a v době vydání tohoto článku jsou ve fázi 4 a fázi 3.
AKTUALIZOVÁNO:Od Babel 7.8.0 Tyto funkce jsou také zahrnuty ve výchozím nastavení.
Volitelné řetězení
Poměrně často se přistihneme, že pracujeme hluboko do objektu, abychom získali hodnotu vlastnosti, a pokud jste napsali více než 100 řádků kódu v JavaScriptu, víte, že toto je kořen velmi časté chyby Uncaught TypeError když není provedeno správně
Tuto falešnou odpověď použijeme pro zbytek příkladů:
Abychom se vyhnuli běžnému Uncaught TypeError a získejte hodnotu id z výše uvedené odpovědi si musíme zatančit v JavaScriptu. Dnes k tomu přistupujeme tak, že kontrolujeme pravdivost objektu v každé hloubce, zatímco se dostáváme k id . Tento vzor vypadá spíše jako podmíněný příkaz, jehož výsledkem by měl být booleovský, nikoli příkaz přístupového objektu vlastnosti, ale je to nejčistší a nejbezpečnější nativní způsob, jaký dnes máme.
Nebo pokud dáváte přednost destrukci objektu:
V podstatě to, co se zde děje, je blok kódu na levé straně && Logika a operátor se vyhodnocují podobně jako Boolean(data) a pokud je hodnota true pohybuje se, aby vyhodnotil pravou stranu.
Pokud používáte Lodash nebo Ember, existují ergonomičtější způsoby, jak toho dosáhnout
Jak tedy uděláme totéž pomocí nového volitelného řetězení?
Nulové sloučení
Je běžnou praxí mít výchozí hodnotu, když je hodnota vlastnosti, ke které přistupujeme, null nebo undefined . V současné době je běžný způsob, jak toho dosáhnout, pomocí || Logický nebo operátor
Pokud chceme získat uživatelské jméno Github, které je login vlastnost a jako výchozí nastavte uživatelské jméno aktuálního uživatele, sedighian v tomto případě to uděláme následovně:
druhý a třetí příklad vypadají velmi podobně, tak proč je Null Coalescing užitečné? Jednoduše řečeno Null Coalescing vyhodnocuje pravou stranu ?? operátor pouze v případě, že výsledek levé strany je undefined nebo null a to nám poskytuje určitou ochranu proti nezamýšleným výsledkům při práci s platnými, ale falešnými hodnotami v našich datech.
V mnoha případech si například přejeme prázdný řetězec '' , false a 0 na vrácenou hodnotu, místo aby výsledkem byla falešná hodnota, a proto se přesuneme k vyhodnocení pravé strany || Logický-nebo-operátor. Nyní můžeme použít Null Coalescing a tyto problémy již nebudeme mít, jak je vidět v příkladech níže:
Pro vytvoření záložních/výchozích hodnot při přístupu k objektu existují alternativní způsoby v podobě knihoven třetích stran a v případě Ember vestavěný nástroj.
Nezapomínejte, že Null Coalescing je více než jen vytvoření výchozí hodnoty pro přiřazení proměnné, je to nový alternativní způsob, jak spustit blok kódu s null nebo undefined hodnota. Například:
Na co si dát pozor...
Při použití ? na pořadí záleží ve volitelném řetězení
Volitelné řetězení vás nechrání před nesprávným vyvoláním nefunkce
Null Coalescing není jablko k jablku na lodash.get nebo EmberObject.getWithDefault . Hlavní rozdíl je v tom, jak Null Coalescing zachází s null vs. tyto dva nástroje.
Zdroje
Poznámky k vydání TypeScript 3.7
Poznámky k vydání Babel 7.8.0
Volitelné řetězení pro návrh JavaScriptu
Nulové sloučení pro návrh JavaScriptu
lodash.get
EmberObject.get
EmberObject.getWithDefault