Как на языке javascript преобразовать массив в строку и обратно: в примерах с объяснениями

Приветствую всех читателей текущей публикации, а также моих любимых подписчиков. Сегодня поговорим об интересных средствах, которые позволят создавать не только массивы, а и преобразовывать в javascript массив в строку.

Это очень полезные знания и востребованные механизмы, благодаря которым буквально одним набранным словом на клавиатуре любой массив трансформируется в строчное представление. Как и обычно, я подробно изложу материал на эту тему, расскажу, в каких случаях такие инструменты необходимы, а также приведу контрольные примеры. Приступим же!

Основы создания массивов

Для начала разберем, что такое массив и как его создать.

Массив – это структурированный способ хранения данных, где каждый элемент расположен в своей ячейке под своим порядковым номером.

Для создания пустого массива используется вот такая конструкция:

var array = [];

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

1
2
3
4
5
6
7
8
9

var product = [];
product[0]="Кофе"
product[1]="Сахар"
product[2]="Зефир"
product[3]="Яблоки"
product[4]="Абрикосы"
for(var k in product){
     alert( product[k])
     }

А вот так второй. Как видите этим способом быстрее и проще сделать заполненный массив.

1
2
3
4

var product = ["Кофе", "Сахар", "Зефир", "Яблоки", "Абрикосы"];
for(var k in product){
     alert( product[k])
     }

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

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

1
2
3
4
5
6

var bigArray = [
  ['f', 'b', 'c'],
  ['d', 'e', 'f'],
  ['g', 'h', 'i']
];
alert( bigArray[0][2] ); // вывод символа «c»

Вот теперь после освоения фундаментальных знаний создания массивов перейдем с разбору встроенных методов, с помощью которых можно преобразовывать массив в строку и обратно.

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

Для того чтобы коллекцию данных преобразовать в строку был создан метод join. Он принимает только один аргумент, в котором разработчик указывает внешний вид разделителя. Итак, сначала разберите пример с разделителем.

var bigArray = ['a', 'b', 'c', 'd'];

alert (bigArray.join (', '));

В этом случае в ответе будет: «a, b, c, d».

А теперь обратите внимание на такой вариант обработки.

var bigArray = ['a', 'b', 'c', 'd'];

alert (bigArray.join ());

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

Благодаря данному методу можно быстро создавать строчные элементы и видоизменять обрабатываемую информацию.

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

Теперь хочу рассказать вам о другом инструменте, который действует с точностью наоборот. Познакомьтесь с методом split. Он разбивает строку по указанному разделителю и формирует из полученных частей массив. Сразу перейду к примеру, который, кстати, не сильно расходится с заданиями из реальных проектов.

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

1
2
3
4
5

var users = 'Петр, Александр, Ефим, Игорь';
var user = users.split(', ');
for (var i = 0; i < user.length; i++) {
  alert( user[i] + ", Вам пришло новое сообщение.");
}

Альтернативные варианты

Помимо стандартных методов в JavaScript для аналогичного рода преобразований используется json – текстовый формат обмена информацией. Он был создан на основе js и в основном используется для передачи данных между сервером и клиентом.

Так, например, если клиент ввел какую-то информацию, то ее преобразуют в json-формат и в таком виде передают на сторону сервера, где она и обрабатывается.

Основными методами в json являются stringify и parse. Для того чтобы информация была верно обработана, ее нужно представлять по всем правилам данного формата.

Строки обязательно должны быть в двойных кавычках. При этом название объектов и их значения обрамляются своими кавычками: «имяЭлемента»: «значение». Объекты всегда оформляются в фигурные скобки, а массивы – в квадратные.

Перейдем к примеру. Пользователь ввел информацию о себе и на сервер она пришла в виде цельной строки, которую надо разбить и систематизировать.

1
2
3
4

var user = '{ "name": "Иван", "age": 26, "education": ["school №1", "University"]}';
user = JSON.parse(user);
alert( user.name );
alert( user.education[1] );

Если вы хотите вернуться назад к строке в формате json, то допишите после alert ( user.education[1] ); вот эти команды:

var str = JSON.stringify (user);

alert ( str );

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

А я с вами прощаюсь. Радуйте меня своими заявками на подписку и приглашайте друзей в нашу дружную компанию. Удачи и пока-пока!

С уважением, Роман Чуешов