score:1
you can like so:
const array1 = [
{handle: "handle1", title: "handle1"},
{handle: "handle2", title: "handle2"},
{handle: "handle3", title: "handle3"} ]
const array2 = [
{handle: "handle1", checkbox: true},
{handle: "handle2", checkbox: false},
{handle: "handle3", checkbox: true} ]
const array3 = array1.map(({ handle, title }, idx) => ({handle, title, checkbox: array2[idx].checkbox}));
console.log(array3)
const array1 = [
{handle: "handle1", title: "handle1"},
{handle: "handle2", title: "handle2"},
{handle: "handle3", title: "handle3"} ]
const array2 = [
{handle: "handle1", checkbox: true},
{handle: "handle2", checkbox: false},
{handle: "handle3", checkbox: true} ]
const array3 = array1.map(({ handle, title }, idx) => ({handle, title, checkbox: array2[idx].checkbox}));
console.log(array3)
score:1
here we are the using map method and object.assign method to merge the array of objects by using id.
const array1 = [
{handle: "handle1", title: "handle1"},
{handle: "handle2", title: "handle2"},
{handle: "handle3", title: "handle3"} ]
const array2 = [
{handle: "handle1", checkbox: true},
{handle: "handle2", checkbox: false},
{handle: "handle3", checkbox: true} ]
console.log(array1.map((item1,i)=>{
if(array2.find(item2 => item2.handle === item1.handle)){
return object.assign({},item1,array2.find(item2 => item2.handle === item1.handle))
}
}))
and you can do like this.
const array1 = [
{handle: "handle1", title: "handle1"},
{handle: "handle2", title: "handle2"},
{handle: "handle3", title: "handle3"} ]
const array2 = [
{handle: "handle1", checkbox: true},
{handle: "handle2", checkbox: false},
{handle: "handle3", checkbox: true} ]
let mergedarray = array1.map(itm => ({
...array2.find((item) => (item.id === itm.id) && item),
...itm
}));
console.log(mergedarray)
score:1
const newarr = []
array1.map((item) => {
const checkbox = array2.find(array2item => array2item.handle === item.handle).checkbox;
newarr2.push({ title: item.title, handle: item.handle, checkbox })
});
score:1
const parsedarray = array1.map(el => {
const extradata = array2.find(arr2el => arr2el.handle === el.handle)
return {
...el,
...extradata
}
})
result :
[
{ handle: 'handle1', title: 'handle1', checkbox: true },
{ handle: 'handle2', title: 'handle2', checkbox: false },
{ handle: 'handle3', title: 'handle3', checkbox: true }
]
score:4
something like this may work, not sure how much the data will change with the object name you want to combine.
const array1 = [
{handle: "handle1", title: "handle1"},
{handle: "handle2", title: "handle2"},
{handle: "handle3", title: "handle3"} ]
const array2 = [
{handle: "handle1", checkbox: true},
{handle: "handle2", checkbox: false},
{handle: "handle3", checkbox: true} ]
const newarr = array1.map(v => {
let obj = array2.find(o => o.handle === v.handle)
if(obj) {
v.checkbox = obj.checkbox
}
return v
})
console.log(newarr)
Source: stackoverflow.com
Related Query
- How do I combine two arrays in react to get a new one with all of the items from the previous two?
- Contentful API with React how to get specific fields from array items instead of whole arrays
- How can I get the right data from database with react
- On an HTML form with two buttons, how can I get one button to submit the form and the other one not?
- How do I get the new updated data from react hooks or useEffect?
- How to merge two arrays based on the property value in react with ES6
- Combine two json arrays into one json array where the data will be completely merged into one single Json in react js
- React leaflet How to have all markers with a specific icons but the one active with a different icon
- loop through multiple objects inside the first array from JSON data displaying two arrays with objects in React using FUNCTION COMPONENT
- How to compare current user id with the id from one collection in firebase using React
- How to combine the previous data with the new data in React and display it at the same time
- How can I get the 1st image from each album with an even ID in React using Fetch?
- React application: all three buttons get clicked by themselves, how do I stop that from happening (very new to react)
- React : how to get input value from one component to make the ajax call in another component?
- How to get object value from an array in the local storage and compare it with a new value?
- How to find if one of the items have completed property with value false from an array of objects using javascript and react?
- How to validate the two field in one object using react hook with yup
- How can I get all the values from multiple select inputs on a button click? React
- How to fetch the new data in response to React Router change with Redux?
- How to mock history.push with the new React Router Hooks using Jest
- How to get the data from React Context Consumer outside the render
- How do I use the Firebase onAuthStateChange with the new React Hooks?
- How should the new context api work with React Native navigator?
- How can I get a variable from the path in react router?
- How to get the ID of a new object from a mutation?
- How to get the marquee effect with list view in react native?
- How to get the DOM node from a Class Component ref with the React.createRef() API
- How to get the element with the testid using react testing library?
- How to get values from react FieldArray in formik form with other fields?
- Draft.js. How to get all entities data from the ContentState
More Query from same tag
- How to restrict numbers (even in String type) from MaterialUI TextField?
- How I can open a Modal from another component in React
- Actions must be plain objects. when firebase auth.signOut()
- localStorage with React behaving very erratically
- Is it possible to change manifest.json file dynamically
- JSX element type [External Module] does not have any construct or call signatures
- How correctly call multiple functions ReactJS
- Higher Order Components - React.JS
- Rendering modal on click (user action) react redux
- How to handle both: onClick and onMouseMove for one dom element?
- How to add a button in infowindow with google-maps-react?
- How to convert data from type {} to type array [] in react js?
- Im getting this error everytime time I want to create a react app:
- How to make "watch" task forever false?
- Is there a way to filter an item in a array inside another array
- Animating the border radius in React Native
- Can i add dispatch manually to component's props instead of connect()?
- Customize React Big Calendar colors
- React child component lose ref of his parent after componentWillUnmount
- How to import a component outside root path in react?
- React pseudo selector inline styling
- VS Code not showing complete type information when hover
- API Symfony 4 / Reactjs / Paybox - submit a form from back side and send its redirection to front side for payment
- Unable to run React Native Project on simulator after updating to Xcode 12
- Conditionally send JSON key in fetch
- react-dom render: direct module import
- change state in component with redux
- Call parent class method from child in ReactJS
- react js multiple image upload with preview
- Building a referral system using Node/React/MongoDB