JavaScript był przeznaczony do pisania krótkich, kilkuliniowych fragmentów kodu, które miały być osadzone na stronach internetowych. Nikt nie mógł przewidzieć, że JavaScript stanie się tak popularny jak obecnie i będzie używany do pisania aplikacji składających się z tysięcy linii kodu.
Mimo że JavaScript rozwinął się i jest obecnie szeroko stosowany w tworzeniu aplikacji, nie jest to język doskonały. Jego skromne początki i początkowe przeznaczenie oznaczają, że JavaScript ma pewne dziwactwa, które mogą sprawić, że tworzenie aplikacji na dużą skalę stanie się koszmarem.
Na przykład JavaScript nie zgłosi błędu, gdy odwołujesz się do elementów, które nie istnieją w obiekcie lub gdy mnożysz wartość null przez wartość liczbową.
W JavaScript pusty ciąg („”) jest równy 0 (zero), gdy oba są porównywane za pomocą operatora równości (==). Co gorsza, JavaScript nie pokaże takich błędów w kodzie w fazie rozwoju. Błędy zobaczysz dopiero po uruchomieniu programu.
Maszynopis, zbudowany na bazie JavaScript, został zatem opracowany, aby złagodzić wyzwania pojawiające się podczas tworzenia aplikacji za pomocą JavaScript. Aby to osiągnąć, TypeScript przeprowadza statyczne sprawdzanie typu podczas pisania kodu.
Sprawdzanie statyczne oznacza wykrywanie błędów w kodzie bez konieczności uruchamiania kodu. Statyczne sprawdzanie typu polega zatem na sprawdzaniu błędów podczas programowania w oparciu o typ wartości obsługiwanych w kodzie.
TypeScript to typowany nadzbiór JavaScript. Bycie nadzbiórem JavaScript oznacza, że każdy prawidłowy kod JavaScript jest również prawidłowym TypeScriptem. Pisanie oznacza, że TypeScript dodaje reguły dotyczące sposobu użycia różnych typów danych. TypeScript jest również mocno typowany i nie można obejść ograniczeń narzuconych przez system typów.
TypeScript to kamień milowy i znaczący postęp w tworzeniu stron internetowych. TypeScript umożliwia pisanie bardziej czytelnego kodu, który jest łatwy w utrzymaniu. Egzekwuje także dobre praktyki kodowania i pomaga programistom wychwytywać i unikać błędów podczas pisania kodu.
TypeScript jest bardziej niezawodny i łatwy do refaktoryzacji, co czyni go idealnym do tworzenia aplikacji na dużą skalę w porównaniu do JavaScript. Ponieważ TypeScript jest silnie typowany, przyjrzyjmy się konwersji typów, jej znaczeniu i sposobowi, w jaki TypeScript obsługuje konwersje typów.
Spis treści:
Konwersja typów w TypeScript i jej znaczenie
Konwersja typów to proces konwersji wartości z jednego typu danych na inny, na przykład konwersja wartości ciągu znaków na liczbę. Konwersję typów można przeprowadzić niejawnie, gdy kompilator automatycznie konwertuje kompatybilne typy danych w przypadku komplikacji.
Konwersja typu może być również jawna, gdy konwersja typu jest wyraźnie wymagana w kodzie źródłowym. Często nazywa się to typecastingiem.
Konwersja typów jest ważna, ponieważ pozwala programistom pracować z różnymi formatami danych, zachowując jednocześnie zgodność z oczekiwanymi typami danych w TypeScript. Pomaga także zapewnić przewidywalne wyniki na podstawie kodów źródłowych.
Jako programista możesz samodzielnie rzutować typy, aby mieć pewność, że Twój kod nadal spełnia wymagania TypeScript dotyczące typów. Sprawia, że Twój kod jest bardziej czytelny i zrozumiały oraz pomaga zapobiegać błędom związanym z typem.
Konwersje typów pomagają również w sprawdzaniu poprawności danych i pomagają TypeScriptowi w programowaniu, udostępniając wszystkie wbudowane narzędzia, takie jak autouzupełnianie, które są powiązane z określonymi typami.
Typowym przypadkiem użycia konwersji typów są ciągi i liczby. Podczas konwersji ciągów znaków na liczby w TypeScript, aby uniknąć błędów w kodzie, konwertuje tylko ciągi numeryczne na liczby. Oznacza to, że możesz konwertować ciągi takie jak „1”, „235”, „5234,5” i tak dalej. Nie należy jednak konwertować ciągów znaków takich jak „cześć” na liczbę
Przyjrzyjmy się różnym sposobom konwersji ciągów znaków na liczby w TypeScript:
Wpisz asercję, używając „as”
Podczas pracy z różnymi typami danych w kodzie TypeScript czasami będziesz mieć więcej informacji na temat typu wartości, o których TypeScript nie może wiedzieć. W takich przypadkach informujesz TypeScript, jaki będzie typ zmiennej i nie pozwalasz kompilatorowi na wywnioskowanie typu. Nazywa się to asercją typu.
Asercja typu odbywa się za pomocą słowa kluczowego as. Aby użyć asercji typu do konwersji ciągu na liczbę, najpierw ustaw typ ciągu na nieznany. Dzieje się tak dlatego, że domyślnie TypeScript uważa każdą konwersję ciągu typu na liczbę za potencjalnie pomyłkę. Dzieje się tak, ponieważ ani ciąg znaków, ani liczba nie nakładają się na siebie w wystarczającym stopniu. Aby przekonwertować ciąg na liczbę, wykonaj poniższe czynności:
/** * set the type of numString to be unkown, otherwise, * Typescript will infer numString to be a string value */ let numString: unknown = "23452"; // Type conversion using as - numString is converted to a number // and assigned to the variable score let score = numString as number; console.log(score); console.log(score * 35);
Wyjście:
23452 820820
Na podstawie wyników zauważ, że zmienna numString została przekonwertowana na liczbę i przypisana do wyniku. Następnie możemy wykonać obliczenia numeryczne, takie jak mnożenie przez wynik, ponieważ jego wartość jest liczbą
Wpisz asercję za pomocą <>
Asercji typu za pomocą <> można również użyć do konwersji ciągu znaków na liczbę. Działa dokładnie tak samo, jak użycie słowa kluczowego as. Jedyną różnicą w implementacji jest składnia, którą pokazano poniżej:
let numString: unknown = "23452"; // Type assertion using <> to convert a string to a number let score = <number>numString; console.log(score); console.log(score * 35);
Wyjście:
23452 820820
Dane wyjściowe są takie same, jak przy użyciu słowa kluczowego as. Ponownie pamiętaj, aby nie używać asercji typu do konwertowania ciągów, które nie zawierają wartości liczbowych.
Korzystanie z konstruktora liczb
Aby przekonwertować ciąg na liczbę za pomocą konstruktora Number, wprowadź ciąg, który chcesz przekonwertować na konstruktor Number, jak pokazano we fragmencie kodu poniżej:
let numString = "23452"; // type inferred to string let lives: string = "20"; // type annotated to string // pass in string to Number constructor to convert to number let score = Number(numString) console.log(score / 17) // pass in string to Number constructor to convert to number let remainingLives = Number(lives); console.log(remainingLives - 4)
Wyjście:
1379.5294117647059 16
Korzystając z konstruktora Number, nie trzeba ustawiać typu ciągu na nieznany. Działa z wartościami ciągów, które zostały opatrzone adnotacjami lub wywnioskowane do ciągu. Pamiętaj jednak o przekazaniu ciągów liczbowych, takich jak „514”. Jeśli przekażesz ciąg, którego nie można przekonwertować na liczbę, zwrócony zostanie NaN (Not-a-Number).
Korzystanie z operatora jednoargumentowego plus (+).
Operator jednoargumentowy plus (+), który poprzedza jego pojedynczy operand, obliczany jest na operand, który poprzedza. Na przykład +2 daje liczbę 2, +542 daje liczbę 542 i tak dalej. Jeśli jednak operand nie jest liczbą, operator jednoargumentowy plus (+) próbuje przekonwertować go na liczbę.
Na przykład +”98″ da wartość 98, a +”0″ da liczbę 0. Dlatego możemy użyć operatora jednoargumentowego plus (+) do konwersji ciągów na liczby. Jeśli przekażesz ciąg, którego nie można przekonwertować na liczbę, zwracane jest NaN, jak pokazano poniżej:
let numString1 = "23452";
let numString2 = "973.82"
let word = "hello"
// Using the Unary plus (+) to convert strings to numbers
let num1 = +numString1;
let num2 = +numString2;
let notNumber = +word;
console.log(`${num1} is a ${typeof num1}`);
console.log(`${num2} is a ${typeof num2}`);
console.log(notNumber);
Wyjście:
23452 is a number 973.82 is a number NaN
Użycie operatora jednoargumentowego plus (+) to dobry sposób na konwersję ciągów znaków na liczby, ponieważ jest szybki i nie wykonuje żadnych dodatkowych operacji na operandach.
Korzystanie z parseInt() i parseFloat()
Podobnie jak w JavaScript, TypeScript nie rozróżnia liczb całkowitych od liczb dziesiętnych, znanych również jako liczby zmiennoprzecinkowe. Wszystkie są uważane za numer typu. To powiedziawszy, zachowania parseInt() i parseFloat() różnią się nieco.
parseInt() pobiera argument w postaci ciągu znaków, analizuje go i zwraca liczbę całkowitą odpowiadającą określonej podstawie. parseFloat() pobiera ciąg znaków i analizuje go, zwracając liczbę zmiennoprzecinkową.
Na przykład, jeśli przekażesz „897” zarówno do parseInt(), jak i parseFloat(), otrzymasz liczbę 897. Jeśli jednak przekażesz 897.75 zarówno do parseInt(), jak i parseFloat(), parseInt() zwróć 897, podczas gdy parsefloat() zwróci 897,75.
Dlatego podczas konwertowania ciągów liczbowych, które nie mają miejsca dziesiętnego, użyj parseInt(), jednak jeśli ciąg liczbowy ma miejsca dziesiętne, użyj parseFloat() jak pokazano w poniższym kodzie:
let numString1 = "897.75";
let numString2 = "724";
let word = "hello";
console.log("Parsing numerical strings with decimal numbers")
console.log(`Using parseInt -> ${parseInt(numString1)}`);
console.log(`Using parseFloat -> ${parseFloat(numString1)}`);
console.log("Parsing numerical strings with whole numbers")
console.log(`Using parseInt -> ${parseInt(numString2)}`);
console.log(`Using parseFloat -> ${parseFloat(numString2)}`);
console.log("Parsing strings that can't convert to number")
console.log(parseInt(word));
console.log(parseFloat(word));
Wyjście:
Parsing numerical strings with decimal numbers Using parseInt -> 897 Using parseFloat -> 897.75 Parsing numerical strings with whole numbers Using parseInt -> 724 Using parseFloat -> 724 Parsing strings that can't convert to number NaN NaN
Wniosek
Podczas pracy z wartościami łańcuchowymi, na przykład wynikami wywołań API, warto przekonwertować je na liczby, aby móc na nich wykonywać obliczenia numeryczne. Gdy zajdzie taka potrzeba, rozważ omówione w artykule metody konwersji ciągów znaków na liczby.
Jednak za każdym razem, gdy konwertujesz ciągi znaków na liczby, zachowaj ostrożność, ponieważ podczas próby konwersji ciągu znaków na liczbę możesz otrzymać NaN.
Aby uniknąć takiego błędu, upewnij się, że wszystkie ciągi, które chcesz przekonwertować na liczbę, są ciągami numerycznymi. Możesz także użyć instrukcji if, aby sprawdzić NaN, aby uniknąć błędów w kodzie.
Możesz także poznać najlepsze biblioteki TypeScript i środowisko wykonawcze, aby poznać je jako programista.