Shulou(Shulou.com)05/31 Report--

This article mainly explains "how to customize the date formatter function of JavaScript". Interested friends may wish to have a look at it. The method introduced in this paper is simple, fast and practical. Next let the editor to take you to learn "JavaScript how to customize the date formatter function"!

1. Date object of JavaScript

Const date = new Date ()

The Date object contains a Number that represents the number of milliseconds that have elapsed since the new era, January 1, 1970. You can pass a date string to the Date constructor to create an object with a specified date:

Const date = new Date ('Jul 12 2011')

To get the current year, you can use the object's getFullYear () method. The getFullYear () method returns the year of the specified date in the Date constructor:

Const currentYear = date.getFullYear (); console.log (currentYear); / / 2020

Similarly, there are some ways to get the current date and current month of the current month:

Const today = date.getDate (); const currentMonth = date.getMonth () + 1

The getDate () method returns the current date of each month (1-31). Using the getMonth () method to return the month of the specified date, it is important to note that this method returns an index value of 0 (0-11), where 0 represents January and 11 represents December. Therefore, adding 1 can standardize the value of the month.

2 、 Date now

Now () is the static method of the Date object. It returns a value in milliseconds that represents the time elapsed since the era. You can pass the number of milliseconds returned by the now () method to the Date constructor to instantiate the new Date object:

Const timeElapsed = Date.now (); const today = new Date (timeElapsed)

3. Format date

You can use the methods of the Date object to format dates in multiple formats (GMT,ISO, etc.). The toDateString () method returns the date in a format that we can read:

Today.toDateString (); / / "Sun Jun 16 2020"

ToISOString () returns a date that follows the extended format of ISO 8601:

Today.toISOString (); / / "2020-06-16T08:30:00.000Z"

ToUTCString () returns the date in UTC time zone format:

Today.toUTCString (); / / "Sat, 16 Jun 2020 08:30:00 GMT"

ToLocaleDateString () returns the date in the format of the regional time:

Today.toLocaleDateString (); / / "6max 16max 2020"

4. Custom date formatter function

In addition to the formats mentioned above, your application may have different data formats. It can be in yy/dd/mm or yyyy-dd-mm format, or something like that. To solve this problem, it is best to create a reusable function so that it can be used in multiple projects. So next, let's create a utility function that returns the date in the format specified in the function arguments:

Const today = new Date (); function formatDate (date, format) {/ /} formatDate (today, 'mm/dd/yy')

You need to replace the strings "mm", "dd" and "yy" with the month, date and year in the format string passed in the parameter. Then, use replace (), which looks like this:

Format.replace ('mm', date.getMonth () + 1)

However, this will cause a lot of methods wiring together and cause trouble when we try to make the function more flexible and suitable for our project:

.replace ('yy', date.getFullYear ()). Replace (' dd', date.getDate ())

You can then use regular expressions instead of methods to connect to methods replace (). First create an object that represents the key-value pairs of the substrings and their respective values:

Const formatMap = {mm: date.getMonth () + 1, dd: date.getDate (), yy: date.getFullYear (). ToString (). Slice (- 2), yyyy: date.getFullYear ()

Next, use regular expressions to match and replace strings:

FormattedDate = format.replace (/ mm | dd | yy | yyy/gi, matched = > map [matched])

The complete function and code are as follows:

Function formatDate (date, format) {const map = {mm: date.getMonth () + 1, dd: date.getDate (), yy: date.getFullYear (). ToString (). Slice (- 2), yyyy: date.getFullYear ()} return format.replace (/ mm | dd | yy | yyy/gi, matched = > map [matched])} so far, I believe you have a better understanding of "how JavaScript customizes the date formatter function" You might as well do it in practice. Here is the website, more related content can enter the relevant channels to inquire, follow us, continue to learn!

Welcome to subscribe "Shulou Technology Information " to get latest news, interesting things and hot topics in the IT industry, and controls the hottest and latest Internet news, technology news and IT industry trends.