To get the subset of properties of a JavaScript Object, we make use of destructuring and Property Shorthand. The destructuring assignment syntax is a JavaScript expression that makes it possible to unpack values from arrays, or properties from objects, into distinct variables.
Syntax:
subset = (({a, c}) => ({a, c}))(obj);
Example1: Get subset of a javascript object’s properties using destructuring assignment.
html
<!DOCTYPE html><html><head> <title> Get a subset of a javascript object’s properties </title></head><body> <center> <h1 style="color:green"> neveropen </h1> <h2> Get a subset of a javascript object’s properties </h2> <script> obj = { property1: 5, property2: 6, property3: 7 }; subset = (({ property1, property3 }) => ({ property1, property3 }))(obj); var output = 'Subset Object: <br>'; for (var property in subset) { output += property + ': ' + subset[property] + ';<br>'; } document.write(output); </script> </center></body></html> |
Output:
In ES6 there is a very concise way to do this using destructing. Destructing allows you to easily add on to objects and make subset objects.
Syntax:
const {c, d, ...partialObject} = object;
const subset = {c, d};
Example 2: Get subset of a javascript object’s properties using destructuring assignment.
html
<!DOCTYPE html><html><head> <title> Get a subset of a javascript object’s properties </title></head><body> <center> <h1 style="color:green"> neveropen </h1> <h2> Get a subset of a javascript object’s properties </h2> <script> const object = { property1: 'a', property2: 'b', property3: 'c', property4: 'd', } const { property1, property4, ...pObject } = object; const subset = { property1, property4 } ; var output = 'Subset Object: <br>'; for (var property in subset) { output += property + ': ' + subset[property] + ';<br>'; } document.write(output); </script> </center></body></html> |
Output:
… [Trackback]
[…] Read More here on that Topic: geeksforgeeks.org/how-to-get-a-subset-of-a-javascript-objects-properties-2/ […]
… [Trackback]
[…] Read More to that Topic: geeksforgeeks.org/how-to-get-a-subset-of-a-javascript-objects-properties-2/ […]