Строки в JavaScript

Строки в JS

В JavaScript любые текстовые данные являются строками. Внутренний формат для строк — всегда UTF-16, вне зависимости от кодировки страницы.

Строки в JS обозначаются кавычками:

  1. одинарными ('Привет');
  2. двойными ("Привет");
  3. обратными (для шаблонных литералов): 

  • позволяют вставлять в строку произвольные (вычисляемые) выражения или переменные, обернув их в ${…});
  • могут занимать более одной строки (без использования спецсимволов).
  •  
Примеры строк в JS

[свернуть]
Примеры использования обратных кавычек в строках JS

[свернуть]

Шаблонные литералы (строки) в JavaScript

Шаблонными литералами называются строковые литералы, допускающие использование выражений внутри, обозначаемых знаком $ и фигурными скобками (${выражение}). Заключаются в обратные кавычки () (буква "ё"). Позволяют использовать многострочные литералы и строковую интерполяцию. 

Результат выполнения кода

Шаблон строки в JavaScript

[свернуть]

Спецсимволы в строках JS

Многострочные строки также можно создавать с помощью одинарных и двойных кавычек, используя так называемый «символ перевода строки», который записывается как \n:

Таблица спецсимволов

Символ Описание
\n Перевод строки
\r  Возврат каретки: самостоятельно не используется. В текстовых файлах Windows для перевода строки используется комбинация символов \r\n.
\'  ,  \"  Кавычки (экранированные) 
\\ Обратный слеш
\t Знак табуляции
\b, \f, \v Backspace, Form Feed и Vertical Tab — оставлены для обратной совместимости, сейчас не используются.
\xXX Символ с шестнадцатеричным юникодным кодом XX, например, '\x7A' — то же самое, что 'z'.
\uXXXX Символ в кодировке UTF-16 с шестнадцатеричным кодом XXXX, например, \u00A9 — юникодное представление знака копирайта, ©. Код должен состоять ровно из 4 шестнадцатеричных цифр.
\u{X…XXXXXX} (от 1 до 6 шестнадцатеричных цифр) Символ в кодировке UTF-32 с шестнадцатеричным кодом от U+0000 до U+10FFFF. Некоторые редкие символы кодируются двумя 16-битными словами и занимают 4 байта. Так можно вставлять символы с длинным кодом.
   

[свернуть]

Особенности экранирования кавычек обратным слэшем (\):

  • требование экранировать относится только к таким же кавычкам, как те, в которые заключена строка. 

Свойства строки JS

Свойство length (длина строки)

Свойство length содержит длину строки:

Так как length— это числовое свойство, а не функция, то добавлять скобки не нужно.

Свойство length строки можно использовать для проверки строки на пустоту (empty string): str.length===0.

Конкатенация строк в JavaScript

Конкатенация (объединение) строк в JS возможно двумя способами:

  1. с использованием оператора "+";
  2. с использованием метода concat.

Методы строки JS

Получение символа строки JS (метод charAt())

Получить символ строки на нужной позиции pos, можно:

  1. с помощью квадратных скобок: [pos];
  2. методом charAt(pos) (устаревший способ).

Также можно использовать метод charAt(pos). Первый символ занимает нулевую позицию:

Отличие [pos] от charAt(pos):

  • если символ на позиции pos отсутствует, тогда
    1. [pos] вернёт undefined;
    2. charAt(pos) вернёт пустую строку:

Изменение регистра символов строки JS (методы toLowerCase() и toUpperCase())

Методы toLowerCase() и toUpperCase() меняют регистр символов:

ВАЖНО! Строки неизменяемы. Содержимое строки в JavaScript нельзя изменить, т.е. нельзя взять символ посередине строки и заменить его. Её можно изменить лишь перезаписав в ту же переменную.

Разбивка стрoки на масcив строк ( метoд split() )

Метод split() разбивает объект String на массив строк путём разделения строки указанной подстрокой.

