CodeGym /Kursy /Frontend SELF PL /Konwersja typów w JavaScript

Konwersja typów w JavaScript

Frontend SELF PL
Poziom 35 , Lekcja 0
Dostępny

1.1 Jawna konwersja typów

Konwersja typów w JavaScript to proces przekształcania wartości z jednego typu danych na inny. Istnieją dwa rodzaje konwersji: jawne (ręczne) i niejawne (automatyczne). Zrozumienie tych procesów jest ważne, aby uniknąć błędów i tworzyć przewidywalny kod.

Jawna konwersja, znana również jako ręczna konwersja, wykonywana jest za pomocą wbudowanych funkcji i metod JavaScript. To konwersja, w której programista jawnie określa, jaki typ danych ma być przekształcony w inny typ.

Główne metody jawnej konwersji:

1. Konwersja na ciąg

  • Metoda String(value): przekształca wartość w ciąg
JavaScript
    
      let num = 123;
      let str = String(num);
      console.log(typeof str); // "string"
    
  

  • value.toString(): metoda obiektu, która przekształca wartość w ciąg
JavaScript
    
      let bool = true;
      let str = bool.toString();
      console.log(typeof str); // "string"
    
  

2. Konwersja na liczbę

  • Number(value): przekształca wartość w liczbę
JavaScript
    
      let str = "456";
      let num = Number(str);
      console.log(typeof num); // "number"
    
  

  • parseInt(value, base): przekształca ciąg w liczbę całkowitą. Parametr base wskazuje podstawę systemu liczbowego
JavaScript
    
      let str = "123";
      let num = parseInt(str, 10);
      console.log(typeof num); // "number"
    
  

  • parseFloat(value): przekształca ciąg w liczbę zmiennoprzecinkową
JavaScript
    
      let str = "123.45";
      let num = parseFloat(str);
      console.log(typeof num); // "number"
    
  

3. Konwersja na wartość logiczną

  • Boolean(value): przekształca wartość w boolean
JavaScript
    
      let str = "";
      let bool = Boolean(str);
      console.log(typeof bool); // "boolean"
    
  

1.2 Niejawna konwersja typów

Niejawna konwersja, znana również jako automatyczna lub ukryta konwersja, jest wykonywana automatycznie przez JavaScript podczas wykonywania operacji na różnych typach danych. Niejawna konwersja może prowadzić do nieoczekiwanych wyników, dlatego należy ją zrozumieć i ostrożnie stosować.

1. Konwersja na ciąg

Ważne!

Podczas dodawania dowolnego obiektu do ciągu JavaScript spróbuje przekształcić go w ciąg.

Przykład:

JavaScript
    
      let result = "The number is " + 123;
      console.log(result); // "The number is 123"
    
  

2. Konwersja na liczbę

Ważne!

Podczas używania dowolnych operatorów arytmetycznych (poza +) ze stringami zawierającymi liczby.

JavaScript
    
      let result = "123" - 0;
      console.log(result); // 123 (liczba)
    
  

Jak to działa w praktyce:

JavaScript
    
      let result = "123" - 10;
      console.log(result); // 113 (liczba)

      let result2 = "123" + 10;
      console.log(result2); // 12310 (string)
    
  

3. Konwersja na wartość logiczną

Podczas używania wartości w kontekstach logicznych (instrukcje warunkowe, pętle itp.).

JavaScript
    
      let value = "hello";

      if (value) {
        console.log("Value is truthy");   // Wyjście: "Value is truthy"
      }
    
  

Przykłady konwersji w kontekście logicznym:

  • false, 0, "" (pusty string), null, undefined, i NaN są uważane za fałszywe (false) wartości
  • Wszystkie inne wartości są uważane za prawdziwe (true)
JavaScript
    
      if ("") {
        console.log("This won't be logged.");
      } else {
        console.log('"" is considered false in a boolean context.');
      }

      // '"" is considered false in a boolean context.'
    
  

1.3 Przykłady niejawnej konwersji

Przykład z operacjami arytmetycznymi:

JavaScript
    
      let width = "100";
      let height = "200";

      let area = Number(width) * Number(height); // Jawna konwersja
      console.log(area); // 20000

      let perimeter = (+width) + (+height); // Użycie unarnego plusa do jawnej konwersji
      console.log(perimeter); // 300
    
  

Przykład z kontekstem logicznym:

JavaScript
    
      let userInput = ""; // Pusty string

      if (!userInput) {
        console.log("Użytkownik nie wprowadził danych."); // Niejawna konwersja stringa na boolean
      }
    
  

Przykład z łączonymi typami:

JavaScript
    
      let value = "10";
      let increment = 5;

      let result = value + increment; // Niejawna konwersja liczby na string
      console.log(result); // "105"

      result = Number(value) + increment; // Jawna konwersja stringa na liczbę
      console.log(result); // 15
    
  
Komentarze
TO VIEW ALL COMMENTS OR TO MAKE A COMMENT,
GO TO FULL VERSION