How to Clone Anything in JavaScript

In the world of JavaScript, cloning objects has always been a common task. Why? The answer lies in references.

When it comes to primitive types like strings, numbers, and booleans, cloning is as simple as passing them by value. However, with other types such as objects, arrays, and dates, things get a bit trickier since they are passed by reference. Without proper cloning, you end up with multiple references to the same object under different names.

Thankfully, there’s a solution that simplifies this process: the structuredClone() method.

By using the structuredClone() method, you can easily create deep clones of non-primitive types, ensuring that you have independent copies of your objects. Here’s an example of how to use it:

const clonedObject = structuredClone(originalObject);

It’s important to note that this API is relatively new, so if you plan to use it in the browser, make sure you have a build tool that provides core-js (babel) polyfills to ensure compatibility.

By harnessing the power of structuredClone(), you can clone anything in JavaScript with ease, eliminating the need for complex deep cloning techniques.