САЙТ ДЛЯ ВЕБ РАЗРАБОТЧИКОВ НА РУССКОМ ЯЗЫКЕ

JavaScript Методы строк



Строковые методы помогут вам для работы со строками.


Строковые методы и свойства

Примитивными значениями, как "Андрей Щипунов", не может иметь свойства или методы (поскольку они не являются объектами).

Но JavaScript методы и свойства доступны с помощью примитивных значений, потому что JavaScript обрабатывает примитивные значения как объекты для выполнения методов и свойств.


Длина строки

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

Пример

var txt = "АБВГДЕЁЖЗИЙКЛМНОПРСТУФХЦЧШЩЪЬЭЮЯ";
var sln = txt.length;
Редактор кода »

Найти подстроку в строке

Метод indexOf() возвращает индекс (позицию) в первое вхождение указанного текста в строку:

Пример

var str = "Пожалуйста, найдите, где происходит 'locate'";
var pos = str.indexOf("locate");
Редактор кода »

Метод lastIndexOf() возвращает индекс последнее вхождение указанного текста в строку:

Пример

var str = "Пожалуйста, найдите, где происходит 'locate'";
var pos = str.lastIndexOf("locate");
Редактор кода »

Как метод indexof() и lastIndexOf() методы возвращают значение -1, если текст не найден.

В JavaScript рассчитывает позиции с нуля.
0 это первая позиция в строке, 1-вторая, 2-третья ...

Оба метода принимают в качестве второго параметра в качестве начальной позиции для поиска:

Пример

var str = "Пожалуйста, найдите, где происходит 'locate'";
var pos = str.indexOf("locate",15);
Редактор кода »

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

Метод search() поисковик строки по заданному значению и возвращает позицию совпадения:

Пример

var str = "Пожалуйста, найдите, где происходит 'locate'";
var pos = str.search("locate");
Редактор кода »

Вы заметили?

Методы indexof() и search(), равны?

Они принимают те же аргументы (параметры) и возвращает то же значение?

Два метода вполне равны. Различия в:

  • Метод search() не может принимать второй аргумент начальной позиции.
  • Метод search() может принимать гораздо более мощные значения поиска (регулярные выражения).

Дополнительные сведения о регулярных выражениях см. в следующей главе.


Извлечение части строки

Существует 3 метода извлечения части строки:

  • slice (старт, конец)
  • substring (старт, конец)
  • substr (начало, длина)

Метод slice

slice извлекает часть строки и возвращает извлеченную часть в новую строку.

Метод принимает 2 параметра: начальный индекс (позиция) и конечный индекс (позиция).

В этом примере slice часть строки из позиции 7 в позицию 13:

Пример

var str = "Яблоко, Банан, Киви";
var res = str.slice(7, 13);

Результатом будет res:

Банан
Редактор кода »

Если параметр отрицательный, позиция отсчитывается от конца строки.

В этом примере slices часть строки от -12 до позиции -6:

Пример

var str = "Яблоко, Банан, Киви";
var res = str.slice(-12, -6);

Результатом будет res:

Банан
Редактор кода »

Если вы опускаете второй параметр, то метод slice будет вырезать часть строки:

Пример

var res = str.slice(7);
Редактор кода »

или, начиная с конца:

Пример

var res = str.slice(-12);
Редактор кода »

Негативные позиции не работают в Internet Explorer 8 и более ранних версиях.


Метод substring

substring аналогичен slice().

Разница в том, что substring не может принимать отрицательные индексы.

Пример

var str = "Яблоко, Банан, Киви";
var res = str.substring(7, 13);

Результат будет res:

Банан
Редактор кода »

Если опустить второй параметр, substring будет срезать остальную часть строки.


Метод substr()

Метод substr() аналогичен slice().

Разница в том, что второй параметр задает длину извлекаемой части.

Пример

var str = "Яблоко, Банан, Киви";
var res = str.substr(7, 6);

Результатом будет res:

Банан
Редактор кода »

Если первым параметром является отрицательной позицией, отсчитывается от конца строки.

Второй параметр не может быть отрицательным, так как определяет длину.

Если вы опускаете второй параметр, функцию substr() будет вырезать часть строки.


Замена строкового содержимого

Метод replace() заменяет указанное значение другим значением в строке:

Пример

