JavaScript Строковые методы
Строковые методы помогают работать со строками.
Строковые методы и свойства
Примитивные значения, такие как "John Doe", не могут иметь свойств или методов (поскольку они не являются объектами).
Но в JavaScript методы и свойства также доступны для примитивных значений, потому что JavaScript обрабатывает примитивные значения как объекты при выполнении методов и свойств.
Длина строки
Свойство length
возвращает длину строки:
Нахождение строки в строке
Метод indexOf()
возвращает индекс (положение) first
(первого) вхождения указанного текста в строке:
Пример
var str = "Пожалуйста, найдите, где происходит 'locate'! ";
var pos = str.indexOf("locate");
Попробуйте сами »
JavaScript считает позиции с нуля.
0 - это первая позиция в строке, 1 - это вторая, 2 - это третья и т.д.
Метод lastIndexOf()
возвращает индекс last (последнего) вхождения указанного текста в строку:
Пример
var str = "Пожалуйста, найдите, где происходит 'locate'!";
var pos = str.lastIndexOf("locate");
Попробуйте сами »
Оба метода indexOf()
и lastIndexOf()
возвращают -1, если текст не найден.
Пример
var str = "Пожалуйста, найдите, где происходит 'locate'!";
var pos = str.lastIndexOf("John");
Попробуйте сами »
Оба метода принимают второй параметр в качестве начальной позиции для поиска:
Пример
var str = "Пожалуйста, найдите, где происходит 'locate'!";
var pos = str.indexOf("locate", 15);
Попробуйте сами »
Методы lastIndexOf()
выполняют поиск в обратном направлении (от конца к началу), что означает: если второй параметр равен 15
, поиск начинается с позиции 15 и выполняется до начала строка.
Пример
var str = "Пожалуйста, найдите, где происходит 'locate'!";
var pos = str.lastIndexOf("locate", 15);
Попробуйте сами »
Поиск строки в строке
Метод search()
ищет строку для указанного значения и возвращает позицию совпадения:
Пример
var str = "Пожалуйста, найдите, где происходит 'locate'!";
var pos = str.search("locate");
Попробуйте сами »
А вы заметили?
Два метода indexOf()
и search()
, равнозначны?
Они принимают одни и те же аргументы (параметры) и возвращают одно и то же значение?
Эти два метода НЕ равнозначны. Есть отличия:
- Метод
search()
не может принимать второй аргумент начальной позиции. - Метод
indexOf()
не может принимать большие поисковые значения (регулярные выражения).
Вы узнаете больше о регулярных выражениях в следующей главе.
Извлечение частей строк
Есть 3 метода для извлечения части строки::
slice(start, end)
substring(start, end)
substr(start, length)
Метод slice()
slice()
извлекает часть строки и возвращает извлеченную часть в новой строке.
Метод принимает 2 параметра: начальную позицию и конечную позицию (конечная позиция не включена).
В этом примере вырезается часть строки из позиции 7 в позицию 12 (13-1):
Пример
var str = "Apple, Banana, Kiwi";
var res = str.slice(7, 13);
Результат res будет:
Banana
Помните: JavaScript считает позиции с нуля. Первая позиция 0.
Если параметр отрицательный, позиция отсчитывается от конца строки.
Этот пример вырезает часть строки из позиции -12 в позицию -6:
Пример
var str = "Apple, Banana, Kiwi";
var res = str.slice(-12, -6);
Результат res будет:
Banana
Если вы опустите второй параметр, метод будет вырезать остальную часть строки:
или считая с конца:
Отрицательные позиции не работают в Internet Explorer 8 и более ранних версиях.
Метод substring()
Метод substring()
похожий на метод slice()
.
различие в том, что substring()
не может принимать отрицательные индексы.
Пример
var str = "Apple, Banana, Kiwi";
var res = str.substring(7, 13);
Результат res будет:
Banana
Если вы опустите второй параметр, substring()
будет вырезать остальную часть строки.
Метод substr()
Метод substr()
похожий на метод slice()
.
Разница в том, что второй параметр определяет длину извлеченной части.
Пример
var str = "Apple, Banana, Kiwi";
var res = str.substr(7, 6);
Результат res будет:
Banana
Если вы опустите второй параметр, substr()
будет вырезать остальную часть строки.
Пример
var str = "Apple, Banana, Kiwi";
var res = str.substr(7);
Результат res будет:
Banana, Kiwi
Если первый параметр отрицателен, позиция отсчитывается от конца строки.
Пример
var str = "Apple, Banana, Kiwi";
var res = str.substr(-4);
Результат res будет:
Kiwi
Замена содержимого строки
Метод replace()
заменяет указанное значение другим значением в строке:
Пример
str = "Пожалуйста, посетите Microsoft!";
var n = str.replace("Microsoft", "W3Schools");
Попробуйте сами »
Метод replace()
не меняет строку, в которой он вызывается. Он возвращает новую строку.
По умолчанию метод replace()
заменяет только первое совпадение:
Пример
str = "Пожалуйста, посетите Microsoft и Microsoft!";
var n = str.replace("Microsoft", "W3Schools");
По умолчанию метод replace()
чувствителен к регистру. Запись MICROSOFT (написанная заглавными буквами) не будет работать:
Пример
str = "Пожалуйста, посетите Microsoft!";
var n = str.replace("MICROSOFT", "W3Schools");
Чтобы заменить на содержимое без учёта регистра, используйте регулярное выражение с флажком /i
(нечувствительный):
Пример
str = "Пожалуйста, посетите Microsoft!";
var n = str.replace(/MICROSOFT/i, "W3Schools");
Обратите внимание, что регулярные выражения пишутся без кавычек.
Чтобы заменить все совпадения, используйте регулярное выражение с флажком /g
(глобальное совпадение):
Пример
str = "Пожалуйста, посетите Microsoft и Microsoft!";
var n = str.replace(/Microsoft/g, "W3Schools");
Вы узнаете больше о регулярных выражениях в главе JavaScript Регулярные выражение.
Преобразование в верхний и нижний регистр
Строка преобразуется в верхний регистр с помощью toUpperCase()
:
Пример
var text1 = "Hello World!"; // Строка
var text2 = text1.toUpperCase(); // text2 - это текст1, преобразованный в верхний регистр
Попробуйте сами »
Строка преобразуется в нижний регистр с помощью toLowerCase()
:
Пример
var text1 = "Hello World!"; // Строка
var text2 = text1.toLowerCase(); // text2 - это текст1, преобразованный в нижний регистр
Попробуйте сами »
Метод concat()
Метод concat()
объединяет две или более строки:
Пример
var text1 = "Hello";
var text2 = "World";
var text3 = text1.concat(" ", text2);
Попробуйте сами »
Метод concat()
можно использовать вместо оператора плюс. Эти две строки делают то же самое:
Пример
var text = "Hello" + " " + "World!";
var text = "Hello".concat(" ", "World!");
Все строковые методы возвращают новую строку. Они не изменяют исходную строку.
Формально говоря: строки неизменны: строки не могут быть изменены, только заменены.
Метод String.trim()
Метод trim()
удаляет пробелы с обеих сторон строки:
Метод trim()
не поддерживается в Internet Explorer 8 или ниже.
Если вам нужно поддерживать IE 8, вместо этого вы можете использовать replace()
с регулярным выражением:
Пример
var str = " Hello World! ";
alert(str.replace(/^[\s\uFEFF\xA0]+|[\s\uFEFF\xA0]+$/g, ''));
Попробуйте сами »
Вы также можете использовать решение замены выше, чтобы добавить функцию обрезки в JavaScript String.prototype
:
Пример
if (!String.prototype.trim) {
String.prototype.trim =
function () {
return
this.replace(/^[\s\uFEFF\xA0]+|[\s\uFEFF\xA0]+$/g, '');
};
}
var str = " Hello World! ";
alert(str.trim());
Попробуйте сами »
JavaScript String Padding - Заполнение строк
В ECMAScript 2017 добавлены два метода String: padStart
и padEnd
для поддержки заполнения в начале и в конце строки.
Заполнение строк не поддерживается в Internet Explorer.
Firefox и Safari были первыми браузерами с поддержкой заполнения строк JavaScript:
Chrome 57 | Edge 15 | Firefox 48 | Safari 10 | Opera 44 |
Mar 2017 | Apr 2017 | Aug 2016 | Sep 2016 | Mar 2017 |
Извлечение строковых символов
Есть 3 метода для извлечения строковых символов:
charAt(position)
charCodeAt(position)
- Свойство access [ ]
Метод charAt()
Метод charAt()
возвращает символ по указанному индексу (позиции) в строке:
Метод charCodeAt()
Метод charCodeAt()
возвращает unicode символа по указанному индексу в строке:
Метод возвращает код UTF-16 (целое число от 0 до 65535).
Свойство Access
ECMAScript 5 (2009) разрешает свойство access [ ] для строк:
Свойство access может быть немного непредсказуемым:
- Это не работает в Internet Explorer 7 или более ранней версии
- Это делает строки похожими на массивы (но это не так)
- Если символ не найден, [] возвращает undefined, а charAt() возвращает пустую строку.
- Это только для чтения. str[0] = "A" не выдаёт ошибок (но не работает!)
Пример
var str = "HELLO WORLD";
str[0] = "A";
// Не выдаёт ошибки, но не работает
str[0]; // возвращает H
Попробуйте сами »
Если вы хотите работать со строкой в виде массива, вы можете преобразовать её в массив.
Преобразование строки в массив
Строка может быть преобразована в массив с помощью метода split()
:
Пример
var txt = "a,b,c,d,e"; // Строка
txt.split(","); // Разделить запятыми
txt.split(" "); // Разделить пробелами
txt.split("|"); // Разделить вертикальной чертой
Попробуйте сами »
Если разделитель опущен, возвращаемый массив будет содержать всю строку в индексе [0].
Если разделитель является "", возвращаемый массив будет массивом отдельных символов:
Полный справочник строк
Для более полного ознакомления со строками в JavaScript, перейдите на Полный справочник JavaScript строк на нашем сайте W3Schools на русском.
Справочник содержит описания и примеры всех строковых свойств и методов.