Строка — один из основных типов данных в JS. Сегодня я расскажу тебе о типе данных String и встроенных строковых функциях в JavaScript.

В JavaScript, все текстовые данные — это строки. Не важно, состоит твой текст из одного или десяти тысяч символов. Все это — строки.

Начни Учить Full-Stack JavaScript СЕЙЧАС!

Длину JavaScript строки ты можешь получить из поля length.

const s = 'Hello, World!';
console.log(s.length);

Второй важный пункт стоит выделить отдельно:

Строки в JS неизменяемы

JavaScript строка не изменяется после создания. Функции вроде replace или slice, вернут тебе новую строку, а оригинальная строка останется без изменений.

Обзор встроенных функций String в JavaScript

Во всех примерах, я буду считать, что ты объявил строку s как константу со значением I am going to become a FULL STACK JS Dev with Coderslang.

const s = 'I am going to become a FULL STACK JS Dev with Coderslang';

Как проверить включает ли одна строка другую

Чтобы проверить вхождение одной строки в другую в JavaScript существует встроенная функция includes.

Она вернет true или false в зависимости от результата проверки.

console.log(s.includes('FULL STACK'));     // true
console.log(s.includes('cheeseburger'));   // false

То же самое можно сделать иначе. Чтобы узнать есть ли какое-то слово в строке, ты можешь использовать функции indexOf или lastIndexOf. Они обе проверяют, включает ли основная строка искомую строку и вернут индекс элемента с которого начинается совпадение. А если совпадений не будет, то они обе вернут -1.

console.log(s.indexOf('AWS'));             // -1
console.log(s.lastIndexOf('AWS'));         // -1

Отличие indexOf от lastIndexOf становится очевидным, когда в основной строке несколько вхождений искомой подстроки.

console.log(s.indexOf('g'));               // 5
console.log(s.lastIndexOf('g'));           // 55
  • indexOf ищет с начала строки
  • lastIndexOf ищет с конца строки

Это отличие определяет и результат.

В любом случае, ты можешь использовать indexOf и lastIndexOf чтобы определить, включает ли одна строка другую в JavaScript. Если результат отличается от -1, то да, совпадение найдено. Иначе — совпадений нет

Как определить начинается ли одна строка с другой строки

Чтобы узнать, стоит ли одна строка в начале другой строки в JavaScript существует функция startsWith. Она возвращает true если основная строка начинается со строки аргумента, иначе - false.

console.log(s.startsWith('I am'));             // true
console.log(s.startsWith('You are'));          // false

Как определить заканчивается ли одна строка другой строкой

Чтобы проверить вхождение одной строки в конце другой строки в JS существует функция endsWith. Она работает почти так же как и startsWith, но проверяет окончание строки, а не начало.

console.log(s.endsWith('Coderslang'));          // true
console.log(s.endsWith('Node.js'));             // false

Как удалить пробелы в начале и конце JavaScript строки

Чтобы удалить лишние пробелы в начале или конце JS строки ты можешь воспользоваться этими функциями:

  • trimStart - удаляет пробелы в начале строки
  • trimEnd - удаляет пробелы в конце строки
  • trim - удаляет пробелы в начале и конце строки

В нашей базовой строке не было пробелов, поэтому давай создадим новую для демонстрации.

const stringWithSpaces = '   I learn JS with Coderslang every day   ';
console.log(stringWithSpaces.trimStart());  //'I learn JS with Coderslang every day   '
console.log(stringWithSpaces.trimEnd());    //'   I learn JS with Coderslang every day'
console.log(stringWithSpaces.trim());       //'I learn JS with Coderslang every day'

Как перевести всю JS строку в ВЕРХНИЙ или нижний регистр

Чтобы получить строку идентичную данной, но со всеми буквами в верхнем регистре, ты можешь использовать функцию toUpperCase, а для нижнего регистра toLowerCase.

console.log(s.toUpperCase());  // I AM GOING TO BECOME A FULL STACK JS DEV WITH CODERSLANG
console.log(s.toLowerCase());  // i am going to become a full stack js dev with coderslang

Опять-таки, обрати внимание, что строка s не меняется, потому что все строки в JavaScript неизменяемы. Функции toUpperCase и toLowerCase возвращают новую строку, которая содержит все требуемые изменения.

Как заменить один символ на другой в JavaScript строке

Чтобы сделать замену символа в JS строке, ты можешь использовать функцию replace. Передай в нее две строки, и она заменит первое вхождения первой строки (в базовой строке) на вторую строку.

console.log(s.replace(' ', '!')) // I!am going to become a FULL STACK JS Dev with Coderslang
console.log(s.replace('I am', 'You are')) // You are going to become a FULL STACK JS Dev with Coderslang

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

Чтобы сделать замену всех символов (или подстрок), тебе нужна функция replaceAll.

console.log(s.replaceAll(' ', '!')) // I!am!going!to!become!a!FULL!STACK!JS!Dev!with!Coderslang

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

TypeError: s.replaceAll is not a function

Если ты получил такую ошибку, то функция replaceAll не поддерживается твоим JavaScript окружением и ты можешь использовать регулярное выражение с флагом g. Так обычный replace сработает как replaceAll.

const regex = new RegExp(' ', 'g');
const s = 'I am going to become a FULL STACK JS Dev with Coderslang';

console.log(s.replace(regex, '!')); // I!am!going!to!become!a!FULL!STACK!JS!Dev!with!Coderslang