CodeGym /Kurs Javy /Frontend SELF PL /Łańcuchy znaków i metody ich obsługi

Łańcuchy znaków i metody ich obsługi

Frontend SELF PL
Poziom 33 , Lekcja 3
Dostępny

4.1 Wprowadzenie do łańcuchów znaków

Łańcuchy znaków w JavaScript to sekwencje znaków i są jednym z podstawowych typów danych. Łańcuchy można tworzyć używając pojedynczych cudzysłowów ('tekst'), podwójnych cudzysłowów ("tekst"), lub odwrotnych apostrofów (`tekst`).

Przykłady łańcuchów znaków:

JavaScript
    
      let singleQuote = 'Hello, World!';
      let doubleQuote = "Hello, World!";
      let backticks = `Hello, World!`;
    
  

Można wywoływać takie metody na obiekcie łańcucha znaków:

Metoda Opis
length Zwraca długość łańcucha znaków
charAt(index) Zwraca znak znajdujący się na określonej pozycji
toUpperCase() Przekształca łańcuch w wielkie litery
toLowerCase() Przekształca łańcuch w małe litery
indexOf(substring) Zwraca indeks pierwszego wystąpienia podłańcucha lub -1, jeśli nie znaleziono
includes(substring) Sprawdza, czy łańcuch zawiera określony podłańcuch, zwraca true lub false
slice(start, end) Wydobywa część łańcucha i zwraca nowy łańcuch
replace(searchValue, newValue) Zastępuje określony podłańcuch nowym podłańcuchem
split(separator) Dzieli łańcuch na tablicę podłańcuchów, używając określonego separatora
trim() Usuwa spacje z początku i końca łańcucha

4.2 Podstawowe metody pracy z łańcuchami znaków

Przykłady użycia metod

1. Właściwość length

Zwraca długość łańcucha znaków:

JavaScript
    
      let str = 'Hello';
      console.log(str.length); // 5
    
  

2. Metoda charAt(index)

Zwraca znak znajdujący się na określonej pozycji:

JavaScript
    
      let str = 'Hello';
      let result = str.charAt(1);
      console.log(result); // 'e'
    
  

3. Metoda toUpperCase() i toLowerCase()

Przekształcają łańcuch w wielkie lub małe litery:

JavaScript
    
      let str = 'Hello';
      console.log(str.toUpperCase()); // 'HELLO'
      console.log(str.toLowerCase()); // 'hello'
    
  

4. Metoda indexOf(substring)

Zwraca indeks pierwszego wystąpienia podłańcucha lub -1, jeśli podłańcuch nie znaleziony:

JavaScript
    
      let str = 'Hello, world!';
      let result = str.indexOf('world');
      console.log(result); // 7
    
  

5. Metoda includes(substring)

Sprawdza, czy łańcuch zawiera określony podłańcuch, zwraca true lub false:

JavaScript
    
      let str = 'Hello, world!';
      let result = str.includes('world');
      console.log(result); // true
    
  

6. Metoda trim()

Usuwa spacje z początku i końca łańcucha:

JavaScript
    
      let str = '   Hello, world!   ';
      console.log(str.trim()); // 'Hello, world!'
    
  

7. Metoda replace(searchValue, newValue)

Zastępuje określony podłańcuch nowym podłańcuchem:

JavaScript
    
      let str = 'Hello, world!';
      console.log(str.replace('world', 'JavaScript')); // 'Hello, JavaScript!'
    
  

8. Metoda split(separator)

Dzieli łańcuch na tablicę podłańcuchów, używając określonego separatora:

JavaScript
    
      let str = 'Hello, world!';
      let words = str.split(' ');
      console.log(words); // ['Hello,', 'world!']
    
  

9. Metoda substring(start, end)

Zwraca podłańcuch między dwoma indeksami:

JavaScript
    
      let str = 'Hello, world!';
      console.log(str.substring(0, 5)); // 'Hello'
    
  

10. Metoda substr(start, length)

Zwraca podłańcuch, zaczynając od określonego indeksu i długości równej określonej liczbie znaków:

