базовый курс

ГРУППА КУРСА

Строки

Перед изучением работы со строками ещё раз напомню, что строка всегда пишется в кавычках. Для примера создадим переменную, назовём её srt и присвоим ей строку. В дальнейшем мы будем работать с ней.

+
9
var str = 'Эта переменная содержит строку';

В JavaScript строки - это объекты. Эти объекты имеют стандартные свойства и методы, с помощью которых можно получить о строке определённую информацию и произвести с ней какие-то действия.

Длина строки

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

строка.length

Узнаем длину строки, и выведем её в консоль:

10
console.log(str.length);

При определении длины строки нужно учитывать, что пробелы и различные знаки - это тоже часть строки. Каждый из них является отдельным символом. Запустите страницу и откройте консоль браузера. В ней должно быть написано число 30, если Вы создали точно такую же строку, как в примере.

Сложение строк

Строки можно складывать. В результате сложения получается строка состоящая из складываемых строк. Пример:

11
var newstr='Строка '+'из нескольких '+'слов';

При сложении строк нужно обеспечить наличие пробелов между словами. Если складываются переменные, то можно между ними добавить строку, состоящую из пробела.

ВАЖНО: В коде скрипта нельзя делать перевод строки внутри строк. Если нужно написать длинную строку, то её можно разделить на несколько строк. Пример:

12
13
14
var big='Длинный текст, '+
'занимающий в коде скрипта '+
'несколько строк';

Получение подстроки

Подстрока - это часть строки. Это может быть один символ или вся строка или любая другая часть строки. Она может начинаться и заканчиваться в середине слова. Подстрока - это тоже строка. Её можно записать в какую-то переменную и работать с ней.

Самый простой метод для получения подстроки: charAt(). Он возвращает один символ с указанным порядковым номером. Учитывайте, что счёт символов начинается не с 1, а с 0.

строка.charAt(порядковый номер символа)

Для примера, найдём восьмой символ нашей строки:

12
console.log(str.charAt(8));

Есть ещё один способ получить символ по порядковому номеру. Строка рассматривается не только как объект, но и как массив. Символы - это элементы массива. Получив конкретный элемент массива, мы узнаём символ, который в нём содержится. Найдём тот же символ, который мы находили с помощью метода charAt(), но указанным способом:

13
console.log(str[8]);

Метод slice() возвращает подстроку, которая начинается с одного указанного символа и заканчивается другим указанным символом.

строка.slice (начальный символ, конечный символ)

Параметры:

начальный символ - номер символа, с которого начинается подстрока.

конечный символ - необязательный параметр. Номер символа, на котором заканчивается подстрока. Если не указать, то метод вернёт подстроку до конца строки.

Сам конечный символ не входит в подстроку. То есть, если указать 15 символ, то подстрока будет до 14 символа.

Пример:

14
15
console.log(str.slice(4,23));
console.log(str.slice(4));

Если в параметрах указать отрицательные значения, то отсчёт будет производиться не с начала строки, а с конца. Это можно делать как для первого параметра так и для второго. Это очень удобно при работе с большими строками. Пример:

16
17
console.log(str.slice(-6));
console.log(str.slice(4, -2));

Метод substr() также возвращает подстроку, начиная с указанного символа. Но второй параметр - это длинна подстроки.

строка.substr (начальный символ, длинна)

Параметры:

начальный символ - номер символа, с которого начинается подстрока.

длинна - Необязательный параметр. Длинна подстроки. Если не указать, то берётся подстрока до конца строки

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

18
console.log(str.substr(4, 10));

Существует метод substring(), который работает точно так же, как slice(). Отличие его в том, что он не остчитывает символы с конца строки.

Метод indexOf() осуществляет поиск подстроки и возвращает номер первого символа найденной подстроки. Если она не найдена, то возвращает число -1.

строка.indexOf (подстрока, начало поиска)

Параметры:

подстрока - искомая подстрока.

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

Пример:

