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:
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:
let str = 'Hello';
console.log(str.length); // 5
2. Metoda charAt(index)
Zwraca znak znajdujący się na określonej pozycji:
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:
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:
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:
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:
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:
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:
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:
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:
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:
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
:
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
:
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:
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.
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:
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
):
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:
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.
GO TO FULL VERSION