Как в js преобразовать массив в json
Чтобы преобразовать массив в строку JSON , можно воспользоваться методом JSON.stringify() :
[1,2,3,4,5]
23 октября 2022
В дополнение к ответу выше хочется упомянуть о дополнительных возможностях метода JSON.stringify():
Перейдем сразу к примеру:
//Дан массив объектов с вложенной структурой const users = [ name: 'Karina', password: 'qwerty', info: age: 25, children: true, >, >, name: 'Mark', login: 'alice', info: age: 27, children: false, >, >, ]; console.log(JSON.stringify(users)); //Если воспользоваться стандартным способом, то вывод в консоли будет следующий: // => [>, //>] Согласитесь, что этот способ не очень читаемый.
Если мы передадим третьим параметром число или символ, то он сможет использоваться
для управления интервалом в конечной строке.
console.log(JSON.stringify(users, null, 2)); // => //[ // // "name": "Karina", // "password": "qwerty", // "info": // "age": 25, // "children": true // > // >, // // "name": "Mark", // "login": "alice", // "info": // "age": 27, // "children": false // > // > //] Теперь вывод в консоли стал более читаем. Также третьим параметром можно передать и символы.
Посмотрим, как это будет выглядеть:
console.log(JSON.stringify(users, null, '-/-')); // => //[ //-/- //-/--/-"name": "Karina", //-/--/-"password": "qwerty", //-/--/-"info": //-/--/--/-"age": 25, //-/--/--/-"children": true //-/--/-> //-/->, //-/- //-/--/-"name": "Mark", //-/--/-"login": "alice", //-/--/-"info": //-/--/--/-"age": 27, //-/--/--/-"children": false //-/--/-> //-/-> //] Возможно, эти способы окажутся для вас полезными.
Как Преобразовать Объект в Массив (JS)
Рассмотрим 4 способа, как преобразовать объект в массив при помощи JavaScript. Затем преобразуем массив в объект.
Преобразование объекта в массив
Исходные данные. Пусть у нас есть объект (object).
const populations =
Нам необходимо преобразовать его в массив (array). Рассмотрим 4 способа.
1. С помощью цикла
Преобразуем объект в массив, используя цикл for . Данный способ использовался ранее, до ES6.
const countries = []; for (let population in populations) < if (populations.hasOwnProperty(population)) < countries.push(population) >>
2. Преобразование объекта в массив с помощью методов Object.keys и Object.values
Данный способ включает в себя ES6 и ES8 синтаксис.
// ключи объекта преобразуем в массив (ES6) Object.keys(populations); // значения объекта преобразуем в массив (ES8) Object.values(populations);
Object.values не поддерживает IE. Polyfill Object.values.
3. Преобразование объекта в массив с помощью метода Object.entries
Для преобразования объекта в массив будем использовать метод Object.entries , который позволяет извлечь и ключи и значения в один массив.
Object.entries(populations);
Object.entries не поддерживает IE. Polyfill Object.entries.
4. Деструктуризация объекта
Результатом предыдущего способа были вложенные массивы.
Деструктуризирующее присваивание позволяет извлекать несколько значений из объекта/массива в отдельные переменные.
Только посмотрите что можно получить, используя деструктуризацию.
const abjArr = Object.entries(populations); abjArr.forEach(([key, value]) => < console.table(key, value); >);for (let [key, value] of Object.entries(populations)) < console.log(`$:$`); >Как преобразовать массив в объект
Чтобы преобразовать массив в объект необходимо использовать метод Object.fromEntries.
Поддержка большинства браузеров, но не всех — MDN: Object.fromEntries.
const populations = [ ["russia", 146780], ["ukraine", 42153], ["belarus", 9475] ]; Object.fromEntries(populations);
Сегодня мы рассмотрели различные способы, как преобразовать объект в массив, и обратно (массив в объект).
Надеюсь, вам понравилась данная информация. Если вам интересна тема web-разработки, то можете следить за выходом новых статей в Telegram.
Поделиться с друзьями:
Статьи из данной категории:
- JavaScript: Работа с Массивами
- Наличие Динамически Добавленного Элемента
- Стилизация Input File
- Предзагрузка Картинок — Предварительная Загрузка Изображений на JavaScript
- Стилизация Скролла
- События Формы
Преобразование массива в объект в JavaScript
Результат преобразования массива в объект зависит от того, как выглядит исходный массив и от того, что мы хотим получить на выходе. Решить проблему можно либо перебором массива, либо используя специальные методы.
Рассмотрим случаи, когда из массива необходимо получить объект, и способы их реализации.
Object.assign()
Метод Object.assign() был представлен стандартом ES6. Суть его заключается в том, что он копирует значения свойств из одного или нескольких исходных объектов в целевой. Целевой объект укажем пустым, а значения свойств будут браться из массива. Поскольку самих свойств в массиве нет, они будут заменены порядковыми номерами элементов.
const names = ['Иван', 'Олег', 'Петр', 'Глеб']; const obj = Object.assign(<>, names); //
Спред-оператор ( . )
Суть этого оператора похожа на вышеописанный метод Object.assign() . В новый объект скопируются значения массива, свойствами которых будут их индексы.
const names = ['Иван', 'Олег', 'Петр', 'Глеб']; const obj = ; //
Цикл for
Более простым и обычным способом преобразования массива в объект будет использование цикла for , в котором каждая итерация будет расширять объект.
const names = ['Иван', 'Олег', 'Петр', 'Глеб']; const obj = <>; for (let i = 0; i < names.length; i++) < obj[i] = names[i]; >console.log(obj); // =>
reduce()
Метод reduce() применяется для перебора массива и совершения операций с его элементами. Передавая ему объект в качестве первого параметра, мы можем на каждой итерации расширять объект очередной парой ключ-значение и возвращать его.
const names = ['Иван', 'Олег', 'Петр', 'Глеб']; const obj = names.reduce((object, value, index) => < return ; >, <>); console.log(obj); // =>
Object.fromEntries
Этот метод может обрабатывать массив немного другого формата, создавая объект с ключами и их значениями согласно данным массива. Каждый элемент массива должен быть массивом из двух элементов, которые и преобразуются в пару ключ-значение.
const names = [ ['name', 'Иван'], ['age', 35], ['city', 'Сидней'], ]; const obj = Object.fromEntries(names); console.log(obj); // =>
Как в js преобразовать массив объектов в объект? [закрыт]
Учебные задания допустимы в качестве вопросов только при условии, что вы пытались решить их самостоятельно перед тем, как задать вопрос. Пожалуйста, отредактируйте вопрос и укажите, что именно вызвало у вас трудности при решении задачи. Например, приведите код, который вы написали, пытаясь решить задачу
Закрыт 2 года назад .
Вот пример массива:
const myArray = [ < data: < name: 'Alex', city: 'London', year: '1991', >, >, < data: < name: 'John', city: 'London', year: '1992', >, >, < data: < name: 'Alice', city: 'Paris', year: '1989', >, >, < data: < name: 'Romeo', city: 'Rome', year: '1990', >, >, < data: < name: 'Michael', city: 'London', year: '1989', >, >, ];
Нужно получить:
const myObject = < London: [ < data: < name: 'Alex', city: 'London', year: '1991', >, >, < data: < name: 'John', city: 'London', year: '1992', >, >, < data: < name: 'Michael', city: 'London', year: '1989', >, >, ], Paris: [ < data: < name: 'Alice', city: 'Paris', year: '1989', >, >, ], Rome: [ < data: < name: 'Romeo', city: 'Rome', year: '1990', >, >, ], >;
Отслеживать
задан 17 сен 2021 в 15:08
1 1 1 серебряный знак 1 1 бронзовый знак
1 ответ 1
Сортировка: Сброс на вариант по умолчанию
Обычно, если из массива методом каких-то вычислений нужно получить не-массив (объект, число, строку и т.д.), пользуются Array.prototype.reduce().
Если оператор ??= вам ещё незнаком, почитать можно тут: Logical nullish assignment (??=). Его удобно использовать, когда вы коллекционируете какие-то данные в ключах объекта, чтобы задать начальное значение при создании контейнера.
const myArray = [ < data: < name: 'Alex', city: 'London', year: '1991', >, >, < data: < name: 'John', city: 'London', year: '1992', >, >, < data: < name: 'Alice', city: 'Paris', year: '1989', >, >, < data: < name: 'Romeo', city: 'Rome', year: '1990', >, >, < data: < name: 'Michael', city: 'London', year: '1989', >, >, ]; const myArrayByCity = myArray.reduce( (acc, object) => < const city = object.data.city; acc[city] ??= []; acc[city].push(object); return acc; >, <>, ); console.log(JSON.stringify(myArrayByCity, null, ' '));Отслеживать
ответ дан 17 сен 2021 в 15:18
vsemozhebuty vsemozhebuty
14k 2 2 золотых знака 11 11 серебряных знаков 20 20 бронзовых знаков
или если пойти дальше в однострочники: myArray.reduce((acc, object) =>(<. acc, [object.data.city]:(acc[object.data.city]??[]).concat(object)>), <>)
17 сен 2021 в 15:39
@Grundy Ну, если играть в программистский гольф, то да) Но будет неэффективно, потому что объект на каждом витке будет пересоздаваться с всё нарастающей итерацией по свойствам.