一、介紹
這節(jié)課呢,我們來了解的是JavaScript的內(nèi)置對(duì)象中的Date(日期)對(duì)象。
從字面上就能理解,日期對(duì)象就是用于處理日期和時(shí)間。
二、知識(shí)點(diǎn)介紹
1、創(chuàng)建日期
2、Date對(duì)象的常用方法
三、上課對(duì)應(yīng)視頻的說明文檔
1、創(chuàng)建日期
Date 對(duì)象用于處理日期和時(shí)間。
可以通過 new 關(guān)鍵詞來定義 Date 對(duì)象。以下代碼定義了名為 myDate 的 Date 對(duì)象:
1.1、創(chuàng)建date對(duì)象(4種)
1.1.1、new Date() :返回當(dāng)前的本地日期和時(shí)間
參數(shù):無
返回值:{Date} 返回一個(gè)表示本地日期和時(shí)間的Date對(duì)象。
示例:
var dt = new Date();
console.log(dt); // => 返回一個(gè)表示本地日期和時(shí)間的Date對(duì)象
1.1.2、new Date(milliseconds) :把毫秒數(shù)轉(zhuǎn)換為Date對(duì)象
參數(shù):
①milliseconds {int} :毫秒數(shù);表示從'1970/01/01 00:00:00'為起點(diǎn),開始疊加的毫秒數(shù)。
注意:起點(diǎn)的時(shí)分秒還要加上當(dāng)前所在的時(shí)區(qū),北京時(shí)間的時(shí)區(qū)為東8區(qū),起點(diǎn)時(shí)間實(shí)際為:'1970/01/01 08:00:00'
返回值:
{Date} 返回一個(gè)疊加后的Date對(duì)象。
示例:
var dt = new Date(1000 * 60 * 1); // 前進(jìn)1分鐘的毫秒數(shù)
console.log(dt); // => {Date}:1970/01/01 08:01:00
dt = new Date(-1000 * 60 * 1); // 倒退1分鐘的毫秒數(shù)
console.log(dt); // => {Date}:1970/01/01 07:59:00
1.1.3、 new Date(dateStr) :把字符串轉(zhuǎn)換為Date對(duì)象
參數(shù):
①dateStr {string} :可轉(zhuǎn)換為Date對(duì)象的字符串(可省略時(shí)間);字符串的格式主要有兩種:
1) yyyy/MM/dd HH:mm:ss (推薦):若省略時(shí)間,返回的Date對(duì)象的時(shí)間為 00:00:00。
2) yyyy-MM-dd HH:mm:ss :若省略時(shí)間,返回的Date對(duì)象的時(shí)間為 08:00:00(加上本地時(shí)區(qū))。若不省略時(shí)間,此字符串在IE中會(huì)轉(zhuǎn)換失敗!
返回值:
{Date} 返回一個(gè)轉(zhuǎn)換后的Date對(duì)象。
示例:
var dt = new Date('2014/12/25'); // yyyy/MM/dd
console.log(dt); // => {Date}:2014/12/25 00:00:00
dt = new Date('2014/12/25 12:00:00'); // yyyy/MM/dd HH:mm:ss
console.log(dt); // => {Date}:2014/12/25 12:00:00
dt = new Date('2014-12-25'); // yyyy-MM-dd
console.log(dt); // => {Date}:2014-12-25 08:00:00 (加上了東8區(qū)的時(shí)區(qū))
dt = new Date('2014-12-25 12:00:00'); // yyyy-MM-dd HH:mm:ss (注意:此轉(zhuǎn)換方式在IE中會(huì)報(bào)錯(cuò)!)
console.log(dt); // => {Date}:2014-12-25 12:00:00
1.1.4、 new Date(year, month, opt_day, opt_hours, opt_minutes, opt_seconds, opt_milliseconds) :把年月日、時(shí)分秒轉(zhuǎn)換為Date對(duì)象
參數(shù):
①year {int} :年份;4位數(shù)字。如:1999、2014
②month {int} :月份;2位數(shù)字。從0開始計(jì)算,0表示1月份、11表示12月份。
③opt_day {int} 可選:號(hào); 2位數(shù)字;從1開始計(jì)算,1表示1號(hào)。
④opt_hours {int} 可選:時(shí);2位數(shù)字;取值0~23。
⑤opt_minutes {int} 可選:分;2位數(shù)字;取值0~59。
⑥opt_seconds {int} 可選:秒;2未數(shù)字;取值0~59。
⑦opt_milliseconds {int} 可選:毫秒;取值0~999。
返回值:
{Date} 返回一個(gè)轉(zhuǎn)換后的Date對(duì)象。
示例:
var dt = new Date(2014, 11); // 2014年12月(這里輸入的月份數(shù)字為11)
console.log(dt); // => {Date}:2014/12/01 00:00:00
dt = new Date(2014, 11, 25); // 2014年12月25日
console.log(dt); // => {Date}:2014/12/25 00:00:00
dt = new Date(2014, 11, 25, 15, 30, 40); // 2014年12月25日 15點(diǎn)30分40秒
console.log(dt); // => {Date}:2014/12/25 15:30:40
dt = new Date(2014, 12, 25); // 2014年13月25日(這里輸入的月份數(shù)字為12,表示第13個(gè)月,跳轉(zhuǎn)到第二年的1月)
console.log(dt); // => {Date}:2015/01/25
1.2設(shè)置日期
通過使用針對(duì)日期對(duì)象的方法,我們可以很容易地對(duì)日期進(jìn)行操作。
在下面的例子中,我們?yōu)槿掌趯?duì)象設(shè)置了一個(gè)特定的日期 (2010 年 1 月 14 日):
var myDate=new Date();
myDate.setFullYear(2010,0,14);
在下面的例子中,我們將日期對(duì)象設(shè)置為 5 天后的日期:
var myDate=new Date();
myDate.setDate(myDate.getDate()+5);
注意: 如果增加天數(shù)會(huì)改變?cè)路莼蛘吣攴?,那么日期?duì)象會(huì)自動(dòng)完成這種轉(zhuǎn)換。
1.3、兩個(gè)日期比較
日期對(duì)象也可用于比較兩個(gè)日期。
下面的代碼將當(dāng)前日期與 2100 年 1 月 14 日做了比較:
var x=new Date();
x.setFullYear(2100,0,14);var today = new Date();
if (x>today){
alert("今天是2100年1月14日之前");}else{
alert("今天是2100年1月14日之后");}
2、date對(duì)象常用方法
2.1、創(chuàng)建Date對(duì)象
代碼如下:
var myDate = new Date();
或
代碼如下:
var myDate = new Date("July 21, 1983 01:15:00");//此種方法為自定義日期時(shí)間的方式,格式若不對(duì)的話為提示Invalid Date
Date對(duì)象的constructor屬性為:Date
document.write(myDate.constructor == Date);//輸出true
2.2、Date()方法,返回今天的日期和時(shí)間,格式是固定格式:
代碼如下:
document.write(Date());//Date()屬于Javascript的內(nèi)置對(duì)象,可以直接使用
輸出:Fri Oct 26 2012 10:15:22 GMT+0800
格式: 星期 月份 日期 年份 時(shí)間 時(shí)區(qū)
另:假如自定義一個(gè)Date()對(duì)象,返回結(jié)果是一樣的
代碼如下:
var myDate = new Date();
document.write(myDate);
Fri Oct 26 2012 10:17:09 GMT+0800
注:兩者區(qū)別的地方在于:
前者只能顯示當(dāng)前的時(shí)間,而不能隨意定義時(shí)間
例,document.write(Date("July 21, 1983 01:15:00"));
它顯示的時(shí)間仍然是當(dāng)前的時(shí)間:Fri Oct 26 2012 10:15:22 GMT+0800
2.3、getDate()方法返回月份的某一天
月份中的某一天指的是使用本地時(shí)間,其返回值是 1 ~ 31 之間的一個(gè)整數(shù)。
代碼如下:
var myDate = new Date();
document.write(myDate.getDate());
輸出:26
代碼如下:
var myDate = new Date("July 21, 1983 01:15:00");
document.write(myDate.getDate());
輸出:21
2.4、getDay() 方法可返回表示星期的某一天的數(shù)字,它的取值范圍:0--6
復(fù)制代碼代碼如下:
var myDate = new Date("July 21, 1983 01:15:00");
document.write(mtDate.getDay());
輸出4
為此我們可以采用Date對(duì)象和Array對(duì)象結(jié)合的方式將時(shí)間人性化顯示出來,下面這種方法非常常用
代碼如下:
var weekday = new Array(7);
weekday[0]="Sunday";
weekday[1]="Monday";
weekday[2]="Tuesday";
weekday[3]="Wednesday";
weekday[4]="Thursday";
weekday[5]="Friday";
weekday[6]="Saturday";
var myDate = new Date();
document.write(weekday[myDate.getDay()]);
2.5、getMonth(),返回月份字段,返回值是 0(一月) 到 11(十二月) 之間的一個(gè)整數(shù)
和getDay()類似,我們也采用與Array對(duì)象相結(jié)合的方式
代碼如下:
var d=new Date();
var month=new Array(12);
month[0]="January";
month[1]="February";
month[2]="March";
month[3]="April";
month[4]="May";
month[5]="June";
month[6]="July";
month[7]="August";
month[8]="September";
month[9]="October";
month[10]="November";
month[11]="December";
document.write("The month is " + month[d.getMonth()]);
2.6、getFullYear() 方法可返回一個(gè)表示年份的 4 位數(shù)字。
返回值是一個(gè)四位數(shù),表示包括世紀(jì)值在內(nèi)的完整年份,而不是兩位數(shù)的縮寫形式。
代碼如下:
var d = new Date();
document.write(d.getFullYear());
輸出:2012
代碼如下:
var born = new Date("July 21, 1983 01:15:00");
document.write("I was born in " + born.getFullYear());
輸出:1983
通過上述方法三種方法結(jié)合我們就可以得出比較人性化的時(shí)間顯示,例:
代碼如下:
var weekday = new Array(7);
weekday[0]="Sunday"
weekday[1]="Monday"
weekday[2]="Tuesday"
weekday[3]="Wednesday"
weekday[4]="Thursday"
weekday[5]="Friday"
weekday[6]="Saturday"
var month=new Array(12);
month[0]="January";
month[1]="February";
month[2]="March";
month[3]="April";
month[4]="May";
month[5]="June";
month[6]="July";
month[7]="August";
month[8]="September";
month[9]="October";
month[10]="November";
month[11]="December";
var myDate = new Date();
document.write("Date is "+myDate.getFullYear()+" "+month[myDate.getMonth()]+" "+myDate.getDate()+" "+weekday[myDate.getDay()]);
輸出為:Date is 2012 October 19 Friday
2.7、getHours() 方法可返回時(shí)間的小時(shí)字段,返回值是 0 (午夜) 到 23 (晚上 11 點(diǎn))之間的一個(gè)整數(shù)。
代碼如下:
var born = new Date("July 21, 1983 01:15:00");
document.write(born.getHours());
輸出:1
注釋:由 getHours() 返回的值是一個(gè)兩位的數(shù)字。
不過返回值不總是兩位的,如果該值小于 10,則僅返回一位數(shù)字。
2.8、getMinutes() 方法可返回時(shí)間的分鐘字段,返回值是 0 ~ 59 之間的一個(gè)整數(shù)。
與上述方法類似,返回值不總是兩位的,如果該值小于 10,則僅返回一位數(shù)字。
2.9、getSeconds() 方法可返回時(shí)間的秒,返回值是 0 ~ 59 之間的一個(gè)整數(shù)。
與上述方法類似,返回值不總是兩位的,如果該值小于 10,則僅返回一位數(shù)字。
2.10、getMilliseconds() 方法可返回時(shí)間的毫秒,毫秒字段,以本地時(shí)間顯示。返回值是 0 ~ 999 之間的一個(gè)整數(shù)。
注釋:由 getMilliseconds() 返回的值是一個(gè)三位的數(shù)字。
不過返回值不總是三位的,如果該值小于 100,則僅返回兩位數(shù)字,如果該值小于 10,則僅返回一位數(shù)字。
下面我們有兩種方式將時(shí)間顯示出來:
--->方式一
復(fù)制代碼代碼如下:
var d = new Date();
document.write('Time is '+d.getHours()+":"+d.getMinutes()+":"+d.getSeconds());
輸出:Time is 10:52:2,缺點(diǎn)很明顯,在秒為<10的情況下只顯示了一位,其他的也類似,因此推薦第二種顯示方式
--->方式二
代碼如下:
function checktime(time)
{
if(time<10)
{
time = '0'+time;
}
return time;
}
var d = new Date();
document.write('Time is '+checktime(d.getHours())+":"+checktime(d.getMinutes())+":"+checktime(d.getSeconds()));
輸出:Time is 10:55:02
2.11、getTime() 方法可返回本地時(shí)間距 1970 年 1 月 1 日之間的毫秒數(shù),因此可以自定義Date("Jul 26 2000");
代碼如下:
var d = new Date();
document.write(d.getTime() + " milliseconds since 1970/01/01");
輸出:1350615452813 milliseconds since 1970/01/01
因此我們可以根據(jù)此數(shù)得到本地時(shí)間距離1970/01/01的年數(shù)
代碼如下:
var minutes = 1000*60;//一分鐘有60秒,一秒有60毫秒,下面依次類推
var hours = minutes*60;
var days = hours*24;
var years = days*365;
var d = new Date();
var t = d.getTime();//獲得距離1970/01/01的毫秒數(shù)
var y = t/years;
document.write("It's been: " + y + " years since 1970/01/01!");
輸出:It's been: 42.82773990521943 years since 1970/01/01!
注:此時(shí)的年份是一個(gè)小數(shù),可以將其換成整數(shù)(其實(shí)Javascript中沒有整數(shù)的區(qū)別)
最后一行修改為:
代碼如下:
document.write("It's been: " + parseInt(y) + " years since 1970/01/01!");
輸出:It's been: 42 years since 1970/01/01!
parseInt(float);可以將浮點(diǎn)類型轉(zhuǎn)換為整型
2.12、getTimezoneOffset() 方法可返回格林威治時(shí)間和本地時(shí)間之間的時(shí)差,以分鐘為單位。
注:
getTimezoneOffset() 方法返回的是本地時(shí)間與 GMT 時(shí)間或 UTC 時(shí)間之間相差的分鐘數(shù)。
實(shí)際上,該函數(shù)告訴我們運(yùn)行 JavaScript 代碼的時(shí)區(qū),以及指定的時(shí)間是否是夏令時(shí)。
返回之所以以分鐘計(jì),而不是以小時(shí)計(jì),原因是某些國(guó)家所占有的時(shí)區(qū)甚至不到一個(gè)小時(shí)的間隔。
代碼如下:
var d = new Date();
document.write(d.getTimezoneOffset());
輸出:-480(東八區(qū),8*60)
因此可以根據(jù)此方法來判斷所在時(shí)區(qū)
代碼如下:
function checkzone(zone)
{
if (zone==0)
{
return "零時(shí)區(qū)";
}
else if (zone>0)
{
return "西"+parseInt(zone/60)+"區(qū)";
}
else
{
return "東"+parseInt(Math.abs(zone/60))+"區(qū)";
}
}
var d = new Date();
document.write(checkzone(d.getTimezoneOffset()));
其中Math.abs()為求絕對(duì)值
2.13、parse() 方法可解析一個(gè)日期時(shí)間字符串,并返回 1970/1/1 午夜距離該日期時(shí)間的毫秒數(shù)。
parse(str);str為字符串,是一個(gè)符合時(shí)間格式的字符串
代碼如下:
var minutes = 1000 * 60;
var hours = minutes * 60;
var days = hours * 24;
var years = days * 365;
var t = Date.parse("Jul 8, 2005");
var y = t/years;
document.write("It's been: " + parseInt(y) + " years from 1970/01/01");
document.write(" to 2005/07/08!");
輸出為:It's been: 35 years from 1970/01/01 to 2005/07/08!
2.14、setDate() 方法用于設(shè)置一個(gè)月的某一天。
setDate(day),day必需。表示一個(gè)月中的一天的一個(gè)數(shù)值(1 ~ 31)。
注,此方法是在原先對(duì)象的基礎(chǔ)上進(jìn)行修改,會(huì)改變?cè)葦?shù)據(jù)的值
例:
代碼如下:
var d = new Date();
document.write(d.getDate()+"<br>");
d.setDate(31);
document.write(d.getDate());
輸出:19 31
2.15、setMonth() 方法用于設(shè)置月份,與setDate()使用方法一直,也會(huì)改變?cè)璂ate對(duì)象
setMonth(month,day),目前可能不支持第二個(gè)參數(shù),month必需。一個(gè)表示月份的數(shù)值,該值介于 0(一月) ~ 11(十二月) 之間。
假如支持day參數(shù)的話,day代表的是月中某一天的數(shù)值,介于 1 ~ 31 之間。用本地時(shí)間表示。
代碼如下:
var d = new Date();
document.write(d.getMonth()+" "+d.getDate()+"<br>");
d.setMonth(11,26);
document.write(d.getMonth()+" "+d.getDate());
輸出為:9 19 11 26
2.16、setFullYear() 方法用于設(shè)置年份。
setFullYear(year,month,day);
year 必需。表示年份的四位整數(shù)。用本地時(shí)間表示。
month 可選。表示月份的數(shù)值,介于 0 ~ 11 之間。用本地時(shí)間表示。
day 可選。表示月中某一天的數(shù)值,介于 1 ~ 31 之間。用本地時(shí)間表示。
代碼如下:
var d = new Date();
d.setFullYear(1992,10,3);
document.write(d);
輸出為:Tue Nov 03 1992 11:31:58 GMT+0800
2.17、setHours() 方法用于設(shè)置指定的時(shí)間的小時(shí)字段。
setHours(hour,min,sec,millisec);
hour 必需。表示小時(shí)的數(shù)值,介于 0(午夜) ~ 23(晚上11點(diǎn)) 之間,以本地時(shí)間計(jì)(下同)。
min 可選。表示分鐘的數(shù)值,介于 0 ~ 59 之間。在 EMCAScript 標(biāo)準(zhǔn)化之前,不支持該參數(shù)。
sec 可選。表示秒的數(shù)值,介于 0 ~ 59 之間。在 EMCAScript 標(biāo)準(zhǔn)化之前,不支持該參數(shù)。
millisec 可選。表示毫秒的數(shù)值,介于 0 ~ 999之間。在 EMCAScript 標(biāo)準(zhǔn)化之前,不支持該參數(shù)。
代碼如下:
var d = new Date()
d.setHours(15,35,1)
document.write(d)
輸出為:Fri Oct 19 15:35:01 UTC+0800 2012
2.18、setMinutes() 方法用于設(shè)置指定時(shí)間的分鐘字段。
setMinutes(min,sec,millisec)
min 必需。表示分鐘的數(shù)值,介于 0 ~ 59 之間,以本地時(shí)間計(jì)(下同)。
sec 可選。表示秒的數(shù)值,介于 0 ~ 59 之間。在 EMCAScript 標(biāo)準(zhǔn)化之前,不支持該參數(shù)。
millisec 可選。表示毫秒的數(shù)值,介于 0 ~ 999 之間。在 EMCAScript 標(biāo)準(zhǔn)化之前,不支持該參數(shù)。
代碼如下:
var d = new Date()
d.setMinutes(1)
document.write(d)
輸出為:Fri Oct 19 11:01:11 UTC+0800 2012
2.19、setSeconds() 方法用于設(shè)置指定時(shí)間的秒字段。
setSeconds(sec,millisec)
sec 必需。表示秒的數(shù)值,該值是介于 0 ~ 59 之間的整數(shù)。
millisec 可選。表示毫秒的數(shù)值,介于 0 ~ 999 之間。在 EMCAScript 標(biāo)準(zhǔn)化之前,不支持該參數(shù)。
2.20、setMilliseconds() 方法用于設(shè)置指定時(shí)間的毫秒字段。
setMilliseconds(millisec)
millisec 必需。用于設(shè)置 dateObject 毫秒字段,該參數(shù)是介于 0 ~ 999 之間的整數(shù)。
2.21、setTime() 方法以毫秒設(shè)置 Date 對(duì)象。
此方法是比較常用的方法,在數(shù)據(jù)庫中存放Date.getTime()毫秒數(shù),
在返回時(shí)如何顯示出來呢,就是用此方法
setTime(millisec)
millisec 必需。要設(shè)置的日期和時(shí)間據(jù) GMT 時(shí)間 1997 年 1 月 1 日午夜之間的毫秒數(shù)。
這種類型的毫秒值可以傳遞給 Date() 構(gòu)造函數(shù),可以通過調(diào)用 Date.UTC() 和 Date.parse() 方法獲得該值。以毫秒形式表示日期可以使它獨(dú)立于時(shí)區(qū)。
代碼如下:
var d = new Date();
d.setTime(77771564221);
document.write(d);
輸出為:Mon Jun 19 1972 11:12:44 GMT+0800
此種方法就可以根據(jù)數(shù)據(jù)庫中存放的long數(shù)據(jù)類型將其轉(zhuǎn)換為了時(shí)間對(duì)象
2.22、toTimeString() 方法可把 Date 對(duì)象的時(shí)間部分轉(zhuǎn)換為字符串,并返回結(jié)果。
代碼如下:
var d = new Date();
document.write(d.toTimeString());
輸出:11:50:57 GMT+0800
2.23、toDateString() 方法可把 Date 對(duì)象的日期部分轉(zhuǎn)換為字符串,并返回結(jié)果。
代碼如下:
var d = new Date();
document.write(d.toDateString());
輸出:Fri Oct 19 2012
3、實(shí)例
實(shí)例一:
計(jì)算合同到期時(shí)間等
要求:①創(chuàng)建Date對(duì)象保存員工入職日期;
②合同有效期為3年,計(jì)算合同到期時(shí)間;
③合同到期前,需要提前一個(gè)月續(xù)簽。如果提前一月的續(xù)簽時(shí)間剛好是周末,則需要提前到上一個(gè)周五,計(jì)算續(xù)簽時(shí)間;
④要求在續(xù)簽時(shí)間前一周,向員工發(fā)出續(xù)簽提醒,計(jì)算提醒時(shí)間。
//入職時(shí)間var hireDate = new Date("2012/6/30");//賦值對(duì)象給endDatevar endDate = new Date(hireDate.getTime());
endDate.setFullYear(endDate.getFullYear()+3);//var resumeDate = new Date(endDate.getTime());
resumeDate.setMonth(resumeDate.getMonth()-1);if(resumeDate.getDay()==6){
resumeDate.setDate(resumeDate.getDate()-1);
}if(resumeDate.getDay()==0){
resumeDate.setDate(resumeDate.getDate()-2);
}var alertDate = new Date(resumeDate.getTime());
alertDate.setDate(alertDate.getDate()-7);
console.log("到期時(shí)間:"+endDate.toLocaleDateString());
console.log("續(xù)簽時(shí)間:"+resumeDate.toLocaleDateString());
console.log("提醒時(shí)間:"+alertDate.toLocaleDateString());
實(shí)例二:
計(jì)算明天開始,任意工作日之后的日期
var now = new Date();var days = 10;for(var i=0;i<days;i++){
/*if(now.getDay()==5){
now.setDate(now.getDate()+2);
}else if(now.getDay()==6){
now.setDate(now.getDate()+1);
}
now.setDate(now.getDate()+1);*/
//簡(jiǎn)寫
now.setDate(now.getDate() + (now.getDay()==5 ? 3 : now.getDay()==6 ? 2 : 1));
}
console.log(now.toLocaleDateString());
實(shí)例三:
自定義format方法,格式化日期
//返回形如“2017年3月2日 星期四 上午 11:12:31”function format (date){
var days = ["星期日","星期一","星期二","星期三","星期四","星期五","星期6"];
//獲取date的年份
var year = date.getFullYear();
//獲取date的月份,將月份格式化成兩位數(shù)保存
var month = date.getMonth()<10 ? "0"+date.getMonth() : date.getMonth();
//獲取date的日期,將日期格式化成兩位數(shù)保存
var d = date.getDate()<10 ? "0"+date.getDate() : date.getDate();
//從days數(shù)組中獲得date的星期對(duì)應(yīng)位置的星期名
var day = days[date.getDay()];
//獲得date的小時(shí),保存為兩位數(shù)
var hour = date.getHours();
var am = hour<12 ? "上午" : "下午";
hour = hour<12 ? hour : hour-12;
var minute = date.getMinutes();
var second = date.getSeconds();
return year+"年"+month+"月"+d+"日 "+day+" "+am+" "+hour+":"+minute+":"+second;
}
console.log(format(new Date()));