JavaScript
    
      let str = 'Hello, world!';
      console.log(str.substr(0, 5)); // 'Hello'
    
  

11. Metoda slice(start, end)

Wydobywa część łańcucha i zwraca nowy łańcuch:

JavaScript
    
      let str = 'Hello, world!';
      console.log(str.slice(0, 5)); // 'Hello'
    
  

12. Metoda startsWith(substring)

Sprawdza, czy łańcuch zaczyna się od określonego podłańcucha, zwraca true lub false:

JavaScript
    
      let str = 'Hello, world!';
      console.log(str.startsWith('Hello')); // true
    
  

13. Metoda endsWith(substring)

Sprawdza, czy łańcuch kończy się określonym podłańcuchem, zwraca true lub false:

JavaScript
    
      let str = 'Hello, world!';
      console.log(str.endsWith('world!')); // true
    
  

14. Metoda repeat(count)

Zwraca nowy łańcuch, zawierający określoną liczbę kopii oryginalnego łańcucha:

JavaScript
    
      let str = 'Hello';
      console.log(str.repeat(3)); // 'HelloHelloHello'

      let str2 = '-';
      console.log(str2.repeat(30)); // '---------------------------------------------------------------'
    
  

4.3 Łańcuchy nowej generacji

Template strings wprowadzono do JavaScript stosunkowo niedawno. Oferują one wygodniejszy i bardziej czytelny sposób pracy z tekstem w porównaniu do tradycyjnych łańcuchów. Są zawierane w odwrotnych apostrofach (`) i wspierają interpolację wyrażeń oraz tekst wieloliniowy.

Składnia:

    
      `łańcuch nowej generacji`
    
  

Przykład:

Template literatu greeting jest tworzony przy użyciu odwrotnych apostrofów.

JavaScript
    
      const greeting = `Hello, World!`;
      console.log(greeting); // "Hello, World!"
    
  

Główne cechy template strings:

  • Interpolacja wyrażeń: template strings pozwalają na wstawianie wyrażeń i zmiennych wewnątrz łańcucha przy użyciu ${}
  • Tekst wieloliniowy: template strings wspierają tekst wieloliniowy bez konieczności używania specjalnych znaków do przenoszenia linii
  • Wbudowane wyrażenia: w środku template strings można używać dowolnych wyrażeń JavaScript, w tym funkcji

Przeanalizujmy przykłady użycia template strings.

Interpolacja wyrażeń

Template strings pozwalają łatwo wstawiać wartości zmiennych i wyniki wyrażeń wewnątrz łańcucha:

JavaScript
    
      let name = "Alice";
      let age = 30;
      let greeting = `Hello, ${name}! You are ${age} years old.`;
      console.log(greeting); // "Hello, Alice! You are 30 years old."
    
  

W tym przykładzie zmienne name i age są wstawiane wewnątrz łańcucha przy użyciu ${}.

Tekst wieloliniowy

Template strings upraszczają tworzenie łańcuchów wieloliniowych bez potrzeby używania znaków przenoszenia linii (\n):

JavaScript
    
      let multiLine = `Lorem ipsum odor, consectetuer adipiscing elit.
      Sit lorem mattis eget maximus.`;

      console.log(multiLine);
    
  

Wbudowane wyrażenia

W środku template strings można używać dowolnych wyrażeń JavaScript, w tym wywołań funkcji:

JavaScript
    
      let a = 5;
      let b = 10;
      let result = `The sum of ${a} and ${b} is ${a + b}.`;
      console.log(result); // "The sum of 5 and 10 is 15."

      function getGreeting(name) {
        return `Hello, ${name}!`;
      }

      let greeting = `${getGreeting("Bob")}`;
      console.log(greeting); // "Hello, Bob!"
    
  

Lepiej nie wywoływać funkcji w środku łańcucha, ale jeśli bardzo chcesz, to możesz.

Komentarze
TO VIEW ALL COMMENTS OR TO MAKE A COMMENT,
GO TO FULL VERSION