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
How to clone a Date object in JavaScript?
In this tutorial, we will learn to clone a Date object in JavaScript. We can create a new object of the Date class that contains the date and time according to the user’s requirement. Sometimes, it needs to copy the date, which means cloning it. In such cases, users can use the different approaches given below.
Also, we will learn to set the new time and date in the cloned date in this tutorial.
Clone a Date using the Date.getTime() Method
Users can simply create the new object of the Date class and get the total number of milliseconds from the 1st Jan 1970 using the getTime() method. When we pass the total number of milliseconds to the Date() class constructor as a parameter, it generates the date and time according to that and returns the new date object.
Syntax
We can follow the below syntax to clone the date using the getTime() method.
let current_date = new Date(); let clone_Date = new Date( current_date.getTime() );
Parameters
current_date.getTime() − It is a total number of milliseconds of the old date from starting the 1st Jan 1970.
Example
In the example below, we have created the new date object using the constructor of the Date class. We have created cloned date of the original date using the Date.getTime() method.
<html> <head> </head> <body> <h2> Clone a date object using JavaScript. </h2> <h4> Cloning the date using <i> Date.getTime() </i> method. </h4> <p id = "validate"> </p> <script> let validate = document.getElementById("validate");// taking the current date let current_date = new Date(); let clone_Date = new Date( current_date.getTime() ); validate.innerHTML += " The old date is : " + current_date + "<br/>"; validate.innerHTML += " The cloned date is : " + clone_Date + "<br/>"; </script> </body> </html>
In the above output, users can see that old data and cloned date is similar.
Using the Date.valueOf() method
The Date.valueOf() method is also a method of the date class that returns the total number of milliseconds from the first epoch that has been started. We can find the total number of milliseconds of the old date using the valueOf() method and pass it to the new Date object as a parameter.
Syntax
Users can follow the syntax below to clone the date using the Date.valueOf() method.
let current_date = new Date(); let clone_Date = new Date( current_date.valueOf() );
Example
In the example below, we have created the new date object to get the current date. Also, we have cloned the date using the valueOf() method, and users can see in the output that both dates are similar.
<html> <head> </head> <body> <h2> Clone a date object using JavaScript. </h2> <h4> Cloning the date using <i> Date.valueOf()</i> method. </h4> <p id = "validate"> </p> <script> let validate = document.getElementById("validate");// taking the current date let old_date = new Date(); let new_Date = new Date( old_date.valueOf() ); validate.innerHTML += " The old date is : " + old_date + "<br/>"; validate.innerHTML += " The new date is : " + new_Date + "<br/>"; </script> </body> </html>
Set the Custom Date to Cloned Date
Users have learned to clone the date from one date to another and make a copy of it. Now, we will learn to set the year, month, or date to the clone date. We can simply use the different methods of the date class.
Users can follow the syntax below to use different methods of the date class to change the year, month, or date of the cloned date.
Syntax
let date = new Date(); let new_date = new Date( date.valueOf() ); new_date.setFullYear( Year ); // set new Year new_date.setMonth( Month ); // set new Month new_date.setDate( Date ); // set new Date
Parameters
Year − It is a new year which users want to set for the cloned date.
Month − It is a new month for the cloned date in string format between 0 to 11.
Date − It set the day of the month.
Example
In the example below, we have cloned the date and set the new year, month, and day to the cloned date. Users can see the difference between the cloned data and the new date after setting up the new values.
<html> <head> </head> <body> <h2> Clone a date object using JavaScript. </h2> <h4> Change the date and time in cloned date using <i> Date class </i> methods. </h4> <p id = "validate"> </p> <script> let validate = document.getElementById("validate"); // taking the current date let current_date = new Date(); let clone_Date = new Date(current_date.valueOf()); validate.innerHTML += " The old date is : " + current_date + "<br/>"; validate.innerHTML += " The cloned date is : " + clone_Date + "<br/>"; clone_Date.setFullYear("2021"); clone_Date.setMonth("02"); clone_Date.setDate("3"); validate.innerHTML += " After settings the custom year, month, and date to cloned date is : " + clone_Date + "<br/>"; </script> </body> </html>
In this tutorial, we have learned to clone the date using the getTime() and valueOf() methods of the Date class. Also, we have learned to set new values to the date in the last section of the tutorial.
2K+ Views
