
- Javascript Basics Tutorial
- Javascript - Home
- Javascript - Overview
- Javascript - Syntax
- Javascript - Enabling
- Javascript - Placement
- Javascript - Variables
- Javascript - Operators
- Javascript - If...Else
- Javascript - Switch Case
- Javascript - While Loop
- Javascript - For Loop
- Javascript - For...in
- Javascript - Loop Control
- Javascript - Functions
- Javascript - Events
- Javascript - Cookies
- Javascript - Page Redirect
- Javascript - Dialog Boxes
- Javascript - Void Keyword
- Javascript - Page Printing
- JavaScript Objects
- Javascript - Objects
- Javascript - Number
- Javascript - Boolean
- Javascript - Strings
- Javascript - Arrays
- Javascript - Date
- Javascript - Math
- Javascript - RegExp
- Javascript - HTML DOM
- JavaScript Advanced
- Javascript - Error Handling
- Javascript - Validations
- Javascript - Animation
- Javascript - Multimedia
- Javascript - Debugging
- Javascript - Image Map
- Javascript - Browsers
- JavaScript Useful Resources
- Javascript - Questions And Answers
- Javascript - Quick Guide
- Javascript - Functions
- Javascript - Resources
How to clone a js object except for one key in javascript?
In computer programming, cloning refers to an object copied by a method or copy factory function often called clone and copy.
The easiest way to clone an object except for one key would be to clone the whole object and then remove the property that is not required. Cloning, however, can be of 2 types −
Deep Clone
Shallow Clone
Shallow Clone
The shallow clone copies as little as possible. For example, a shallow copy of a collection might be a copy of the collection’s structure, not its elements. With a shallow copy, two collections now share individual elements.
Example
Let us see an example −
<!DOCTYPE html> <html> <head> <title>Example</title> </head> <body> <script> let innerObj = { a: 'b', c: 'd' } let obj = { x: "test", y: innerObj } // Create a shallow copy. let copyObj = Object.assign({}, obj); // Both copyObj and obj's prop y now refers to the same innerObj. Any changes to this will be reflected. innerObj.a = "test"; document.write("Original Object: "); document.write(JSON.stringify(obj),"<br>"); document.write("Copy: "); document.write(JSON.stringify(copyObj)); </script> </body> </html>
Note − that shallow copies do not make clones recursively. It just does it at the top level.
Deep Clone
Deep clone duplicate everything. A deep copy of a collection is two collections with all of the elements in the original collection cloned.
Example 1
Following is an example of the deep clone.
<!DOCTYPE html> <html> <head> <title>Example</title> </head> <body> <script> let innerObj = { a: 'b', c: 'd' } let obj = { x: "test", y: innerObj } // Create a deep copy. let copyObj = JSON.parse(JSON.stringify(obj)); innerObj.a = "test"; document.write("Original Object: "); document.write(JSON.stringify(obj), "<br>"); document.write("Copy: "); document.write(JSON.stringify(copyObj)); </script> </body> </html>
Once you get a copy using either of these methods, you can remove the property you don't require using the delete keyword. For example,
Example 2
<!DOCTYPE html> <html> <head> <title>Example</title> </head> <body> <script> let original = { x: 'test', y: { a: 'test', c: 'd' } } let copy = JSON.parse(JSON.stringify(original)) delete copy['x'] document.write(JSON.stringify(copy), "<br>") document.write(JSON.stringify(original)) </script> </body> </html>
Let us see a few more examples −
Example 3
In the following example, we are creating a clone function named objectExceptOne which will print all the object values and keys except one.
<!DOCTYPE html> <html lang="en"> <head> <title>Clone javascript object except One Key</title> </head> <body> <script> // create a function and pass the parameter first is your object and second is that need to be removed. function objectExceptOne(obj, keys) { //create an empty object named target var target = {}; //itrating the loop and storing the value in the target object for (var i in obj) { if (keys.indexOf(i) >= 0) continue; if (!Object.prototype.hasOwnProperty.call(obj, i)) continue; target[i] = obj[i]; } return target; } var x = { a: "aman", b: "tutorialspoint", c: "Easy To Learn", d: "Technical Writer" }; var a = x.a; var y = objectExceptOne(x, ["a"]); document.write(JSON.stringify(y)); // printing the remaining value; </script> </body> </html>
Example 4
In the following example, we are using Object.assign() to exclude one key from the object.
<!DOCTYPE html> <html lang="en"> <head> <title>Document</title> </head> <body> <script> var clone = Object.assign({}, { a: "aman", b: "tutorialspoint", c: "Easy To Learn", d: "Technical Writer" }); delete clone.b; document.write(JSON.stringify(clone)); </script> </body> </html>
Example 5
In the following example, we are using ESnext one−liner and removing the a and c keys.
<!DOCTYPE html> <html lang="en"> <body> <script> var obj = { a: "aman", b: "tutorialspoint", c: "Easy To Learn", d: "Technical Writer", }; const clone = (({ a, c, ...o }) => o)(obj); // remove a and c document.write(JSON.stringify(clone)); </script> </body> </html>
Example 6
In the following example, we are using _.omit() which accepts two parameters first one is an object and the second one is the keys that you want to filter out from on the Object.
<!DOCTYPE html> <html> <head> <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/underscore.js/1.9.1/underscore-min.js" ></script> </head> <body> <script type="text/javascript"> var comInfo = { Company: "tutorialspoint", Address: "Hyderabad", Contact: "+915678889902", }; //Removing company and address document.write(JSON.stringify(_.omit(comInfo, "Company", "Address"))); </script> </body> </html>
Example 7
In the following example, we are writing a simple helper function for clone, like javascrit have underscore.js library _.omit() function.
<!DOCTYPE html> <html lang="en"> <body> <script> function omit(obj, omitKey) { return Object.keys(obj).reduce((result, key) => { if (key !== omitKey) { result[key] = obj[key]; } return result; }, {}); } document.write(JSON.stringify(omit({ Company: "tutorialspoint", Address: "Hyderabad", Contact: "+915678889902", }, "Contact" ))); </script> </body> </html>
- Related Articles
- How to clone a Date object in JavaScript?
- How to clone an object in JavaScript?
- How to clone an object using spread operator in JavaScript?
- How to set a String as a key for an object - JavaScript?
- Javascript search for an object key in a set
- How to find all elements in a given array except for the first one using JavaScript?
- Test for existence of nested JavaScript object key in JavaScript
- Convert JS array into an object - JavaScript
- How to clone a given regular expression in JavaScript?
- Get value for key from nested JSON object in JavaScript
- How to check whether a key exist in JavaScript object or not?
- How to automate this object using JavaScript to set one key on each iteration as null?
- Ordering alphabetically in MySQL except for one entry?
- How to check whether a particular key exist in javascript object or array?
- How to access an object value using variable key in JavaScript?
