Как разбить строку на массив js
Перейти к содержимому

Как разбить строку на массив js

  • автор:

split()

split() — метод разбивает строку на массив строк используя для этого заданный разделитель.

Синтаксис

 str.split(separator, limit) 

separator — условие по которому будет разделена строка. В качестве разделителя может выступать строковый литерал или регулярное выражение. Также можно использовать специальные символы, например перевод строки, кавычки или юникод. Параметр является необязательным.

limit — количество элементов, которые должен вернуть метод. Параметр необязательный, если пропустить в массив попадут все подстроки. Если задать, то split() все-равно разделит всю строку по разделителям, но возвратит только указанное количество.

При нахождении разделителя метод удаляет separator и возвращает подстроку.

Если задать в качестве разделителя пустое значение » , тогда каждый символ строки запишется в отдельный элемент массива.

Если при записи split() пропустить separator , то метод вернет массив с одним элементом, который будет содержать всю строку.

Разбить строку по разделителю

 let mySkills = 'Native JavaScript-React-HTML-CSS' mySkills = mySkills.split('-', 2) console.log(mySkills) 

Результатом будет массив с двумя элементами: Native JavaScript и React

Разбить строку на символы

 let myDream = 'Хочу стать frontend разработчиком' let allSymbols = myDream.split('') for (let n = 0; n

Здесь мы разделили строку myDream с помощью split(») , задав в качестве separator пустое значение. Все это записали в allSymbols — теперь там массив, где каждый элемент это символ нашей строки. Далее используя цикл for вывели в console все символы — каждый с новой строки.

Разбить строку используя регулярное выражение

 let topProgramLang = 'JavaScript-Python-Java-C++,PHP,C,C#' topProgramLang = topProgramLang.split(/,|-/) console.log(topProgramLang) 

/,|-/ в этом регулярном выражении мы указали разделители, которые необходимо учесть — запятая и дефис. В итоге получаем массив, где перечислены все языки программирования указанные изначально.

Вывести символы строки в обратном порядке

 let importanceSkills = 'React,TypeScript,CSS,HTML,JavaScript' importanceSkills = importanceSkills.split(',') importanceSkills = importanceSkills.reverse() importanceSkills = importanceSkills.join(', ') console.log(importanceSkills) 

Для того, чтобы решить эту задачу нам понадобятся еще два метода reverse() и join() . Первый перевернет массив, а второй объединит элементы в строку. В итоге получим в console JavaScript, HTML, CSS, TypeScript, React

Сумма элементов массива

 let numForSum = '1,2,5,10,392,19,3,10' numForSum = numForSum.split(',') let sumNum = 0 for (let n = 0; n < numForSum.length; n++) < sumNum += +(numForSum[n]) >console.log(sumNum) 

Выполняя подобные задачи стоит помнить, что метод split() записывает данные в массив в формате строки, поэтому перед тем, как складывать элементы необходимо сначала привести их к числу. Здесь это сделано с помощью + перед выражением. Также можно воспользоваться функцией Number(numForSum[n]) .

Итого

1. Метод split() делит строку по разделителю и записывает все в массив.

2. В получившемся массиве, элементы хранятся в формате текст.

3. В параметрах метода, первым свойством задается разделитель, вторым ограничение на вывод элементов. Оба параметра не обязательны.

Skypro — научим с нуля

Метод split

Метод split разбивает строки в массив по указанному в первом параметре разделителю. Если он не задан — вернется вся строка. Если он задан как пустые кавычки, то каждый символ строки попадет в отдельный элемент массива. Вторым необязательным параметром можно указать максимальное количество элементов в получившемся массиве.

Синтаксис

строка.split([разделитель], [максимальное количество элементов]);

Пример

Пусть дана некоторая строка с дефисами. Давайте разобьем эту строку в массив по разделителю ‘-‘ :

let str = ‘ab-cd-ef’; let arr = str.split(‘-‘); console.log(arr);

Результат выполнения кода:

Пример

Давайте опять разобьем строку по разделителю ‘-‘ , однако вторым параметром укажем максимальное количество элементов в получившемся массиве, например, 2 . В этом случае в массив запишется только 2 элемента:

let str = ‘ab-cd-ef’; let arr = str.split(‘-‘, 2); console.log(arr);

Результат выполнения кода:

Пример

Давайте каждый символ строки запишем в отдельный элемент массива:

let str = ‘abcde’; let arr = str.split(»); console.log(arr);

Результат выполнения кода:

Пример

Давайте первые 3 символа строки запишем в отдельные элементы массива:

let str = ‘abcde’; let arr = str.split(», 3); console.log(arr);

Результат выполнения кода:

Пример

Давайте с помощью split разобьем строку с числами. Обратите внимание на то, что в результате получится массив строк, а не массив чисел:

let str = ‘12345’; let arr = str.split(»); console.log(arr);

Результат выполнения кода:

Пример . Применение

Давайте перевернем символы строки в обратном порядке. Для этого разобьем строку в массив с помощью split по разделителю » (это разместит каждый символ строки в отдельный элемент массива), перевернем этот массив с помощью reverse и затем сольем перевернутый массив обратно с помощью join :

let str = ‘123456789’; let arr1 = str.split(»); let arr2 = arr1.reverse(); let res = arr2.join(»); console.log(res);

Результат выполнения кода:

Пример . Применение

Упростим решение предыдущей задачи — сольем все команды в цепочку:

let str = ‘123456789’; let res = str.split(»).reverse().join(»); console.log(res);

Результат выполнения кода:

Пример . Применение

Дана строка с цифрами. Найдем сумму цифр из этой строки. Для этого разобьем строку в массив, а затем переберем этот массив и найдем его сумму. Нас ждет подвох: split возвращает строки, поэтому при суммировании преобразуем эти цифры-строки в настоящие числа с помощью Number :

let str = ‘12345’; let arr = str.split(»); let sum = 0; for (let i = 0; i < arr.length; i++) < sum += Number(arr[i]); >console.log(sum);

Результат выполнения кода:

Пример . Применение

Дано число. Давайте запишем каждую цифру этого числа в отдельный элемент массива. Тут есть подвох — split применяется только к строкам, а у нас число. Преобразуем вначале число к строке с помощью String , а затем применим split :

let num = 12345; let str = String(num); let arr = str.split(»); console.log(arr);

Результат выполнения кода:

Смотрите также

  • метод join ,
    который сливает элементы массива в строку
  • метод split ,
    который разбивает строку по регулярке
  • метод reverse ,
    который изменяет порядок элементов в массиве на обратный
  • свойство length ,
    которое позволяет узнать длину строки

Как преобразовать строку в массив js?

Помимо вышеупомянутых способов преобразования строки в массив, есть ещё один метод, которым можно воспользоваться.
Это Array.from():
Данный метод работает очень просто. Вся его работа описана в примере ниже:

const stringOfNumbers = '1234'; const numbers = Array.from(stringOfNumbers); console.log(numbers); // => ['1', '2', '3', '4'] - элементы массива - строки 

У данного метода есть особенность, которая может показаться недостатком.
Если в строке между словами, буквами или цифрами будут знаки препинания либо пробелы, они также станут элементами массива.

const stringOfNumbers = '1 2.3,4'; const numbers = Array.from(stringOfNumbers); console.log(numbers); // => ['1', ' ', '2', '.', '3', ',', '4'] 

27 октября 2021

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

const str = 'мама мыла раму'; // исходная строка const result = str.split(' '); // используем метод split с указанием разделителя // ['мама', 'мыла', 'раму'] 

В примере выше использовался метод split для разделения строк на элементы по определенному разделителю. Если указать в качестве разделителя пустую строку, то на выходе получим массив из символов:

// вызываем метод на строке и выводим результат console.log('test'.split('')); // => ['t', 'e', 's', 't'] 

Также строки имеют некоторые свойства массивов: их можно перебирать в циклах а также можно обращаться к символам через индексы:

// перебираем строку в цикле for (const symbol of 'test')  console.log(symbol); > // обращение по индексу console.log('test'[1]); // => 'e' 

Есть также быстрый способ разбить строку на символы с использованием рест-оператора:

const result = [. 'hello']; // ['h', 'e', 'l', 'l', 'o']; result.forEach((item) => console.log(item)); 

String.prototype.split()

Метод split() разбивает объект String на массив строк путём разделения строки указанной подстрокой.

Синтаксис

str.split([separator[, limit]])

Параметры

Необязательный параметр. Указывает символы, используемые в качестве разделителя внутри строки. Параметр separator может быть как строкой, так и регулярным выражением. Если параметр опущен, возвращённый массив будет содержать один элемент со всей строкой. Если параметр равен пустой строке, строка str будет преобразована в массив символов.

Необязательный параметр. Целое число, определяющее ограничение на количество найденных подстрок. Метод split() всё равно разделяет строку на каждом сопоставлении с разделителем separator , но обрезает возвращаемый массив так, чтобы он содержал не более limit элементов.

Описание

Метод split() возвращает новый массив.

Если разделитель separator найден, он удаляется из строки, а подстроки возвращаются в массиве. Если разделитель опущен, массив будет содержать только один элемент, состоящий из всей строки. Если разделитель является пустой строкой, строка str будет преобразована в массив символов.

Если разделитель является регулярным выражением, содержащим подгруппы, то каждый раз при сопоставлении с разделителем, результаты (включая те, что не определены) захвата подгруппы будут помещаться внутрь выходного массива. Однако, не все браузеры поддерживают эту возможность.

Примечание: Если строка является пустой строкой, метод split() вернёт массив, состоящий из одной пустой строки, а не пустой массив.

Примеры

Пример: использование метода split()

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

function splitString(stringToSplit, separator)  var arrayOfStrings = stringToSplit.split(separator); console.log('Оригинальная строка: "' + stringToSplit + '"'); console.log('Разделитель: "' + separator + '"'); console.log( "Массив содержит " + arrayOfStrings.length + " элементов: " + arrayOfStrings.join(" / "), ); > // Строчка из «Бури» Шекспира. Перевод Михаила Донского. var tempestString = "И как хорош тот новый мир, где есть такие люди!"; var monthString = "Янв,Фев,Мар,Апр,Май,Июн,Июл,Авг,Сен,Окт,Ноя,Дек"; var space = " "; var comma = ","; splitString(tempestString, space); splitString(tempestString); splitString(monthString, comma); 

Пример сгенерирует следующий вывод:

Оригинальная строка: "И как хорош тот новый мир, где есть такие люди!" Разделитель: " " Массив содержит 10 элементов: И / как / хорош / тот / новый / мир, / где / есть / такие / люди! Оригинальная строка: "И как хорош тот новый мир, где есть такие люди!" Разделитель: "undefined" Массив содержит 1 элементов: И как хорош тот новый мир, где есть такие люди! Оригинальная строка: "Янв,Фев,Мар,Апр,Май,Июн,Июл,Авг,Сен,Окт,Ноя,Дек" Разделитель: "," Массив содержит 12 элементов: Янв / Фев / Мар / Апр / Май / Июн / Июл / Авг / Сен / Окт / Ноя / Дек

Пример: удаление пробелов из строки

В следующем примере метод split() ищет 0 или более пробелов, за которыми следует точка с запятой, за которой снова следуют 0 или более пробелов, и, если этот шаблон найден, удаляет пробелы из строки. Переменная nameList является массивом, возвращённым в результате работы метода split() .

var names = "Гарри Трамп ;Фрэд Барни; Хелен Ригби ; Билл Абель ;Крис Ханд "; console.log(names); var re = /\s*;\s*/; var nameList = names.split(re); console.log(nameList); 

Пример напечатает две строки; на первой строке напечатана оригинальная строчка, а на второй — получившийся массив.

Гарри Трамп ;Фред Барни; Хелен Ригби ; Билл Абель ;Крис Ханд Гарри Трамп,Фред Барни,Хелен Ригби,Билл Абель,Крис Ханд

Пример: возврат ограниченного числа подстрок

В следующем примере метод split() ищет 0 или более пробелов в строке и возвращает первые три найденных подстроки.

var myString = "Привет, мир. Как дела?"; var splits = myString.split(" ", 3); console.log(splits); 

Вывод скрипта будет следующим:

,,мир.,Как 

Пример: захват подгрупп

Если параметр separator содержит подгруппы, сопоставившиеся результаты также будут присутствовать в возвращённом массиве.

var myString = "Привет 1 мир. Предложение номер 2."; var splits = myString.split(/(\d)/); console.log(splits); 

Вывод скрипта будет следующим:

,1, мир. Предложение номер ,2,. 

Пример: обращение строки при помощи метода split()

var str = "фывапролд"; var strReverse = str.split("").reverse().join(""); // 'длорпавыф' // split() возвращает массив, к которому применяются методы reverse() и join() 

Бонус: используя оператор === (en-US), можно проверить, являлась ли строка палиндромом.

Спецификации

Specification
ECMAScript Language Specification
# sec-string.prototype.split

Совместимость с браузерами

BCD tables only load in the browser

Смотрите также

  • String.prototype.charAt()
  • String.prototype.indexOf()
  • String.prototype.lastIndexOf()
  • Array.prototype.join()

Found a content problem with this page?

  • Edit the page on GitHub.
  • Report the content issue.
  • View the source on GitHub.

This page was last modified on 7 авг. 2023 г. by MDN contributors.

Your blueprint for a better internet.

MDN

Support

  • Product help
  • Report an issue

Our communities

Developers

  • Web Technologies
  • Learn Web Development
  • MDN Plus
  • Hacks Blog
  • Website Privacy Notice
  • Cookies
  • Legal
  • Community Participation Guidelines

Visit Mozilla Corporation’s not-for-profit parent, the Mozilla Foundation.
Portions of this content are ©1998– 2024 by individual mozilla.org contributors. Content available under a Creative Commons license.

Добавить комментарий

Ваш адрес email не будет опубликован. Обязательные поля помечены *