[英]Merge keys array and values array into an object in JavaScript
我有:
var keys = [ "height", "width" ];
var values = [ "12px", "24px" ];
我想把它轉換成這個對象:
{ height: "12px", width: "24px" }
在 Python 中,有簡單的習語dict(zip(keys,values))
。 在 jQuery 或純 JavaScript 中是否有類似的東西,或者我必須做很長的路嗎?
使用 Array reduce
的最簡單的 ES6 單行解決方案:
const keys = ['height', 'width'];
const values = ['12px', '24px'];
const merged = keys.reduce((obj, key, index) => ({ ...obj, [key]: values[index] }), {});
簡單的 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
作為替代解決方案,我認為尚未提及:
var result = {};
keys.forEach((key, idx) => result[key] = values[idx]);
您可以使用map
方法組合兩個數組,然后使用Object.fromEntries
將其轉換。
var keys = ["height", "width"]; var values = ["12px", "24px"]; var array = keys.map((el, i) => { return [keys[i], values[i]]; }); // → [["height", "12px"], ["width", "24px"]] var output = Object.fromEntries(array); // → {height: "12px", width: "24px"} console.log(output);
考慮到不變性的功能方法:
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)
您可以使用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>';
現在我們有了Object.fromEntries
我們可以做類似的事情:
const keys = [ "height", "width" ]; const values = [ "12px", "24px" ]; const myObject = Object.fromEntries( values.map((value, index) => [keys[index], value]) ); console.log(myObject);
您可以轉置數組並獲取包含條目的對象。
const transpose = (r, a) => a.map((v, i) => [...(r[i] || []), v]), keys = [ "height", "width" ], values = [ "12px", "24px" ], result = Object.fromEntries([keys, values].reduce(transpose, [])); console.log(result);
這是一個包含所有常量(非修改)且沒有庫的示例。
const keys = ["Adam", "Betty", "Charles"]; const values = [50, 1, 90]; const obj = keys.reduce((acc, key, i) => { acc[key] = values[i]; return acc; }, {}); console.log(obj);
或者,如果您考慮使用庫,則可以使用lodash zipobject來完成您的要求。
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);
這是一個將嵌套數組轉換為多個鍵值對象數組的方法。
var keys = [ ['#000000', '#FFFFFF'], ['#FFFF00', '#00FF00', '#00FFFF', '#0000FF'], ]; var values = [ ['Black', 'White'], ['Yellow', 'Green', 'Cyan', 'Blue'], ]; const zipObj = xs => ys => xs.reduce( (obj, x, i) => ({...obj, [x]: ys[i] }), {}) var array = keys.map((el, i) => zipObj (keys[i]) (values[i])); console.log(array);
輸出是
[
{
"#000000": "Black",
"#FFFFFF": "White"
},
{
"#FFFF00": "Yellow",
"#00FF00": "Green",
"#00FFFF": "Cyan",
"#0000FF": "Blue"
}
]
提供帶有for...of
循環的解決方案。
var keys = ["height", "width"]; var values = ["12px", "24px"]; const result = {}; for (let [index, key] of keys.entries()) result[key] = values[index]; console.log(result);
const keys = ["height", "width"]; const values = ["12px", "24px"]; const result = R.zipObj(keys, values); console.log(result);
在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;
}
//...
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.