将两个数组转换为对象

时间:2018-03-19 12:06:47

标签: javascript arrays object functional-programming ramda.js

var foo = { "a": [1,2,3] }
var bar = { "b": [7,8,9] }

输出应该如下所示

[ {a: 1, b: 7}, {a: 2, b: 8}, {a:3, b: 9}]

如何使用ramda或javascript函数式编程来完成这项工作?

我使用for循环i = 0完成了这个,是否可以使用函数ramda编程

6 个答案:

答案 0 :(得分:2)

如果两个数组的长度始终相同,则可以使用map

执行此操作

function mergeArrays(arr1, arr2) {
  return arr1.map(function(item, index) {
    return {
      a: arr1[index], //or simply, item
      b: arr2[index]
    };
  });
}

var a = [1, 2, 3];
var b = [7, 8, 9];

var joined = mergeArrays(a, b);

document.getElementById('result').innerHTML = JSON.stringify(joined, null, 2);
<pre id="result">
  
</pre>

答案 1 :(得分:2)

您可以使用R.transpose[[1,2,3], [7,8,9]]数组转换为[[1, 7], [2, 8], [3, 9]],然后使用R.zipObj将其映射。

&#13;
&#13;
const fn = R.compose(
  R.map(R.zipObj(["a", "b"])),
  R.transpose
)

const a = [1, 2, 3], b = [7, 8, 9]

const result = fn([a, b])

console.log(result)
&#13;
<script src="//cdnjs.cloudflare.com/ajax/libs/ramda/0.25.0/ramda.min.js"></script>
&#13;
&#13;
&#13;

如果您希望将ab作为fn的两个参数而不是数组传递,那么您可以在上面的示例中将R.transpose与{{1}交换}}

答案 2 :(得分:1)

假设您想要[{a:1,b:7},{a:2,b:8},{a:3,b:9}],可以使用索引在地图中轻松完成,以获取b中的值:

var result = a.map((v, i) =>({ a: v, b: b[i] }));

答案 3 :(得分:0)

我有一个数组

  

const peopleObject = {&#34; 123&#34;:{id:123,name:&#34; dave&#34;,age:23},
  &#34; 456&#34;:{id:456,姓名:&#34;克里斯&#34;,年龄:23​​},&#34; 789&#34;:{id:789,姓名:   &#34; bob&#34;,年龄:23​​},&#34; 101&#34;:{id:101,姓名:&#34; tom&#34;,年龄:23​​},&#34; 102&# 34 ;:   {id:102,姓名:&#34; tim&#34;,年龄:23​​}}

对于这个特殊的我已经创建了一个代码将数组转换为对象我希望这对你有用

const arrayToObject = (array) =>
   array.reduce((obj, item) => {
     obj[item.id] = item
     return obj
   }, {})
const peopleObject = arrayToObject(peopleArray)
console.log(peopleObject[idToSelect])

答案 4 :(得分:0)

您的预期输出没有有效格式。您应该将数据存储在数组中。喜欢,

var output = [];
var a = [1,2,3], b = [7,8,9];
for(var i=0; i< a.length; i++){
  var temp = {};
  temp['a'] = a[i];
  temp['b'] = b[i];
  output.push(temp);
}

您无法以您希望的方式将结果存储在对象中。对象是键值对。但是你所期望的只是没有键的值,这是不可能的!

答案 5 :(得分:0)

从ramda的<link href="https://fonts.googleapis.com/css?family=Roboto" rel='stylesheet' type='text/css'> <link href="https://cdnjs.cloudflare.com/ajax/libs/normalize/3.0.1/normalize.css" rel="stylesheet" type="text/css"> <section class="v-center"> <div> <h2>Super Simple Modal Popups Demo</h2> <br/> <a class="js-open-modal btn" href="#" data-modal-id="popup1"> Pop Up One</a> </div> </section> <div id="popup1" class="modal-box"> <header> <a href="#" class="js-modal-close close">×</a> <h3>Pop Up One</h3> </header> <div class="modal-body"> <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut commodo at felis vitae facilisis. Cras volutpat fringilla nunc vitae hendrerit. Donec porta id augue quis sodales. Sed sit amet metus ornare, mattis sem at, dignissim arcu. Cras rhoncus ornare mollis. Ut tempor augue mi, sed luctus neque luctus non. Vestibulum mollis tristique blandit. Aenean condimentum in leo ac feugiat. Sed posuere, est at eleifend suscipit, erat ante pretium turpis, eget semper ex risus nec dolor. Etiam pellentesque nulla neque, ut ullamcorper purus facilisis at. Nam imperdiet arcu felis, eu placerat risus dapibus sit amet. Praesent at justo at lectus scelerisque mollis. Mauris molestie mattis tellus ut facilisis. Sed vel ligula ornare, posuere velit ornare, consectetur erat.</p> <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut commodo at felis vitae facilisis. Cras volutpat fringilla nunc vitae hendrerit. Donec porta id augue quis sodales. Sed sit amet metus ornare, mattis sem at, dignissim arcu. Cras rhoncus ornare mollis. Ut tempor augue mi, sed luctus neque luctus non. Vestibulum mollis tristique blandit. Aenean condimentum in leo ac feugiat. Sed posuere, est at eleifend suscipit, erat ante pretium turpis, eget semper ex risus nec dolor. Etiam pellentesque nulla neque, ut ullamcorper purus facilisis at. Nam imperdiet arcu felis, eu placerat risus dapibus sit amet. Praesent at justo at lectus scelerisque mollis. Mauris molestie mattis tellus ut facilisis. Sed vel ligula ornare, posuere velit ornare, consectetur erat.</p> </div> <footer> <a href="#" class="btn btn-small js-modal-close">Next ></a> </footer> </div> <script src="https://code.jquery.com/jquery-1.11.1.min.js"></script>addIndex创建函数

map

您将获得一个对象数组