Параметры метода split():

  1. separator (необязательный) - указывает символы, используемые в качестве разделителя внутри строки. Параметр separator может быть как строкой, так и регулярным выражением:
    • если разделитель separator найден, он удаляется из строки, а подстроки возвращаются в массиве;
    • если параметр опущен, возвращённый массив будет содержать один элемент со всей строкой;
    • если параметр равен пустой строке, строка str будет преобразована в массив символов.
  2. limit (необязательный) - целое число, определяющее ограничение на количество найденных подстрок. Метод split() всё равно разделяет строку на каждом сопоставлении с разделителем separator, но обрезает возвращаемый массив так, чтобы он содержал не более limit элементов.

Если разделитель является регулярным выражением, содержащим подгруппы, то каждый раз при сопоставлении с разделителем, результаты (включая те, что не определены) захвата подгруппы будут помещаться внутрь выходного массива. Однако не все браузеры поддерживают эту возможность.

Если строка является пустой строкой, метод split() вернёт массив, состоящий из одной пустой строки, а не пустой массив.

Реверс строки в JavaScript:

Отсюда

Про reverse() и join() смотри Массивы в JavaScript

[свернуть]

Поиск подстроки в JavaScript

Существует несколько способов поиска подстроки:

  1. метод indexOf(substr[, pos]) - ищет подстроку substr в строке str, начиная с позиции pos (необязательный аргумент), и возвращает:
    • позицию, на которой располагается совпадение, либо
    • -1 (при отсутствии совпадений);
  2. метод lastIndexOf(substr[, pos]) - ищет подстроку с конца строки к её началу (ищет справа налев, а номер позиции отсчитывается слева направо) и используется тогда, когда нужно получить самое последнее вхождение: перед концом строки или начинающееся до (включительно) определённой позиции.
  3. с использованием побитового оператора НЕ — ~.

Чтобы найти все вхождения подстроки, нужно запустить indexOf в цикле. Каждый раз, получив очередную позицию, начинаем новый поиск со следующей.

Пример

Отсюда...

Тот же алгоритм можно записать и короче:

При проверке indexOf в условии if есть небольшой нюанс. Такое условие не будет работать:

Мы ищем подстроку "Widget", и она здесь есть, прямо на позиции 0. Но alert не показывается, т. к. str.indexOf("Widget") возвращает 0 (false), и if решает, что тест не пройден.

Поэтому надо делать проверку на -1:

[свернуть]
Использование побитового оператора НЕ (~)

Побитовый оператор НЕ (~) преобразует число в 32-разрядное целое со знаком (signed 32-bit integer). Дробная часть, в случае, если она присутствует, отбрасывается. Затем все биты числа инвертируются.

На практике это означает простую вещь: для 32-разрядных целых чисел значение ~n равно -(n+1).

В частности:

Таким образом, ~n равняется 0 только при n == -1 (для любого n, входящего в 32-разрядные целые числа со знаком).

Соответственно, прохождение проверки if ( ~str.indexOf("…") ) означает, что результат indexOf отличен от -1, совпадение есть.

Это иногда применяют, чтобы сделать проверку indexOf компактнее:

Использовать возможности языка таким неочевидным образом не рекомендуется (но могло быть использовано в старом коде).

Просто запомните: if (~str.indexOf(…)) означает «если найдено».

[свернуть]

Проверка наличия подстроки в строке (методы  includes, startsWith, endsWith)

Метод includes(substr[, pos]) используется при проверке строки на совпадение, при том что позиция не нужна (возвращает true, если в строке str есть подстрока substr, либо false, если нет).

Необязательный второй аргумент  pos позволяет начать поиск с определённой позиции/

Методы startsWith и endsWith проверяют, соответственно, начинается ли и заканчивается ли строка определённой подстрокой:

Получение подстроки в JavaScript (методы substring и slice)

В JavaScript есть 3 метода для получения подстроки: 

  1. slice(start [, end])- возвращает часть строки от start до (не включая) end (поддерживает отрицательные значения аргументов).
  2. substring(start [, end]) - возвращает часть строки между start и end (можно задавать start больше end, отрицательные значения аргументов не поддерживает).
  3. substr(start [, length]) - (устаревший) возвращает часть строки от start длины length (позволяет указать длину подстроки вместо конечной позиции).

Замечание по методу substr()

