Samouczek JS

JS DOM Wprowadzenie do JS JS Dokąd Wyjście JS Oświadczenia JS Składnia JS Komentarze JS Zmienne JS JS Let JS Const Operatorzy JS Arytmetyka JS Zadanie JS Typy danych JS Funkcje JS Obiekty JS Wydarzenia JS JS Strings Metody ciągów JS Wyszukiwanie ciągów JS Szablony JS String Numery JS Metody liczbowe JS Tablice JS Metody tablic JS Sortowanie tablic JS Iteracja tablicy JS JS Array Const JS Daty Formaty daty JS JS Data Pobierz metody Metody ustawiania daty JS Matematyka JS JS losowo JS Booleans Porównania JS Warunki JS Przełącznik JS Pętla JS dla Pętla JS dla In Pętla JS dla Of Pętla JS, podczas gdy Przerwa JS Iterable JS Zestawy JS Mapy JS Typ JS Konwersja typu JS JS Bitwise JS RegExp Błędy JS Zakres JS JS Podnoszenie Tryb ścisły JS JS to słowo kluczowe Funkcja strzałki JS Klasy JS JS JSON Debugowanie JS Przewodnik po stylu JS Najlepsze praktyki JS Błędy JS Wydajność JS JS słowa zastrzeżone

Wersje JS

Wersje JS JS 2009 (ES5) JS 2015 (ES6) JS 2016 JS 2017 JS 2018 JS IE / Krawędź Historia JS

Obiekty JS

Definicje obiektów Właściwości obiektu Metody obiektowe Wyświetlanie obiektów Akcesoria do obiektów Konstruktorzy obiektów Prototypy obiektów Iterowalne obiekty Zestawy obiektów Mapy obiektów Odniesienie do obiektu

Funkcje JS

Definicje funkcji Parametry funkcji Wywołanie funkcji Wywołanie funkcji Funkcja Zastosuj Zamknięcia funkcji

Klasy JS

Wprowadzenie do zajęć Dziedziczenie klas Klasa statyczna

JS Async

Oddzwaniania JS Asynchroniczny JS JS Obietnice JS Async/Oczekiwanie

JS HTML DOM

Wprowadzenie do DOM Metody DOM Dokument DOM Elementy DOM DOM HTML Formularze DOM DOM CSS Animacje DOM Wydarzenia DOM Odbiornik zdarzeń DOM Nawigacja DOM Węzły DOM Kolekcje DOM Listy węzłów DOM

Zestawienie komponentów przeglądarki JS

Okno JS Ekran JS Lokalizacja JS Historia JS JS Navigator Wyskakujący alert JS Czas JS Pliki cookie JS

JS Web API

Wprowadzenie do internetowego interfejsu API Interfejs API formularzy internetowych Interfejs API historii online API przechowywania danych w sieci Web Web Worker API Internetowy interfejs API pobierania Internetowy interfejs API geolokalizacji

JS AJAX

Wprowadzenie do AJAX AJAX XMLHttp Żądanie AJAX Odpowiedź AJAX Plik XML AJAX AJAX PHP ASP AJAX Baza danych AJAX Aplikacje AJAX Przykłady AJAX

JS JSON

Wprowadzenie do JSON Składnia JSON JSON a XML Typy danych JSON Analiza JSON JSON Obiekty JSON Tablice JSON Serwer JSON JSON PHP JSON HTML JSON JSONP

JS kontra jQuery

Selektory jQuery jQuery HTML jQuery CSS jQuery DOM

Grafika JS

Grafika JS JS płótno JS Działka JS Chart.js Wykres JS Google JS D3.js

Przykłady JS

Przykłady JS JS HTML DOM Wejście JS HTML Obiekty HTML JS Wydarzenia JS HTML Przeglądarka JS Edytor JS Ćwiczenia JS JS Quiz Certyfikat JS

Referencje JS

Obiekty JavaScript Obiekty HTML DOM


Metody ciągów JavaScript


Metody łańcuchowe pomagają w pracy z łańcuchami.


Metody i właściwości ciągów

Wartości pierwotne, takie jak „John Doe”, nie mogą mieć właściwości ani metod (ponieważ nie są obiektami).

