The magical Date object in javascript (graphic tutorial)

In daily life, various forms of time characters are everywhere. The emergence of the concept of time, the invention of time units and timing tools have brought about changes to human beings that are difficult to describe in just one word. Today let’s talk about dates. Let’s take a look at the Date object in JavaScript.

Date object is one of the more commonly used objects, but many people do not know how to operate it at all. Even for some simple operations, they use moment without trying it themselves.

This time I will share the date usage skills in Date, hoping to inspire everyone.

MDN official website introduction

The setDate() method specifies the number of days in a date object based on local time.

If dayValue is outside the reasonable range of the month, setDate will update the Date object accordingly.

For example, if you specify 0 for dayValue, the date will be set to the last day of the previous month.

Get the number of days in the month

// 获取月份天数
function getMonthDayCount(year, month) {
 return new Date(year, month, 0).getDate();
}
console.log(getMonthDayCount(2017, 10)); // 31

Date The essence of the third parameter is the same as setDate.

Because when date is 0, it automatically returns to the last day of the previous month, so there is no need to decrease the month here, which is just right.

Get the number of days in all months

function getAllMonthDayCount(year) {
 var days = [31, new Date(year, 2, 0).getDate(), 31, 30, 31, 30, 31, 31, 30, 31, 30, 31];
 return days;
}
console.log(getAllMonthDayCount(2016));// [31, 29, 31, 30, 31, 30, 31, 31, 30, 31, 30, 31]

This is an extension of the above, not much explanation.

Whether it is a leap year

function isLeapYear(year) {
 return (year % 4 == 0) && (year % 100 != 0 || year % 400 == 0);
}

This is the code on the Internet, I believe most people use it.

But do you really understand or remember it?

I can’t anyway. .

function isLeapYear(year) {
 return new Date(year, 2, 0).getDate() === 29;
}
console.log([
 isLeapYear(2000),
 isLeapYear(2016),
 isLeapYear(2017),
 isLeapYear(2018)
]); // [ true, true, false, false ]

Looking at it this way, it is very simple and easy to understand.

And you don’t need to remember it. Do you think you can’t forget it even if you want to?

Addition and subtraction of days

I have seen someone use relative seconds to calculate days before or after days, or even across months and years. Condition.

In fact, just setDate directly, and it will automatically handle the situation of crossing months and years.

// 10天后是几月几号
var dt = new Date('2016-12-25');
dt.setDate(dt.getDate() + 10);
console.log(dt.toLocaleDateString()); // 2017/1/4


// 10天前是几月几号
var dt = new Date('2017-01-04');
dt.setDate(dt.getDate() - 10);
console.log(dt.toLocaleDateString()); // 2016/12/25

Summary

Although these things are very basic and everyone may know the name of the method, many people still don’t use it.

It’s the same as using jq but still using a for loop to process the results.

Only some examples are listed here, there may be other magical operating skills waiting for you to discover.

The above is what I compiled for everyone. I hope it will be helpful to everyone in the future.

Related articles:

Detailed explanation of JS callback function usage cases

Detailed explanation of common addition, deletion, modification and query operations of JS DOM elements

JS refresh page method summary

The above is the detailed content of The magical Date object in javascript (graphic tutorial). For more information, please follow other related articles on the PHP Chinese website!