Что такое формат JSON

Разработка #IDE #Разбор #JavaScript За представление структурированных данных на основе синтаксиса JavaScript отвечает стандартный текстовый формат под названием JSON,...

Максимальная производительность 1С-Битрикс: Настройка виртуальной машины

Системы управления контентом (CMS) стали неотъемлемой частью современных веб-проектов, предоставляя множество возможностей для разработки и управления сайтами. 1С-Битрикс —...

Google представил нейросеть Gemini 1.5 – за раз она может обработать 11-часовое аудио

Новости #Google #Боты #Нейросети #Обновления Реклама. ООО «ТаймВэб». erid: LjN8KZYK5 Два месяца назад компания Google анонсировала новую языковую модель Gemini,...

Как ускорить ответы клиентам с помощью чат-бота в VK. Пошаговая инструкция

Разработка #ВКонтакте #Боты #JavaScript Нередко бывает так, что в вашу группу во «Вконтакте» в один момент написали много...

Стоит ли делать одностраничный сайт? За и против

Введение Одностраничники – тренд, продолжающий набирать популярность. Впрочем, и трендом назвать это сложно – тенденция делать одностраничные сайты...

Списки в Python и методы работы с ними

Разработка #Python Списки в Python – упорядоченный изменяемый набор объектов произвольных типов, пронумерованных от 0. Они используются для...

Когда и зачем нужно проектирование сайта: основные этапы

Разработка #Веб-дизайн #Контент #Оптимизация Изучаем такой процесс, как проектирование сайта. Разбираем каждую стадию – от разработки базовых концепций...

Как сделать дейлики эффективными: интервью с Настей Ткаченко

Мнение рынка #Менеджмент #Разбор #Программы #Мессенджеры В гостях у Комьюнити побывала Настя Ткаченко, проджект-менеджер конструктора сайтов Craftum. У...

Drupal: полный обзор популярной CMS

Разработка #Обзор #Drupal #Оптимизация CMS Drupal существует уже более 17 лет – разработка платформы началась в 2000 году...

Создание email рассылок на Joomla

Создание почтовых рассылок – это эффективный способ рекламы и привлечения внимания к своему сайту. Я уже рассказывала о...

Обзор VestaCP

VestaCP – одна из самых популярных, простых и удобных панелей для управления сайтами. К тому же она абсолютно...

Создаем калькулятор-конвертер на базе React. Часть 11: Советы для начинающих React-разработчиков

Разработка #Фреймворки #JavaScript Разработка приложения закончена, наш калькулятор уже на серверах Timeweb. Осталось обсудить пару мелочей.  Предыдущий материал:...

Обзор BrainyCP

BrainyCP – это новая панель управления сервером, о которой вы, вероятно, не слышали до этого времени. В этой...

В Windows 11 добавится поддержка USB 4 2.0 со скоростью передачи данных до 80 Гбит/с

Новости #Обновления #Windows Реклама. ООО «ТаймВэб». erid: LjN8K8PQJ Корпорация Microsoft начала распространять пакет функциональных обновлений KB5034848 для Windows 11...

Как легально увеличить лайки в Ютубе?

Лайки в Youtube и легальные способы их увеличить. Чего не стоит делать при накрутке реакций, и как сделать...

Обзор фреймворка Yii

Общее Yii – это объектно-ориентированный фреймворк, написанный на PHP. Если вы не знаете, что такое фреймворк и чем...

Лучшие сайты для изучения программирования

Разработка #Сервисы #Подборка #IDE #Карьера Рассказываем о лучших сайтах для изучения программирования.  Для удобства все ресурсы поделены на...

Создаем калькулятор-конвертер на базе React. Часть 8: Конвертер валют и собственный парсер данных

Разработка #Фреймворки #JavaScript Эпопея с калькулятором продолжается. В этот раз мы добавим в него конвертер валют, который в реальном...

Создаем бесплатный callback-виджет с SMS и Telegram-оповещением

Разработка #Telegram #JavaScript #HTML/CSS В этой статье мы пошагово создадим виджет обратного звонка с красивой минималистичной анимацией и...

Лучшие хостинги серверов Minecraft

Мнение рынка #Хостинг #Игры #Подборка Реклама. ООО «ТаймВэб». erid: LjN8KWY7s Всегда хотели запустить собственный сервер игры, но не...

Работа со строками в JavaScript

Строка в JavaScript – это неизменяемая, упорядоченная последовательность 16-битных значений, каждое из которых представляет собой символ Unicode. Для представления символов Unicode в JavaScript используется кодировка UTF-16. Каждый символ в строке определяется по номеру индекса, как и элементы массивов.

В данной статье мы разберем основные операции со строками, их индексацию и свойства.

Виды строк в JavaScript

В JavaScript есть два вида строк: примитивные и объекты String. Давайте инициализируем оба типа строк и выведем их тип с помощью typeof:

//Инициализация примитивной строки
const primitiveString = ‘Hello world! Im fine’;

