JS时间踩过的坑

time mud in JavaScript

Posted by yellowDog on 2018-06-15

获取今天是这个月份中的第几周

首先写个获取当前时间的函数吧~

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
const addZero = num => {
return num < 10 ? "0" + num : num;
};
const getCurrentDate = () => {
var today = new Date();
var year = today.getFullYear();
var month = today.getMonth() + 1;
var day = today.getDate();
var week = today.getDay();

function getFullDate() {
return year + "/" + addZero(month) + "/" + addZero(day);
}

function getYearMonth() {
return year + "/" + addZero(month);
}

return {
getFullDate,
getYearMonth
};
};

addZero函数是给月份和天数小于 10 的情况补 0 的

PS: IOS 时间戳只能用’/’,之前用的’-'被坑了很长时间

PPS: 之前查文档的时候发现 getYear()是 ES3 的方法,会出问题的,用 getFullYear()代替吧

MDN 上的文档

1
2
3
4
5
6
const getWeek = () => {
var date = new Date(getCurrentDate().getFullDate()),
week = date.getDay(),
day = date.getDate();
return Math.ceil((day + 6 - week) / 7);
};

week=getDay()是获取今天在星期几
6 - week 是当前周的还有几天过完(不算今天
day 是当前的日期
加起来除 7 就是在这个月份中的第几周啦


获取这个月第一天在星期几

1
2
3
4
5
6
const firstDay = () => {
var date = getCurrentDate().getYearMonth();
var year = date.split("/")[0];
var month = date.split("/")[1];
return new Date(`${year}/${Number(month)}/01`).getDay();
};

日历的主要逻辑

最终渲染的那个数组分三部分:

  • 这个月的第一天在星期几,计算出前面需要空几个
  • 这个月的天数
  • 最后一天的后面需要空多少个(根据下一个月的第一天)
    获取第一天是星期几在上面 ↑ 已经说过了,下个月的第一天的话,month+1 就好啦

获取天数也很简单

1
new Date(year, month, 0).getDate();

最后把这三部分 push 到数组里然后渲染就好了

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
let daysArr = [];
for (var a = 0; a < firstDay; a++) {
let day = {
day: " ",
select: false
};
daysArr.push(day);
}
for (var i = 0; i < days; i++) {
let day = {
day: i + 1,
select: false
};
daysArr.push(day);
}
if (nextFirstDay !== 0) {
for (var b = 0; b < 7 - nextFirstDay; b++) {
let day = {
day: " ",
select: false
};
daysArr.push(day);
}
}

渲染

1
2
3
<view wx:for='{{dateArr}}' wx:key='index' data-idx="{{index}}">
{{item.day}}
</view>