Объединить массив массивов и массив значений в объект в Javascript

У меня есть:

var keys = [ "height", "width" ];
var values = [ "12px", "24px" ];

И я хотел бы преобразовать его в этот объект:

{ height: "12px", width: "24px" }

В Python существует простая идиома dict(zip(keys,values)). Есть ли что-то подобное в jQuery или просто Javascript, или мне нужно сделать это долгий путь?

Ответ 1

Простая функция JS будет:

function toObject(names, values) {
    var result = {};
    for (var i = 0; i < names.length; i++)
         result[names[i]] = values[i];
    return result;
}

Конечно, вы могли бы также реализовать такие функции, как zip и т.д., поскольку JS поддерживает более высокие типы заказов, которые облегчают эти функционально-понятные слова: D

Ответ 2

использовать lodash.

_. zipObject

Пример

_.zipObject(['a', 'b'], [1, 2]);
// ➜ { 'a': 1, 'b': 2 }

Ответ 3

Самый простой ES6 однострочник решение с использованием массива reduce:

const keys = ['height', 'width'];
const values = ['12px', '24px'];
const merged = keys.reduce((obj, key, index) => ({ ...obj, [key]: values[index] }), {});

Ответ 4

В качестве альтернативного решения, которое уже не упоминалось, я думаю:

  var result = {};
  keys.forEach((key, idx) => result[key] = values[idx]);

Ответ 5

Функциональный подход с неизменностью:

const zipObj = xs => ys => xs.reduce( (obj, x, i) => ({ ...obj, [x]: ys[i] }), {})

const arr1 = ['a', 'b', 'c', 'd']
const arr2 = ['e', 'f', 'g', 'h']

const obj = zipObj (arr1) (arr2) 

console.log (obj)

Ответ 6

Вы можете использовать функцию reduce() для сопоставления пар ключ-значение объекту.

/**
 *  Apply to an existing or new object, parallel arrays of key-value pairs.
 *
 *  @param   {string[]} keys      - List of keys corresponding to their accociated values.
 *  @param   {object[]} vals      - List of values corresponding to their accociated keys.
 *  @param   {object}   [ref={}]  - Optional reference to an existing object to apply to.
 *
 *  @returns {object} - The modified or new object with the new key-value pairs applied.
 */
function toObject(keys, vals, ref) {
  return keys.length === vals.length ? keys.reduce(function(obj, key, index) {
    obj[key] = vals[index];
    return obj;
  }, ref || {}) : null;
}

var keys   = [ "height" , "width" ];
var values = [ "12px"   , "24px"  ];

document.body.innerHTML = '<pre>' + JSON.stringify(toObject(keys, values), null, 2) + '</pre>';

Ответ 7

function combineObject( keys, values)
{
    var obj = {};
    if ( keys.length != values.length)
       return null;
    for (var index in keys)
        obj[keys[index]] = values[index];
     return obj;
};


var your_obj = combine( your_keys, your_values);

Ответ 8

В проекте jQuery-Utils ArrayUtils имеет встроенную функцию zip.

//...
zip: function(object, object2, iterator) {
    var output = [];
    var iterator = iterator || dummy;
        $.each(object, function(idx, i){
        if (object2[idx]) { output.push([i, object2[idx]]); }
    });
    return output;
}
//...

Ответ 9

странный и уродливый, но маленький

Это не... распространение одного, а только для пинков.

let arr1 = ['key1', 'key2', 'key3'];
let arr2 = ['1', '2', '3'];
let obj = (((o,a,b)=>(a.forEach((c,i)=>o[c]=b[i])||o)))({}, arr1, arr2);

https://jsfiddle.net/x78gy4yu/

Ответ 10

Вы можете сделать это легко, используя новую функцию Js ES 6:

var keys = [ "height", "width" ];

var values = [ "12px", "24px" ];

var combineObject = {
[keys.shift()] : values .shift(),
[keys.shift()] : values .shift()
};
console.log(combineObject); // { height: '12px', width: '24px' }

Ответ 11

Вы можете объединить два массива с помощью метода map, а затем преобразовать его в Object.fromEntries.

var keys = ["height", "width"];
var values = ["12px", "24px"];

var array = keys.map(function(el, i) {
  return [keys[i], values[i]];
});
// → [["height", "12px"], ["width", "24px"]]

var output = Object.fromEntries(array);
// → {height: "12px", width: "24px"}
console.log(output);