//Инициализация string object
const objectString = new String(primitiveString);

console.log(typeof primitiveString); // выведет 'string'
console.log(typeof objectString);  // выведет 'object'

Как правило, на практике используется примитивный тип строк, так как JavaScript может использовать свойства и методы объекта String без преобразования примитивной строки в object-строку.

Нахождение длины строк

С помощью свойства length мы можем получить количество символов в строках. Давайте найдем длину примитивной строки:

//Инициализация примитивной строки
const primitiveString = ‘Hello world! Im fine’;

console.log(primitiveString.length); // выведет число 20

Индексация символов в строке

Каждому символу в строке соответствует порядковый номер (начиная с 0). Это работает и с элементами в массивах. Давайте посмотрим, как индексируются символы в строках:

//Инициализация примитивной строки
const primitiveString = ‘Hello world! Im fine’;

console.log(primitiveString[0]); // выведет H
console.log(primitiveString[19]); // выведет e
console.log(primitiveString[5]); // выведет пробел

Также можно использовать команду charAt(), передавая в качестве параметра индекс символа, который нам нужно получить:

console.log(primitiveString.charAt(0)); // выведет H
console.log(primitiveString.charAt(19)); // выведет e
console.log(primitiveString.charAt(5)); // выведет пробел

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

//Инициализация примитивной строки
const primitiveString = ‘Hello world! Im fine’;
console.log(primitiveString.slice(6, 11)); // выведет world

Если не указывать второй параметр в качестве ограничения промежутка индексов, то мы получим все символы (с первого параметра до конца строки):

console.log(primitiveString.slice(13)); // выведет Im fine

Нахождение индекса символа

Теперь давайте найдем индекс символа или определим его присутствие в строке. Для этого мы будем использовать метод indexOf:

//Инициализация примитивной строки
const primitiveString = ‘Hello world! Im fine’;

console.log(primitiveString.indexOf(‘H’)); // выведет 0
console.log(primitiveString.indexOf(‘o’)); // выведет 4
console.log(primitiveString.indexOf(‘x’)); // выведет -1

indexOf возвращает -1, если символа, передаваемого в параметре, нет в строке. Если в строке есть несколько искомых символов, то метод возвращает индекс первого из них.

Для того чтобы найти индекс последнего искомого символа, можем использовать метод lastIndexOf:

console.log(primitiveString.lastIndexOf(‘o’)); // выведет 7

Используя эти два метода, мы можем искать сразу несколько символов. В этом случае мы получим индекс первого из них:

//Инициализация примитивной строки
const primitiveString = ‘Hello world! Im fine’;

console.log(primitiveString.indexOf(‘world’)); // выведет 6
Вывод: методы indexOf и lastIndexOf возвращают нам индекс по строке в параметре, а charAt и slice получают сами строки по их индексу.

Разбиение строк

Для того чтобы разбить строку на элементы массива по определенным символам, используем метод split. Давайте разделим строку пробелами:

//Инициализация примитивной строки
const primitiveString = ‘Hello world! Im fine’;

console.log(primitiveString.split(' ')); // выведет [ 'Hello', 'world!', 'Im', 'fine' ]

С помощью данного метода мы получаем отдельные слова в строках.

Также после разбиения строки мы можем выводить отдельные элементы полученного массива:

//Инициализация примитивной строки
const primitiveString = ‘Hello world! Im fine’;

a = primitiveString.split(' ')
console.log(a[0])

Поиск и замена строковых значений

Давайте разберем метод replace. Он позволяет находить строковые значения и заменять их на нужные нам. Первым параметром передаем искомое значение, а вторым то, что нужно поставить взамен первого:

//Инициализация примитивной строки
const primitiveString = ‘Hello world! Im fine’;
console.log(primitiveString.replace(‘world’, ‘people’)) //выведет Hello people! Im fine

Изменение регистра строки

Методы toLowerCase и toUpperCase помогут нам изменить регистр строк. Они пригодятся при использовании indexOf и lastIndexOf, так как в строке могут быть символы разных регистров. Рассмотрим работу методов на примере:

//Инициализация примитивной строки
const primitiveString = ‘Hello world! Im fine’;

console.log(primitiveString.toLowerCase()); // выведет hello world! im fine
console.log(primitiveString.toUpperCase()); // выведет HELLO WORLD! IM FINE

Методы не имеют параметров и не изменяют оригинальную строку.

Отсечение лишних пробелов

Если мы получаем строку с лишними пробелами в начале и конце, то их можно убрать с помощью метода trim:

//Инициализация примитивной строки
const primitiveString = ‘         Hello world! Im fine            ’;

console.log(primitiveString.trim()) //выведет Hello world! Im fine

Вывод

Мы научились пользоваться методами для работы со строками: искать символы по индексу, изменять регистр, разбивать слова и т.д.

Надеюсь, эта статья была полезной для вас. Удачи!

Межтекстовые Отзывы
Посмотреть все комментарии
guest