키 배열과 값 배열을 JavaScript에서 개체로 병합
다음과 같은 것이 있습니다.
var keys = [ "height", "width" ];
var values = [ "12px", "24px" ];
이 오브젝트로 변환하고 싶습니다.
{ height: "12px", width: "24px" }
Python에는 간단한 사자성어가 있습니다.dict(zip(keys,values))
jQuery나 플레인 JavaScript에 비슷한 것이 있나요?아니면 이 작업을 오래 해야 하나요?
어레이를 사용한 가장 심플한 ES6 원라이너 솔루션reduce
:
const keys = ['height', 'width'];
const values = ['12px', '24px'];
const merged = keys.reduce((obj, key, index) => ({ ...obj, [key]: values[index] }), {});
console.log(merged);
단순 JS 함수는 다음과 같습니다.
function toObject(names, values) {
var result = {};
for (var i = 0; i < names.length; i++)
result[names[i]] = values[i];
return result;
}
물론 JS는 이러한 기능 언어섬을 쉽게 만드는 고차 유형을 지원하므로 zip 등의 함수를 실제로 구현할 수도 있습니다.d
lodash를 사용하다
예
_.zipObject(['a', 'b'], [1, 2]);
// ➜ { 'a': 1, 'b': 2 }
대체 솔루션으로서 아직 언급되어 있지 않다고 생각합니다.
var result = {};
keys.forEach((key, idx) => result[key] = values[idx]);
2개의 배열을 메서드와 조합하여와 변환할 수 있습니다.
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;
}
//...
언급URL : https://stackoverflow.com/questions/1117916/merge-keys-array-and-values-array-into-an-object-in-javascript
'programing' 카테고리의 다른 글
ReactJS 오류 경고 (0) | 2023.03.26 |
---|---|
각도 2: ngFor가 완료되면 콜백 (0) | 2023.03.26 |
카르마 장치 테스트 중 이미지에 대한 경고 404개를 수정하는 방법 (0) | 2023.03.26 |
경고:Firebase JS SDK의 개발 빌드를 사용하고 있는 것 같습니다. (0) | 2023.03.26 |
Java(Jackson)를 사용하는 JSON에서 중첩된 키 값을 읽는 중입니다. (0) | 2023.03.26 |