带有javascript的特定格式的数组显示以及映射

时间:2019-03-22 10:45:06

标签: javascript arrays reactjs loops

需要以特定格式显示数组。 输入数组:

let userList = [
  {"id": "12356","username": "test@gmail.com"},
  {"id": "333333", "username": "test1@gmail.com"}
]
let userArray = [
  {"username": "test@gmail.com","sharedPaper": "some paper"}
]

预期结果:

let resultArr = [
  {"id":"12356","username": "test@gmail.com","sharedPaper": "some paper"}
]

9 个答案:

答案 0 :(得分:3)

您可以使用filtermap方法(假设username是唯一的)

const userList = [{
  "id": "12356",
  "username": "test@gmail.com"
}, {
  "id": "333333",
   "username": "test1@gmail.com"
 }];
const userArray = [{"username": "test@gmail.com","sharedPaper": "some paper"}];

const result = userList
  .filter(user => userArray.find(u => u.username === user.username))
  .map(user => {
      const userAdditionalData = userArray.find(u => u.username === user.username);
      return {
         ...user,
         ...userAdditionalData
      }
});

console.log(result)

答案 1 :(得分:1)

您可以这样做:

const userList = [{"id": "12356", "username": "test@gmail.com"}, {"id": "333333", "username": "test1@gmail.com"}];
const userArray = [{"username": "test@gmail.com", "sharedPaper": "some paper"}];
const resultArr = userArray.map(u => Object.assign({id: userList.find(ul => ul.username === u.username).id}, u));

console.log(resultArr);

答案 2 :(得分:1)

我建议您先创建Map或对象以进行搜索,而不要使用Array.prototype.find

let userList=[{"id": "12356","username": "test@gmail.com"},
             {"id": "333333", "username": "test1@gmail.com"}]
let userArray=[{"username": "test@gmail.com","sharedPaper": "some paper"}]

let map = userArray.reduce((a, c) => {
	a.has(c.username)? '':  a.set(c.username, c);
	return a;
}, new Map())

let out = userList.map(ele =>  ({...ele, ...map.get(ele.username)})).filter(ele => ele.sharedPaper);

console.log(out)

答案 3 :(得分:1)

let userList=[{"id": "12356","username": "test@gmail.com"},
             {"id": "333333", "username": "test1@gmail.com"}];
let userArray=[{"username": "test@gmail.com","sharedPaper": "some paper"}];


var result = userList.reduce((acc, c)=>{
    let k = userArray.find((a)=>{ return a.username == c.username });
    k ? acc.push({...c, ...k}): ''
    return acc ;
}, []);

console.log(result);

希望这对您有帮助!

答案 4 :(得分:1)

let userList = [
    { id: '12356', username: 'user1@gmail.com' },
    { id: '333333', username: 'user2@gmail.com' },
]
let userArray = [
    { username: 'user1@gmail.com', sharedPaper: 'some paper 1' },
    { username: 'user2@gmail.com', sharedPaper: 'some paper 2' },
]

let resultArr = userList.map(user => ({
    ...user,
    sharedPaper: userArray.find(
        usa => usa.username === user.username
    ).sharedPaper,
}))

console.log(resultArr)

答案 5 :(得分:0)

您需要将公用属性用户名上的两个列表合并在一起

您可以这样:

userArray.forEach(w=>{
      let user=userList.find(u=>u.username===w.username); 
      if(user) w['id']=user.id})

userArray将使用如下所示的额外属性“ id”进行更新

enter image description here

答案 6 :(得分:0)

我认为您也可以通过“ reduce”来做到这一点,

var resultArr = userList.reduce((arr, e) => {
  arr.push(Object.assign({}, e, userArray.find(a => a.username == e.username)))
  return arr;
}, [])

答案 7 :(得分:0)

let userList = [{
    "id": "12356",
    "username": "test@gmail.com"
  },
  {
    "id": "333333",
    "username": "test1@gmail.com"
  }
]
let userArray = [{
  "username": "test@gmail.com",
  "sharedPaper": "some paper"
}]

let resultArr = userList.map(user => {

  let userSharedPaper = userArray.find(userId => userId.username ===
    user.username);

  if (userSharedPaper && Object.keys(userSharedPaper).length > 0) {

    return { ...user,
      sharedPaper: userSharedPaper.sharedPaper
    }

  } else {
  
  return { ...user, sharedPaper:"" }
  
  }


})

console.log(resultArr)

答案 8 :(得分:0)

let userList = [
  {"id": "12356","username": "test@gmail.com"},
  {"id": "333333", "username": "test1@gmail.com"}
]
let userArray = [
  {"username": "test@gmail.com","sharedPaper": "some paper"}
]

let rs = userArray.map(({username:u, sharedPaper}) => 
  ({...(userList.find(e => u === e.username)), sharedPaper})
)

console.log(rs)