Find element and replace it - javascript

I want to make a function (or use library) that will search the array of objects find specific one by its property and replace it with the other object. E.g.:
var a = {name: "Jane", age: 29}
var arr = [{name: "Chris", age: 20}, {name: "Jane", age: 45}]
arr.find(person => { if (a.name === person.name) {person = a})
Is there such a function?
Edit:
It would be nice if there is no matched object in array it would push it to an array that object

I can only think of Array#map
var a = {name: "Jane", age: 29}
var arr = [{name: "Chris", age: 20}, {name: "Jane", age: 45}]
arr = arr.map(function(o){
// if names match, return new object
// otherwise, return original object
return o.name == a.name ? a : o;
});
console.log( arr );

You are probably looking for a wrapper around splice.
Your example would look like this:
arr.forEach((elem, index) => {
if (elem.name !== a.name) return
arr.splice(index, 1, a)
})

You could use the find() method, as such:
var jane = {name: "Jane", age: 29}
var persons = [
{name: "Chris", age: 20},
{name: "Jane", age: 45}
];
function findPerson(person) {
return function(element, index, array) {
if(person.name === element.name) {
array[index] = person;
return true;
}
return false;
}
}
persons.find(findPerson(jane));
This would replace the matched person if found and else returns undefined. So you could check if undefined is returned and add the person afterwards.

Since you want to modify the original array, you can use array#forEach(), just iterate through the array and replace the object which matches your a object name.
var a = {name: "Jane", age: 29}
var arr = [{name: "Chris", age: 20}, {name: "Jane", age: 45}]
arr.forEach((person,index) => {
if (a.name === person.name)
arr[index] = a;
})
console.log(arr);
.as-console-wrapper { max-height: 100% !important; top: 0; }

Related

Take an object from an array of objects based on the max value on one of its properties

Let's say I got an array of object like this
const arr = [
{name: 'John', age: 15},
{name: 'Max', age: 17},
{name: 'Tom', age: 11},
]
How can I take just the object containing Max, 17?
This would be the result
b = [{ name: Max, age: 17 }]
or better
c = { name: Max, age: 17 }
Reduce the array to the object with highest age:
const arr = [{"name":"John","age":15},{"name":"Max","age":17},{"name":"Tom","age":11}]
const result = arr.reduce((acc, o) => !acc || o.age > acc.age ? o : acc, null)
console.log(result)
I'm using null as the default value for the Array.reduce() to prevent an error if the array is empty. However, you can check for an empty array beforehand as well:
const findMaxAge = arr => arr.length
? arr.reduce((acc, o) => o.age > acc.age ? o : acc)
: null
const arr = [{"name":"John","age":15},{"name":"Max","age":17},{"name":"Tom","age":11}]
console.log(findMaxAge(arr))
console.log(findMaxAge([]))
You can sort by age first, then the object with the highest age value will be at the start of the list:
const a = [
{name: "John", age: 15},
{name: "Max", age: 17},
{name: "Tom", age: 11},
]
const sortedByAge = a.sort((a,b) => b.age - a.age);
const highestAge = sortedByAge[0];
console.log(highestAge);
hope this code helping you
const a = [{name: 'John', age: 15},
{name: 'Max', age: 17},
{name: 'Tom', age: 11},];
const result = a.reduce((p, c) => p.age > c.age ? p : c);
console.log(result);
Using the Array.prototype.reduce() is a clean way.
this function iterates through the array one by one, at each step adding the current array value to the result from the previous step. in our case will compare the previous largest element to the current. the return value will be the object containing the largest value for the age key.
const arr = [
{name: 'John', age: 15},
{name: 'Max', age: 17},
{name: 'Tom', age: 11},
]
const largest = arr.reduce((prev, current) => (prev.age > current.age) ? prev : current)
console.log(largest);

creating Object with different data

I was wondering if there's a way to create an object with changeable data.
Eg:
pearson = {
name: "",
age: 0
}
Can I do something like a loop that each time it changes these 2 variables and assign the whole object with the data into an array, but each time the object will hold the updated data?
Something like:
let pearson = { name: '', age: 20 }
const pearsonsList = [{name: 'dave', age: 20}, {name: 'jessy', age: 30}]
let arr = []
pearsonsList.forEach((e) =>{
pearson.name = e.name
pearson.age = e.age
arr.push(pearson)
})
console.log(arr[0])
/* this what arr[0] holds
{
"name": "jessy",
"age": 30
}*/
how to make arr[0] have a different value than arr[1] where the object data always get overridden ?
The main problem here is your arr is storing the reference to your pearson object, which gets modified each time you set it, even after you push them into your arr.
A solution would be to construct a new object each time before pushing it in.
const pearsonsList = [{name: 'dave', age: 20}, {name: 'jessy', age: 30}]
let arr = []
pearsonsList.forEach((e) =>{
let pearson = { name: '', age: 20 }
pearson.name = e.name
pearson.age = e.age
arr.push(pearson)
})
An optional, and cleaner solution would be to use .map instead of .forEach too
const pearsonsList = [{name: 'dave', age: 20}, {name: 'jessy', age: 30}]
let arr = pearsonsList.map((e) =>{
let pearson = { name: '', age: 20 }
pearson.name = e.name
pearson.age = e.age
return person;
})

check every values in array of object

I have an array of object like this :
const object = [
{name: 'John', age: 15},
{name: 'Victor', age: 15},
{name: 'Emile', age: 14}
]
I need to check if in this array all age are 15. ( just need a boolean for answer )
I need to use something like 'every' method but how with an object ?
You need to use every:
The every() method tests whether all elements in the array pass the test implemented by the provided function. It returns a Boolean value. Array.prototype.every
So the code will be like:
const object = [
{name: 'John', age: 15},
{name: 'Victor', age: 15},
{name: 'Emile', age: 14}
]
const isValid = object.every(item => item.age === 15)
console.log({isValid})
This is js functional ability to test all your elements states.
You just need to extract the property you want to compare
const object = [ {name: 'John', age: 15},{name: 'Victor', age: 15},{name: 'Emile', age: 14}]
let op = object.every(({ age }) => age === 15)
console.log(op)
You can compare the length of the array with length of array of objects with required age.
const object = [
{name: 'John', age: 15},
{name: 'Victor', age: 15},
{name: 'Emile', age: 14}
];
function hasAge(pAge, object) {
return object.length === object.filter(({ age }) => age === pAge).length;
}
console.log(hasAge(15, object));

Get values from an array of objects

I am looping through my array to get the corresponding field value:
var someFun = function (nm) {
var names = [{name: 'joe', age: 'nine'}, {name: 'tom', age: 'ten'}];
for (var i=0; i < names.length; i++) {
if (names[i].name === nm) return names[i].age;
}
};
var username = 'tom';
var printme = someFun(username);
console.log('hey: ', printme)
How can I do the same using Object.keys(), or map, or forEach? Much cleaner and ES6 compliant.
Simply use find
([{name: 'joe', age: 'nine'}, {name: 'tom', age: 'ten'}].find( (s)=> s.name=="tom" )||{}).age //10
([{name: 'joe', age: 'nine'}, {name: 'tom', age: 'ten'}].find( (s)=> s.name=="tom2" )||{}).age //undefined
Demo
var names = [{
name: 'joe',
age: 'nine'
}, {
name: 'tom',
age: 'ten'
}];
function getAge(names, name) {
return (names.find((s) => s.name == name) || {}).age;
}
console.log(getAge(names, "tom"))
console.log(getAge(names, "tom2"))
You can use array.prototype.find:
var names = [{name: 'joe', age: 'nine'}, {name: 'tom', age: 'ten'}];
var someFun = (nm) => {
var found = names.find(el => el.name === nm);
return found && found.age || null;
}
console.log(someFun('tom'));
From Array.prototype.find()
The find() method returns the value of the first element in the array
that satisfies the provided testing function.
If there are multiples objects with the same name?
With Array.prototype.filter()
var names = [{
name: 'joe',
age: 9
},
{
name: 'tom',
age: 10
},
{
name: 'frank',
age: 9
},
{
name: 'joe',
age: 15
}
];
function getData(arr, search) {
// Filter array of objects by a search pair
return arr.filter(o => o[search[0]] === search[1]);
}
function listBy(arr, k) {
// Output values from an array of objects by a key as a comma separated string
return arr.map(o => o[k]).join(",");
}
console.log(getData(names, ["name", "joe"]));
console.log(listBy(getData(names, ["name", "tom"]), "age"));
console.log(listBy(getData(names, ["age", 9]), "name"));
IE doesn't support find, check the Browser compatibility. Maybe you don't need to support IE, but it's still a gets 3.74% of global usage as of Oct 2017. However, it does support filter.
DEMO
var users = [
{ name: "Bill", age: 'nine' },
{ name: 'Tedd', age: 'ten' }
];
function getAgeFromUsers(name) {
const arr = users.filter(u => u.name === name);
return !!arr.length ? arr[0].age : "That user ain't here";
}
console.log(getAgeFromUsers('Tedd'));
console.log(getAgeFromUsers("Lion 'O"));
var someFun = nm => {
const names = [{name: 'joe', age: 'nine'}, {name: 'tom', age: 'ten'}];
const foundName = names.find(name => name.name === nm)
return foundName ? foundName.age : null
};
This replicates what you have above. Although i would personally return the object then age the age from that instead of just returning the age.

unEven an array, like the concatAll function

I have this 2 Arrays representing the same data:
array1 = [
{name: "max", age: 30},
{name: "paul"},
{name: "paul.Jack", age: 25},
{name: "max.David"},
{name: "max.Sylvia", age: 27},
{name: "paul.Jack.Ned"},
{name: "paul.Jack.Mike"},
{name: "max.David.Jeff"},
{name: "max.Sylvia.Anna", age: 5},
{name: "max.David.Buffy"},
{name: "max.Sylvia.Craig"},
{name: "max.Sylvia.Robin"}
];
array2 = [
{
name: "max",
age: 30,
children: [
{
name: "Sylvia",
age: 27,
children: [
{name: "Anna", age: 5},
{name: "Craig"},
{name: "Robin"}
]
},
{
name: "David",
children: [
{name: "Jeff"},
{name: "Buffy"}
]
}
]
},
{
name: "paul",
children: [
{
name: "Jack",
age: 25,
children: [
{name: "Ned"},
{name: "Mike"}
]
}
]
}
];
my objective is to have a function unEven which transform the array1 to the array2, I'm using lodash to do this here's where I'm now:
To unEven array1 to array2 the tracking property in this case 'name' contain the information about where in the new array this item should be pushed check this js bin, this work for 3 level nested array but my goal is to have it unEven arrays without limit of their nesting level, that's where I'm stuck.
The unEven function will be like the concatAll function presented in this video.
Here's the unEven function:
Array.prototype.unEven = function (trackingProperty, children, resultArray) {
var newItem, prop, index, parent, subParent, subParentIndex;
resultArray = resultArray || [];
this.forEach(function (item) {
newItem = lodash.omit(item, trackingProperty);
prop = lodash.pick(item, trackingProperty);
if (prop[trackingProperty].indexOf('.') === -1) {
resultArray.push(item);
} else {
newItem[trackingProperty] = prop[trackingProperty].split(".");
parent = {};
parent[trackingProperty] = newItem[trackingProperty][0];
index = lodash.indexOf(resultArray, lodash.find(resultArray, parent));
if (newItem[trackingProperty].length === 2) {
newItem[trackingProperty] = newItem[trackingProperty][1];
if (!Array.isArray(resultArray[index][children])) {
resultArray[index][children] = [];
}
resultArray[index][children].push(newItem);
} else if (newItem[trackingProperty].length === 3) {
subParent = {};
subParent[trackingProperty] = newItem[trackingProperty][1];
subParentIndex = lodash.indexOf(resultArray[index][children], lodash.find(resultArray[index][children], subParent));
newItem[trackingProperty] = newItem[trackingProperty][2];
if (!Array.isArray(resultArray[index][children][subParentIndex][children])) {
resultArray[index][children][subParentIndex][children] = [];
}
resultArray[index][children][subParentIndex][children].push(newItem);
}
}
});
return resultArray;
};
To give my use case for this I'm trying to make a d3js tree layout of angular ui router in my application that will be generated from the routes JSON file since I make the routes in a JSON file.
Here's a lodash-heavy solution that I think does what you want. You can skip the cloning if you don't care about mutating the original array, and skip the sorting if you always have children after their parents in the original array.
function unEven(array1) {
_(_.clone(array1, true)) //begin chaining syntax, with cloned array
.each(function(person) {
person.name = person.name.split(".") //replace name with array of names
})
.sortBy(function(person) {return person.name.length}) //sort so that we handle children after parents
.reduce(function(result, person) {
var parentArray = result;
var name = person.name.pop() //their actual name is the last one in the list
_.each(person.name, function(parentName) { //loop through parent names to find the proper array to add to
var parent = _.find(parentArray, {name: parentName});
if(!parent) throw new Error(name + " has non-existent parent "+parentName);
parentArray = parent.children = parent.children || []
})
person.name = name; //return name back to just being their name
parentArray.push(person);
return result;
}, []) //reduce ends chaining syntax; so no need for .value
}

Categories