W wpisie o zmiennych i typach danych napisałem że tekst umieszczamy pomiędzy znakami cudzysłowu. Okazuje się jednak że równie dobrze możemy umieści je pomiędzy apostrofami. Wraz z wersja ECMAScript 2016 doszedł równierz zapis wykorzystujący znak tzw. backtick’a ( ` ). Zapisany w nim tekst uwzględnia białe znaki w tym znaki końca linii. Omówimy go szerzej w późniejszej części.
Użyte przeze mnie słowo tekst, nie jest dokładne. Używam go dla uproszczenia i ułatwienia. Zamiast niego powinienem używać określenia ciąg znaków. Typ danych do jakiego należy każdy ciąg znaków to String (z ang. łańcuch).
Konkatenacja
Pierwszą operacją na łańcuchach jest konkatenacja. Brzmi strasznie. Jednak oznacza po prostu łącznie kilku mniejszych ciągów znaków w jeden dłuższy. Operatorem którego użyjemy w javascripcie do wykonania tej operacji, jest symbol +. Oznacza to, że jest on przeciążony. W związku z tym musimy uważać co do siebie dodajemy. Konkatenować możemy łańcuchy i łańcuch z innymi zmiennymi. Jednak użycie plusa między dwiema zmiennymi typu number spowoduje dodanie ich.
<script>
let string1 = "Ala ma"
let string2 = " kota"
let string = string1 + string2
alert(string);
</script>
Niektóre znaki nie mogą być umieszczone w łańcuch. Należą do nich chociażby znaki końca linii. Możemy temu zaradzić na dwa sposoby. Pierwszym z nich jest używanie znaków prawego slasha (\) z występującym po nim odpowiednim znakiem. Najczęściej stosowaną konfiguracją są:
<script>
let string = "Złam linię tutaj \n to już jest w następnej linii.";
let string2 = "Aby użyc \" wewnątrz łańcucha musisz poprzedzić go \\";
alert(string);
alert(string2);
</script>
Nowy sposób zapisu
Teraz przejdźmy do łańcuchów wewnątrz backtick’ów. Przede wszystkim rozróżniają one białe znaki w tym entery, nie trzeba więc stosować znaków typu \n. Po drugie są silniejsze od znaków cudzysłowu, co oznacza, że możemy spokojnie cytować wewnątrz nich, nie martwiąc się o wstawianie prawego ukośnika. Po trzecie pozwalają nam łatwiej dodawać zmienne do wyświetlanego tekstu. Wystarczy do tego użyć konstrukcji ${nazwa zmiennej}. Oto przykłady:
<script>
let string = `Oto jest
złamany tekst`;
let string2 = `Mogę użyc "" bez poprzedzania go \ `
const liczba = 4
let string3 = `Liczba wynosi ${liczba}`;
alert(string);
alert(string2);
alert(string3);
</script>Przydatne metody
Aby zamienić dowolną zmienną na łańcuch możemy użyć metody toString(). Wyjątkiem są jednak obiekty. Tutaj musimy użyć metody JSON.stringify(). Oto implementacja:
<script>
let liczba = 11;
let str = liczba.toString();
let obiekt = {id:1, name:"Obiekt"};
let str_blednie = obiekt.toString();
let str_poprawnie = JSON.stringify(obiekt);
alert(str);
alert(str_blednie);
alert(str_poprawnie);
</script>Jak widać konwersja obiektu metodą toString() zwróci „Object object„. Kolejną operacją jaką możemy zrobić jest podmiana. Użyjemy do tego metody replace(). Przyjmie ona dwa argumenty. Pierwszym z nich jest łańcuch który chcemy zmienić, a drugim na który chcemy zmienić. Oto przykład.
<script>
const str = "Ala ma kota";
let zmieniony = str.replace('kota', 'psa');
alert(zmieniony);
</script>Łańcuch możemy też podzielić. Służy do tego metoda split(). Przyjmuje ona jako parametr tzw. pattern. Następnie dzieli łańcuch zawsze gdy napotka w nim wspomniany pattern. Całość zwraca w postaci uporządkowanej tablicy. Dzięki temu możemy podzielić zdanie na pojedyncze słowa.
<script>
const str = "Ala ma kota";
let tablica = str.split(' ');
alert(tablica[0]);
</script>Na koniec chciałem omówić niezwykle użyteczną metodę includes(). Przyjmuje ona argument w postaci ciągu znaków. Zwraca dwie wartości – prawdę lub fałsz, w zależności czy znajdzie argument wewnątrz przeszukiwanego łańcucha.
<script>
const str = "example@example.com"
let czyPoprawnyMail = str.includes('@');
if(czyPoprawnyMail === true) alert('poprawny');
else alert('niepoprawny')
</script>