Jednak w przypadku JavaScript metody i właściwości są również dostępne dla wartości pierwotnych, ponieważ JavaScript traktuje wartości pierwotne jako obiekty podczas wykonywania metod i właściwości.


Długość ciągu JavaScript

Właściwość lengthzwraca długość ciągu:

Przykład

let txt = "ABCDEFGHIJKLMNOPQRSTUVWXYZ";
let length = txt.length;

Wyodrębnianie części struny

Istnieją 3 metody wyodrębniania części ciągu:

  • slice(start, end)
  • substring(start, end)
  • substr(start, length)

Wycinek ciągu JavaScript()

slice() wyodrębnia część ciągu i zwraca wyodrębnioną część w nowym ciągu.

Metoda przyjmuje 2 parametry: pozycję początkową i pozycję końcową (bez końca).

Ten przykład wycina fragment ciągu z pozycji 7 do pozycji 12 (13-1):

Przykład

let str = "Apple, Banana, Kiwi";
let part = str.slice(7, 13);

Notatka

JavaScript liczy pozycje od zera.

Pierwsza pozycja to 0.

Druga pozycja to 1.

Jeśli parametr jest ujemny, pozycja jest liczona od końca ciągu.

Ten przykład wycina fragment ciągu z pozycji -12 do pozycji -6:

Przykład

let str = "Apple, Banana, Kiwi";
let part = str.slice(-12, -6);

Jeśli pominiesz drugi parametr, metoda wytnie resztę ciągu:

Przykład

let part = str.slice(7);

lub licząc od końca:

Przykład

let part = str.slice(-12);


JavaScript String podciąg()

substring()jest podobny do slice().

Różnica polega na tym, że substring()nie można zaakceptować indeksów ujemnych.

Przykład

let str = "Apple, Banana, Kiwi";
let part = str.substring(7, 13);

Jeśli pominiesz drugi parametr, substring()wytnie resztę ciągu.


JavaScript String substr()

substr()jest podobny do slice().

Różnica polega na tym, że drugi parametr określa długość wyodrębnionej części.

Przykład

let str = "Apple, Banana, Kiwi";
let part = str.substr(7, 6);

Jeśli pominiesz drugi parametr, substr()wytnie resztę ciągu.

Przykład

let str = "Apple, Banana, Kiwi";
let part = str.substr(7);

Jeśli pierwszy parametr jest ujemny, pozycja liczy się od końca ciągu.

Przykład

let str = "Apple, Banana, Kiwi";
let part = str.substr(-4);

Zastępowanie zawartości ciągu

Metoda replace()zastępuje określoną wartość inną wartością w ciągu:

Przykład

let text = "Please visit Microsoft!";
let newText = text.replace("Microsoft", "W3Schools");

Notatka

Metoda replace()nie zmienia ciągu, na którym jest wywoływana.

Metoda replace()zwraca nowy ciąg.

Domyślnie replace()metoda zastępuje tylko pierwsze dopasowanie:

Przykład

let text = "Please visit Microsoft and Microsoft!";
let newText = text.replace("Microsoft", "W3Schools");

Domyślnie w replace()metodzie rozróżniana jest wielkość liter. Pisanie MICROSOFT (wielkimi literami) nie zadziała:

Przykład

let text = "Please visit Microsoft!";
let newText = text.replace("MICROSOFT", "W3Schools");

Aby zamienić wielkość liter bez rozróżniania, użyj wyrażenia regularnego z /iflagą (niewrażliwe):

Przykład

let text = "Please visit Microsoft!";
let newText = text.replace(/MICROSOFT/i, "W3Schools");

Notatka

Wyrażenia regularne są pisane bez cudzysłowów.

Aby zastąpić wszystkie dopasowania, użyj wyrażenia regularnego z /gflagą (dopasowanie globalne):

Przykład

let text = "Please visit Microsoft and Microsoft!";
let newText = text.replace(/Microsoft/g, "W3Schools");

Notatka

Dużo więcej o wyrażeniach regularnych dowiesz się w rozdziale Wyrażenia regularne JavaScript .


Konwersja na wielkie i małe litery

Ciąg jest konwertowany na wielkie litery za pomocą toUpperCase():

Ciąg jest konwertowany na małe litery za pomocą toLowerCase():