Внимание: так как String.prototype.substr(…) не полностью упразднен (а лишь "удален из стандартов по вебу"), он считается унаследованной функцией, использование которой лучше избегать там, где это возможно. Он не является частью ядра языка JavaScript и может быть удален в будущем. Если есть возможность, используйте метод substring().

[свернуть]

Замена части строки (метод replace) 

Метод поиска и замены replace() возвращает новую строку с заменёнными на заменитель некоторыми или всеми совпадениями с шаблоном. Шаблон может быть строкой или регулярным выражением, а заменитель может быть строкой или функцией, вызываемой при каждом сопоставлении.

Замечание: когда первый аргумент replace является строкой, он заменяет только первое совпадение. Для того чтобы найти все совпадения и заменить их, необходимо использовать регулярное выражение с обязательным флагом g.

где

  • regexp  - объект регулярного выражения RegExp(); сопоставление заменяется возвращаемым значением второго параметра;
  • substr - строка, заменяемая на newSubStr (будет заменено только первое вхождение искомой строки);
  • newSubStr - строка, заменяющая подстроку из первого параметра; поддерживает несколько специальных шаблонов замены;
  • function - функция, вызываемая для создания новой подстроки (помещаемой вместо подстроки из первого параметра);
  • flags - строка, задающая комбинацию флагов регулярного выражения; внимание: аргумент flags не работает в ядре v8 (движок JavaScript в Chrome и NodeJs).

Параметр flags в методе String.prototype.replace() является нестандартным расширением. Вместо использования этого параметра используйте объект RegExp с соответствующими флагами.

Специальные шаблоны замены

Можно ещё почитать https://habr.com

По регулярным выражениям https://mattweb.ru

Спецсимволы  Действие в строке замены
$$  вставляет "$"
$&  вставляет найденное совпадение (шаблон)
$`  вставляет предыдущую часть строки (до совпадения)
$'  вставляет оставшуюся (после совпадения) часть строки 
$n  если n это 1(2)-значное число, то вставляет содержимое n-й скобки (при использовании регулярных выражений)
$<имя>  вставляет содержимое скобки с указанным именем

 

 

 

 

 

[свернуть]

Ещё примеры

[свернуть]

Удаление пробелов в строке JS

Метод str.trim() — убирает пробелы в начале и конце строки.

Повтор строки JS

Метод str.repeat(n) — повторяет строку n раз.

Сравнение строк в JavaScript

Строки в JS сравниваются посимвольно в алфавитном порядке.

Особенности посимвольного сравнения строк в JS:

  1. Символы сравниваются по их кодам (больший код — больший символ, все строчные буквы идут после (правее) заглавных, так как их коды больше ('a' > 'Z'  // 97>65 true) ;
  2. Буквы, имеющие диакритические знаки, идут «не по порядку» ( 'Österreich' > 'Zealand' );

Для получения символа по его коду (и наоборот) используется методы:

  • codePointAt(pos), который возвращает код Unicode для символа, находящегося на позиции pos;
  • charCodeAt(pos), который возвращает числовое значение Unicode UTF-16 для символа по указанному индексу (за исключением кодовых точек Unicode, больших 0x10000).
  • String.fromCodePoint(code) - создаёт символ по его коду code

Выведем строку, содержащую символы с кодами от 65 до 90 — это латиница (символы заглавных букв):

Правильное сравнение строк (метод str1.localeCompare(str2))

Вызов метода str1.localeCompare(str2) возвращает число, которое показывает, какая строка больше в соответствии с правилами языка:

  • Отрицательное число, если str1 меньше str2.
  • Положительное число, если str1 больше str2.
  • 0, если строки равны.

Примеры операций со строками JS

Посимвольный перебор строки

Получить первую и последнюю буквы строки

Сделать первую и последнюю буквы строки в верхнем регистре

Найти положение слова в строке

Найти положение второго пробела

Получить строку с i-го символа длиной n букв

Получить строку с i-го по n-й символы

Удаление из строки последних n символов

Получение строки из переменных

 

Добавить комментарий

Этот сайт использует Akismet для борьбы со спамом. Узнайте, как обрабатываются ваши данные комментариев.