Data Structure
Networking
RDBMS
Operating System
Java
MS Excel
iOS
HTML
CSS
Android
Python
C Programming
C++
C#
MongoDB
MySQL
Javascript
PHP
Physics
Chemistry
Biology
Mathematics
English
Economics
Psychology
Social Studies
Fashion Studies
Legal Studies
- Selected Reading
- UPSC IAS Exams Notes
- Developer's Best Practices
- Questions and Answers
- Effective Resume Writing
- HR Interview Questions
- Computer Glossary
- Who is Who
Multiply only specific value in a JavaScript object?
The ability to multiply only specific values in a JavaScript object can be a useful tool for performing calculations or making modifications to data.
By using the map() and reduce() methods, you can quickly go through an entire object and make changes to any value that meets certain criteria. This article will provide an overview of how this process works as well as offer some examples of how it can be used in practice.
An object in JavaScript is a separate entity having properties and a type.
Example
In the following example, we are running the script where we declared an array in the script and later multiplied the data value by 3 and collected it as a result.
<!DOCTYPE html>
<html>
<body>
<p id="tutorial"></p>
<script>
let someArray = [{"car":"BMW", "value":34 }, {"car":"BENZ", "value":80 },{"car":"AUDi", "value":75}]
let result = someArray.map(data=>{
return {...data, value: data.value*3}
})
document.getElementById("tutorial").innerHTML= JSON.stringify(result);
</script>
</body>
</html>
When the script gets executed, it will generate an output consisting of an array printed on the webpage obtained from the original array multiplied by 3 of an event that gets triggered when the user executes the script has occurred.
Example
Consider the following example, where we are using going to use Object.values followed by an Array#map.
<!DOCTYPE html>
<html>
<body>
<p id="tutorial"></p>
<script>
let fundata = {
'arr1': {
a: [2,3],
b: []
},
'arr2': {
a: [5,6],
b: []
}
};
let multiplier = 50;
Object.values(fundata).forEach(item => {
item.a = item.a.map(number => number * multiplier);
});
document.getElementById("tutorial").innerHTML= JSON.stringify(fundata);
</script>
</body>
</html>
On running the above script, the web-browser displays the event, displaying an array with the changed values that occurred, when the user ran the script, multiplying the actual array with 50.
Example
Let’s look at another example, in which we are using Array.map to return the value directly to the new array, and then we are going to use Array.reduce to get the sum of the values.
<!DOCTYPE html>
<html>
<body>
<p id="tutorial"></p>
<p id="tutorial1"></p>
<script>
var array = [
{ x: 10, y: 30 },
{ x: 20, y: 90 },
{ x: 54, y: 32 }
];
var areas = array.map( arr => arr.x * arr.y);
var total = areas.reduce( (a,b) => (a+b) );
document.getElementById("tutorial").innerHTML= JSON.stringify(areas);
document.getElementById("tutorial1").innerHTML=JSON.stringify(total);
</script>
</body>
</html>
When the script gets executed, it will generate an output consisting of a new array along with a value obtained by adding the whole thing. The new array was obtained by multiplying the given array objects with each other and giving the result that occurred when the event got triggered.
Example
Execute the below script to look how to multiply the object values.
<!DOCTYPE html>
<html>
<body>
<p id="tutorial"></p>
<p id="tutorial1"></p>
<p id="tutorial2"></p>
<p id="tutorial3"></p>
<script>
var employee =
[
{ name: "John", amount: 800 },
{ name: "David", amount: 500 },
{ name: "Bob", amount: 450 }
]
document.getElementById("tutorial").innerHTML= ("Before multiplying the result=")
document.getElementById("tutorial1").innerHTML= JSON.stringify(employee)
for (var index = 0; index < employee.length; index++) {
if (employee[index].amount > 500) {
employee[index].amount = employee[index].amount * 2;
}
}
document.getElementById("tutorial2").innerHTML= ("After multiplying the result=")
document.getElementById("tutorial3").innerHTML=JSON.stringify(employee);
</script>
</body>
</html>
When the script gets executed, it will generate an output consisting of the original array and the multiplied array on the webpage. The multiplied array occurred when the actual array objects were multiplied by 2 as an event that gets triggered when the user executes the scripts.
864 Views