str = "Пожалуйста, посетите веб-сайт Microsoft!";
var n = str.replace("Microsoft", "SchoolsW3");
Редактор кода »

Метод replace() не изменяет строку, на которую он вызывается. Возвращает новую строку.

По умолчанию replace() функция заменяет только первая пара:

Пример

str = "Пожалуйста посетите Microsoft!";
var n = str.replace("Microsoft", "SchoolsW3");
Редактор кода »

Чтобы заменить все совпадения, используйте регулярное выражение с /g флаг (глобальная пара):

Пример

str = "Пожалуйста посетите Microsoft!";
var n = str.replace(/Microsoft/g, "SchoolsW3");
Редактор кода »

По умолчанию функция replace() учитывает регистр. Писать MICROSOFT (с верхним регистром) не получится:

Пример

str = "Пожалуйста посетить Microsoft!";
var n = str.replace("MICROSOFT", "SchoolsW3");
Редактор кода »

На замену без учета регистра, используйте регулярное выражение с /i флаг (нечувствительный):

Пример

str = "Пожалуйста посетить Microsoft!";
var n = str.replace(/MICROSOFT/i, "SchoolsW3");
Редактор кода »

Вы узнаете больше о регулярных выражениях в главе Регулярные выражения JavaScript.


Преобразование в верхний и нижний регистры

Преобразование строки в верхний регистр с toUpperCase():

Пример

var text1 = "Привет Мир!";       // Строка
var text2 = text1.toUpperCase();  // текст2 есть текст1, преобразованный в верхний регистр
Редактор кода »

Строка преобразуется в нижнем регистре с toLowerCase():

Пример

var text1 = "Привет Мир!";       // Строка
var text2 = text1.toLowerCase();  // текст2 есть текст1 преобразован в нижний регистр
Редактор кода »

Метод concat()

Метод concat() соединяет две или более строки:

Пример

var text1 = "Привет";
var text2 = "Мир";
var text3 = text1.concat(" ", текст2);
Редактор кода »

Метод concat() может использоваться вместо оператора plus. Две строки делают то же самое:

Пример

var text = "Пример" + " " + "Мир!";
var text = "Привет".concat(" ", "Мир!");

Все строковые методы возвращают новую строку. Они не изменяют исходную строку.
Формально сказано: Строки неизменны: Строки не могут быть изменены, только заменить.


Извлечение строковых символов

Есть 2 безопасных метода извлечения строковых символов:

  • charAt(позиция)
  • charCodeAt(позиция)

Метод charAt

Метод charAt возвращает символ по заданному индексу (позиции) в строке:

Пример

var str = "ПРИВЕТ МИР";
str.charAt(0);            // Возвращает П
Редактор кода »

Метод charCodeAt

Метод charCodeAt возвращает юникод символа по указанному индексу в строке:

Пример

var str = "ПРИВЕТ МИР";

str.charCodeAt(0);         // Возвращает 1055
Редактор кода »

Доступ к строке как к массиву небезопасен

Возможно, вы видели такой код, получая доступ к строке как к массиву:

var str = "ПРИВЕТ МИР";

str[0];                   // Возвращает П

Есть небезопасный и непредсказуемый:

  • Это не работает во всех браузерах (в IE5, IE6, IE7)
  • Это делает строки выглядеть массивами (но они не)
  • str[0] = "П" не выдает ошибку (но не работает)

Если вы хотите прочитать строку как массив, сначала преобразуйте ее в массив.


Преобразование строки в массив

Строку можно преобразовать в массив с методом split():

Пример

var txt = "а,б,в,г,д,е";   // Строка
txt.split(",");          // Разделены запятыми
txt.split(" ");          // Разделены пробелами
txt.split("|");          // Разделены вертикальной чертой
Редактор кода »

Если разделитель не задан, возвращаемый массив будет содержать всю строку в индекс [0].

Если сепаратор (""), возвращенный массив будет массивом одиночных символов:

Пример

var txt = "Привет";       // Строка
txt.split("");           // Разделены на символы
Редактор кода »

Полный справочник строк

Для подробной информации перейдите на наш Справочник строк JavaScript.

Ссылка содержит описание и примеры всех строковых свойств и методов.


Проверьте себя с помощью упражнений!

Упражнение:

Используйте метод slice для возврата слова "бананы".

var txt = "Я могу есть бананы весь день";
var x = txt.slice(, );

Начните упражнения