JS:работа со строками
Строка – это последовательность одного или более символов, которые могут состоять из букв, цифр или других знаков. Каждый символ в строке JavaScript доступен по номеру индекса.
В этой статье мы изучим разницу между примитивным строковым типом и объектом String. А также узнаем, как индексируются строки, как получить доступ к символам строки, основные свойства и методы строк.
Примитивные строковые типы и String Objects
Для начала мы проясним различие между двумя типами строк. JavaScript различает примитивную строку (неизменяемый тип) и объект String.
Чтобы понять различия между ними, инициализируем примитивную строку и объект-строку.
Можно использовать оператор typeof, чтобы определить тип значения. В первом примере мы присвоили переменной строковое значение.
Во втором примере мы использовали конструктор new String(), чтобы создать объект-строку и присвоить его переменной.
В большинстве случаев вы будете создавать примитивные строки. JavaScript может использовать свойства и методы объекта String без явного приведения примитивной строки к object .
Методы и свойства String Objects доступны для всех строк. Но JavaScript осуществляет конвертацию строки в объект и обратно каждый раз, когда вызывается метод или свойство.
Как индексируются строки
Каждый символ строки соответствует индексу, начиная с 0. Чтобы это продемонстрировать, создадим строку со значением How are you?
| H | o | w | a | r | e | y | o | u | ? | ||
| 0 | 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 |
Первый символ строки –H, который соответствует индексу 0. Последний символ – ? соответствует индексу 11. Символы пробелов имеют индексы 3 и 7.
Доступ к символам
Продемонстрируем, как получить доступ к символам и индексам строки How are you?
Используя квадратные скобки, можно получить доступ к любому символу строки.
Мы также можем использовать метод charAt() , чтобы вернуть символ, передавая индекс в качестве параметра.
Также можно использовать indexOf() , чтобы вернуть индекс первого вхождения символа в строке.
Несмотря на то, что символ «o» появляется в строке How are you? дважды, indexOf() вернёт позицию первого вхождения.
lastIndexOf() используется, чтобы найти последнее вхождение.
Оба метода также можно использовать для поиска нескольких символов в строке. Они вернут индекс первого символа.
А вот метод slice() вернёт символы между двумя индексами.
Обратите внимание на то, что 11– это ?, но? не входит в результирующую строку. slice() вернёт всё, что между указанными значениями индекса. Если второй параметр опускается, slice() вернёт всё, начиная от первого параметра до конца строки.
Методы charAt() и slice() помогут получить строковые значения на основании индекса. А indexOf() и lastIndexOf() делают противоположное, возвращая индексы на основании переданной им строки.
Нахождение длины строки
Используя свойство length , можно получить количество символов в строке.
Помните, что свойство length возвращает реальное количество символов, начиная с 1. Вы получите результат 12, а не значение индекса последнего символа, который считается с 0.
Преобразование в верхний или нижний регистр
Встроенные методы toUpperCase() и toLowerCase() используются для форматирования текста и сравнения строковых значений.
toUpperCase() преобразует все символы в верхний регистр.
toLowerCase() преобразует все символы в нижний регистр.
Эти методы форматирования не имеют параметров.Также важно, что они не изменяют оригинальную строку.
Разбиение строк
JavaScript предоставляет метод для разбиения строк по символу и создания нового массива из полученных частей. Мы используем метод split() , чтобы разбить строку на массив по символу пробела, который представлен строкой » «.
Теперь, когда у нас есть новый массив в переменной splitString , можно получить доступ к каждой его части по индексу.
Если методу split() передана пустая строка, он создаст массив из всех отдельных символов строки. При помощи разбиения строк можно определить количество слов в предложении.
Отсечение пробелов
Метод trim() в JavaScript убирает пробелы с обоих концов строки, но не внутри неё. Под пробелами понимаются как обычные пробелы, так и символы табуляции.
Метод trim() – это простой способ избавиться от лишних пробелов.
Поиски замена строковых значений
С помощью метода replace() можно осуществлять поиск строки и её замену новым значением. В качестве первого параметра методу следует передать значение для поиска, а вторым – значения для замены.
Также можно использовать регулярные выражения . Например, метод replace() затрагивает только первое вхождение искомой строки. Но мы можем использовать флаг g (глобальный), чтобы найти все вхождения, и флаг i (независимый от регистра), чтобы игнорировать регистр.
Заключение
В этой статье мы изучили различие между примитивными строками и объектом String. А также узнали, как индексируются строки и как использовать методы и свойства JavaScript для доступа к символам строки, форматирования текста, поиска и замены значений в строках.
Пожалуйста, оставляйте свои отзывы по текущей теме материала. Мы очень благодарим вас за ваши комментарии, лайки, подписки, отклики, дизлайки!
Пожалуйста, оставьте свои мнения по текущей теме материала. За комментарии, отклики, лайки, дизлайки, подписки низкий вам поклон!
Методы объекта String
У примитивных значений или литералов, вроде строки «Иван Петров», не может быть свойств или методов (потому что они не объекты). Однако, в JavaScript все устроено так, что даже у примитивных значений доступны свои методы и свойства, потому что JavaScript интерпретирует любые значения, как объекты с выполняемыми методами и свойствами.
Встроенные методы и свойства строк помогают работать с этими самыми строками.
Длина строки
При помощи свойства length можно узнать длину строки:
Поиск подстроки в строке
Метод indexOf() возвращает индекс (позицию) первого вхождения заданного текста в строке:
Метод lastIndexOf() возвращает индекс последнего вхождения заданного текста в строке:
Если подстрока не найдена, то оба метода, indexOf() и lastIndexOf(), вернут -1.
Внимание! JavaScript считает позицию от нуля. 0 это первый символ в строке, 1 — второй, 2 — третий и т.д.
Оба метода в качестве второго параметра принимают начальную позицию поиска:
Кроме этого, для поиска подстроки существует метод search(), который возвращает позицию найденной подстроки:
Вероятно вы заметили, что два метода, indexOf() и search(), очень похожи друг на друга. Они принимают одинаковые аргументы (параметры) и возвращают одинаковые значения. Получается эти методы одно и то же?
На самом деле у этих методов есть ряд существенных отличий:
- Метод search() не принимает второй, связанный с позицией, параметр.
- Метод indexOf() не принимает «усиленные» поисковые значения (регулярные выражения).
Подробнее о регулярных выражениях будет рассказано в следующих главах этого учебника.
Извлечение части строки
Существует три метода, позволяющих извлечь часть строки:
- slice(начало, конец)
- substring(начало, конец)
- substr(начало, длина)
Метод slice()
Метод slice() извлекает часть строки и возвращает извлеченную часть в новой строке.
Этот метод принимает 2 параметра: начальный и конечный индекс (позицию).
В следующем примере вырезается часть строки, начиная с позиции 7 и заканчивая позицией 13:
В результате в переменной res будет строка «Banana».
Если в параметре заданы отрицательные значения, то позиция будет отсчитываться с конца строки.
В следующем примере вырезается часть строки с позиции -12 до позицией -6:
В результате в переменной res будет строка «Banana».
Если второй параметр не указан, то вырезается вся подстрока, начиная с заданной позиции. Задавать также можно положительные и отрицательные значения.
Внимание! Отрицательные значения параметров не работают в Internet Explorer 8 и более ранних версий.
Метод substring()
Метод substring() похож на метод slice(). Разница между ними в том, что метод substring() не может принимать в качестве параметров отрицательные значения.
В результате в переменной res будет строка «Banana».
Если второй параметр не указан, то метод substring() вырежет всю подстроку, начиная с заданной позиции.
Метод substr()
Метод substr() аналогичен методу slice(). Разница между ними в том, что вторым параметром в методе substr() задается длина извлекаемой подстроки.
В результате в переменной res будет строка «Banana».
Если в первом параметре задано отрицательное значение, то позиция будет отсчитываться с конца строки.
Второй параметр не может быть отрицательным, так как он определяет длину подстроки.
Если второй параметр не указан, то метод substr() вырежет всю подстроку, начиная с заданной позиции.
Замена содержимого строки
Метод replace() ищет в строке заданную подстроку и заменяет ее другим значением:
В результате в переменной n будет строка «Посетите MSiter!».
Метод replace() не изменяет исходную строку. Он возвращает новую строку.
По умолчанию, метод replace() заменяет первую совпавшую подстроку:
В результате в переменной n будет строка «Посетите MSiter и Microsoft!».
По умолчанию, метод replace() регистрозависим. Поэтому запись подстроки MICROSOFT (большими буквами) в следующем примере не сработает:
Чтобы заменить подстроку независимо от регистра букв, используйте регулярное выражение с флагом /i:
Обратите внимание, что регулярные выражения записываются без кавычек.
Чтобы заменить все найденные совпадения, используйте регулярное выражение с флагом /g:
Изменение регистра букв
Метод toUpperCase() позволяет преобразовать строку в верхний регистр:
Метод toLowerCase() позволяет преобразовать строку в нижний регистр:
Метод concat()
Метод concat() объединяет две и больше строк:
Метод concat() может использоваться вместо оператора +. Следующий пример делает то же самое, что и предыдущий:
Следует помнить, что все методы строк возвращают новую строку. Они никак не изменяют исходную строку. Если говорить формально, строки обладают иммунитетом. Они не могут изменяться, их можно только заменить.
Извлечение символа из строки
Существует 2 безопасных метода для извлечения символа из строки:
- charAt(позиция)
- charCodeAt(позиция)
Метод charAt()
Метод charAt() возвращает символ строки, расположенный в заданной позиции:
Метод charCodeAt()
Метод charCodeAt() возвращает код символа строки, расположенного в заданной позиции:
Обращение к строке как к массиву небезопасно
Иногда можно увидеть следующий код, в котором к строке обращаются как к массиву:
Этого никогда не следует делать, так как это небезопасно и может привести к непредсказуемым результатам:
- Подобное работает не во всех браузерах (не работает в IE5, IE6, IE7)
- Выглядит так, будто строка это массив (но на самом деле это не так)
- Выражение str[0] = «H» не приводит к ошибке (но не работает)
Если вам нужно прочитать строку как массив, то сначала преобразуйте ее в массив.
Преобразование строки в массив
При помощи метода split() строку можно преобразовать в массив:
Если разделитель не указан, то будет возвращен массив, который состоит из одного элемента — исходной строки, расположенной по индексу [0].
Если в качестве разделителя указана пустая строка «», то будет возвращен массив, в котором строка разделена посимвольно: