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

Konwersja typów w JavaScript

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
1
Zadanie
Frontend SELF PL,  poziom 35lekcja 0
Niedostępne
Konwersja ciągu tekstowego
Konwersja ciągu tekstowego
1
Zadanie
Frontend SELF PL,  poziom 35lekcja 0
Niedostępne
Niejawne dodawanie
Niejawne dodawanie
Komentarze
  • Popularne
  • Najnowsze
  • Najstarsze
Musisz się zalogować, aby dodać komentarz
Ta strona nie ma jeszcze żadnych komentarzy