22
23
24
var word = 'Предложение состоит из нескольких слов';
console.log(word.indexOf('нескольких'));
console.log(newstr.indexOf('текст'));

В первом вызове метод indexOf() вернул число 23. Это значит, что подстрока начинается с 23 символа.

В во втором вызове медод вернул число -1, потому что слова "текст" нет в переменной.

Метод indexOf() учитывает регистр символов. Если попытаться найти подстроку "Слов", то метод её не найдёт.

Если подстрока встречается несколько раз, то indexOf() найдёт первую. Чтобы найти следующую такую подстроку нужно запустить метод ещё раз и начинать поиск не с начала а с символа, следующего за прошлой подстрокой. Таким образом можно найти все вхождения подстроки, если запустить метод indexOf() в цикле. Этот цикл должен заканчиваться, когда метод вернёт -1.

Есть метод lastIndexOf, который работает так же как indexOf(), только производит поиск с конца строки.

Замена подстроки

Метод replace() находит подстроку и заменяет её на другую. Он возвращает новую строку, а исходная остаётся неизменной.

строка.replace (заменяемая подстрока, новая подстрока)

Пример:

22
23
24
var inf = 'На улице шёл снег';
var changeInf = inf.replace('снег', 'дождь');
console.log(changeInf);

В первом параметре метода replace() можно написать регулярное выражение. При этом метод работает по-другому. Главное отличие состоит в количестве замен. Если указана подстрока, то будет заменено только первое совпадение. А при регулярном выражении можно заменить все совпадения. В этом учебнике есть глава "Регулярные выражения", где Вы можете научиться использовать эту возможность.

В новую подстроку можно добавить старую подстроку. Есть и другие варианты вставки. Для этого во втором параметре метода replace() нужно написать специальный код. Этот код указывает, что нужно вставить. Варианты перечислены в таблице.

Код Значение
$& Заменяемая подстрока
$` Весь текст до заменяемой подстроки
$' Весь текст после заменяемой подстроки
$1, $2, и т.д. Части паттерна, содержащиеся в скобках, в регулярном выражении

Код может находиться в любой части текста во втором парамете replace(). Знак $ является для этого метода спецсимволом. Для вставки самого этого знака нужно написать так: $$.

Пример:

25
console.log(inf.replace('снег', 'небольшой $&'));

В данном примере от вставки мало пользы, можно просто написать "небольшой снег". Но с регулярными выражениями она бывает очень полезна.

Коды символов

В JavaScript применяется кодировка Unicode. Каждый символ имеет свой код в виде числа. Для букв коды идут по порядку в соответствии с алфавитом. У буквы "a" код 97, у буквы "b" - 98, у буквы "с" - 99, у буквы "d" - 100 и так далее.

Метод charCodeAt() возвращает код символа.

строка.charCodeAt (символ)

Параметры:

символ - порядковый номер символа в строке.

Выведем код буквы n:

30
console.log('n'.charCodeAt(0));

Русские буквы также имеют свой код.

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

Сравнение чисел выглядитдля нас привычным.

2 < 10

Но строки тоже можно сравнивать. У них сравниваются коды первых символов. Берётся первый символ одной строки и первый символ другой строки. У какого символа код больше, та и строка больше. Если первые символы одинаковые, то берутся вторые. Если и они одинаковые, то берутся следующие. И так сравнение сдвигается, пока не будут разные символы. Если все символы обеих строк одинаковые, то строки равны. Сравним две строки:

32
console.log('an'<'fs');

Данное сравнение вернёт true, потому что код буквы "a" меньше кода буквы "f", ведь буква "a" идёт раньше в алфавите. Коды заглавных букв меньше кодов строчных букв. Поэтому любая заглавная буква меньше любой строчной. Для русских букв это правило тоже работает. Строки, состоящие из цифр сравниваются по правилам строк, а не по правилам чисел. То есть, сравниваются первые символы, а не числа целиком. Попробуйте разные варианты сравнений, посмотрите какой будет результат сравнения.