Ciąg JavaScript do wielkich liter()

Przykład

let text1 = "Hello World!";
let text2 = text1.toUpperCase();

Ciąg JavaScript do małych liter()

Przykład

let text1 = "Hello World!";       // String
let text2 = text1.toLowerCase();  // text2 is text1 converted to lower

JavaScript ciąg concat()

concat()łączy dwa lub więcej ciągów:

Przykład

let text1 = "Hello";
let text2 = "World";
let text3 = text1.concat(" ", text2);

Metodę concat()można zastosować zamiast operatora plus. Te dwie linie robią to samo:

Przykład

text = "Hello" + " " + "World!";
text = "Hello".concat(" ", "World!");

Notatka

Wszystkie metody łańcuchowe zwracają nowy łańcuch. Nie modyfikują oryginalnego ciągu.

Formalnie powiedział:

Ciągi znaków są niezmienne: ciągów znaków nie można zmienić, można je tylko zastąpić.


Przycinanie ciągów JavaScript()

Metoda trim()usuwa białe znaki z obu stron ciągu:

Przykład

let text1 = "      Hello World!      ";
let text2 = text1.trim();

Dopełnienie ciągu JavaScript

ECMAScript 2017 dodał dwie metody String: padStart oraz padEnddo obsługi dopełnienia na początku i na końcu ciągu.


JavaScript String padStart()

Przykład

let text = "5";
let padded = text.padStart(4,0);

Obsługa przeglądarki

padStart()to funkcja ECMAScript 2017.

Jest obsługiwany we wszystkich nowoczesnych przeglądarkach:

Chrome Edge Firefox Safari Opera
Yes Yes Yes Yes Yes

padStart()nie jest obsługiwany w przeglądarce Internet Explorer.


JavaScript String padEnd()

Przykład

let text = "5";
let padded = text.padEnd(4,0);

Obsługa przeglądarki

padEnd()to funkcja ECMAScript 2017.

Jest obsługiwany we wszystkich nowoczesnych przeglądarkach:

Chrome Edge Firefox Safari Opera
Yes Yes Yes Yes Yes

padEnd()nie jest obsługiwany w przeglądarce Internet Explorer.


Wyodrębnianie znaków ciągu

Istnieją 3 metody wyodrębniania znaków ciągu:

  • charAt(position)
  • charCodeAt(position)
  • Dostęp do nieruchomości [ ]

JavaScript String charAt()

Metoda charAt()zwraca znak o określonym indeksie (pozycji) w ciągu znaków:

Przykład

let text = "HELLO WORLD";
let char = text.charAt(0);

JavaScript String charCodeAt()

Metoda charCodeAt()zwraca unicode znaku o określonym indeksie w ciągu:

Metoda zwraca kod UTF-16 (liczbę całkowitą od 0 do 65535).

Przykład

let text = "HELLO WORLD";
let char = text.charCodeAt(0);

Dostęp do nieruchomości

ECMAScript 5 (2009) umożliwia dostęp do właściwości [ ] w ciągach:

Przykład

let text = "HELLO WORLD";
let char = text[0];

Notatka

Dostęp do nieruchomości może być trochę nieprzewidywalny:

  • Sprawia, że ​​łańcuchy wyglądają jak tablice (ale nimi nie są)
  • If no character is found, [ ] returns undefined, while charAt() returns an empty string.
  • It is read only. str[0] = "A" gives no error (but does not work!)

Example

let text = "HELLO WORLD";
text[0] = "A";    // Gives no error, but does not work

Converting a String to an Array

If you want to work with a string as an array, you can convert it to an array.

JavaScript String split()

A string can be converted to an array with the split() method:

Example

text.split(",")    // Split on commas
text.split(" ")    // Split on spaces
text.split("|")    // Split on pipe

If the separator is omitted, the returned array will contain the whole string in index [0].

If the separator is "", the returned array will be an array of single characters:

Example

text.split("")

Complete String Reference

For a complete String reference, go to our:

Complete JavaScript String Reference.

The reference contains descriptions and examples of all string properties and methods.

Test Yourself With Exercises

Exercise:

Convert the text into an UPPERCASE text:

let txt = "Hello World!";
txt = txt.;