javascript 玩转Date对象(实例讲解)


Posted in Javascript onJuly 11, 2017

前言:最近在做一个日期选择功能,在日期转换的时候经常换到晕,总结一下常用的Date对象的相关用法,方便日后直接查看使用~

1. new Date()的使用方法有:

不接收任何参数:返回当前时间;

接收一个参数x: 返回1970年1月1日 + x毫秒的值。

new Date(1, 1, 1)返回1901年2月1号。
new Date(2016, 1, 1)不会在1900年的基础上加2016,而只是表示2016年2月1号。

2. 使用new Date(time) 将时间转换成 Date 对象

注意:time格式需要为 1999/12/31 23:59 (不能为1999-12-30 23:43),否则在一些机型下可能会报错。

3. date对象一些常用的api

new Date()转换之后的数据,可以直接使用下面的api
new Date(x).getMonth()+1  //获取月份
new Date(x).getDate //获取日期
new Date(x).getHours() //获取小时
new Date(x).getMinutes() //获取分钟
new Date(x).toLocaleDateString()); // 转换为本地日期格式,视环境而定,输出:2017年07月04日
new Date(x).toLocaleString()); // 转换为本地日期和时间格式,视环境而定,输出:2017年07月04日 上午10:03:05

4. javascript 没有原生提供但却经常需求使用的功能

根据日期获取当前星期几

//参数 日期
getWeek(day) {
  const weekArr = ['星期日', '星期一', '星期二', '星期三', '星期四', '星期五', '星期六'];
  return weekArr[day];
}
getWeek(new Date(x).getDay())

获取某个时间+1个小时,直接对小时数进行加1可能会溢出,因此先转换成 Date 对象,再使用setHours 改变小时。

new Date(x).setHours(new Date(x).getHours()+1,new Date(x).getMinutes());

为了统一格式,返回日期是10以下,需在前面补0.

function getFull(n) {
  return (n > 9 ? '' : '0') + n;
}
var x = getFull(3); //03
var y = getFull(11);  //11

经常要对日期进行转换,因此增加一个转换格式的函数

Date.prototype.Format = function (fmt) { //author: meizz
    var o = {
      "M+": this.getMonth() + 1, //月份
      "d+": this.getDate(), //日
      "h+": this.getHours(), //小时
      "m+": this.getMinutes(), //分
      "s+": this.getSeconds(), //秒
      "q+": Math.floor((this.getMonth() + 3) / 3), //季度
      "S": this.getMilliseconds() //毫秒
    };
    if (/(y+)/.test(fmt)) fmt = fmt.replace(RegExp.$1, (this.getFullYear() + "").substr(4 - RegExp.$1.length));
    for (var k in o)
      if (new RegExp("(" + k + ")").test(fmt)) fmt = fmt.replace(RegExp.$1, (RegExp.$1.length == 1) ? (o[k]) : (("00" + o[k]).substr(("" + o[k]).length)));
    return fmt;
  }
  // 调用:
  var time1 = new Date().Format("yyyy-MM-dd");
  var time2 = new Date().Format("yyyy-MM-dd hh:mm:ss");

以上这篇javascript 玩转Date对象(实例讲解)就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
prototype.js的Ajax对象
Sep 23 Javascript
Apply an AutoFormat to an Excel Spreadsheet
Jun 12 Javascript
通过身份证号得到出生日期和性别的js代码
Nov 23 Javascript
在JavaScript的AngularJS库中进行单元测试的方法
Jun 23 Javascript
javascript实现状态栏中文字动态显示的方法
Oct 20 Javascript
javascript每日必学之基础入门
Feb 16 Javascript
深入剖析javascript中的exec与match方法
May 18 Javascript
JavaScript面向对象分层思维全面解析
Nov 22 Javascript
Bootstrap文件上传组件之bootstrap fileinput
Nov 25 Javascript
JS正则表达式完美实现身份证校验功能
Oct 18 Javascript
VUE注册全局组件和局部组件过程解析
Oct 10 Javascript
JS+HTML5本地存储Localstorage实现注册登录及验证功能示例
Feb 10 Javascript
使用jQuery实现动态添加小广告
Jul 11 #jQuery
Vue中父组件向子组件通信的方法
Jul 11 #Javascript
实例讲解DataTables固定表格宽度(设置横向滚动条)
Jul 11 #Javascript
网页中的图片查看器viewjs使用方法
Jul 11 #Javascript
自定义事件解决重复请求BUG的问题
Jul 11 #Javascript
关于js中的鼠标事件总结
Jul 11 #Javascript
vue音乐播放器插件vue-aplayer的配置及其使用实例详解
Jul 10 #Javascript
You might like
一步一步学习PHP(7) php 字符串相关应用
2010/03/05 PHP
利用php+mcDropdown实现文件路径可在下拉框选择
2013/08/07 PHP
php 中文字符串首字母的获取函数分享
2013/11/04 PHP
PHP从FLV文件获取视频预览图的方法
2015/03/12 PHP
php 使用curl模拟登录人人(校内)网的简单实例
2016/06/06 PHP
PHP Socket网络操作类定义与用法示例
2017/08/30 PHP
网页常用特效代码整理
2006/06/23 Javascript
js中cookie的使用详细分析
2008/05/28 Javascript
JQUERY THICKBOX弹出层插件
2008/08/30 Javascript
一个javascript图片阅览组件
2010/11/09 Javascript
jQuery的12招常用技巧分享
2011/08/08 Javascript
详谈 Jquery Ajax异步处理Json数据.
2011/09/09 Javascript
漂亮! js实现颜色渐变效果
2016/08/12 Javascript
纯前端JavaScript实现Excel IO案例分享
2016/08/26 Javascript
BootStrop前端框架入门教程详解
2016/12/25 Javascript
微信小程序实现移动端滑动分页效果(ajax)
2017/06/13 Javascript
vue.js中created方法作用
2018/03/30 Javascript
解决layui上传文件提示上传异常,实际文件已经上传成功的问题
2018/08/19 Javascript
JavaScript学习笔记之图片库案例分析
2019/01/08 Javascript
详解vue-property-decorator使用手册
2019/07/29 Javascript
vue滚动插件better-scroll使用详解
2019/10/18 Javascript
JavaScript实现移动端拖动元素
2020/11/24 Javascript
[46:16]2018DOTA2亚洲邀请赛3月30日 小组赛B组 iG VS VP
2018/03/31 DOTA
[02:49:21]2019完美盛典全程录像
2019/12/08 DOTA
Python判断列表是否已排序的各种方法及其性能分析
2016/06/20 Python
Python温度转换实例分析
2018/01/17 Python
编写多线程Python服务器 最适合基础
2018/09/14 Python
Python3.5文件读与写操作经典实例详解
2019/05/01 Python
Python数据分析模块pandas用法详解
2019/09/04 Python
关于numpy.where()函数 返回值的解释
2019/12/06 Python
html5定位并在百度地图上显示的示例
2014/04/27 HTML / CSS
澳大利亚个性化儿童礼品网站:Bright Star Kids
2019/06/14 全球购物
软件测试工程师笔试题带答案
2015/03/27 面试题
计划生育证明书写要求
2014/09/17 职场文书
行政诉讼答辩状
2015/05/21 职场文书
nginx配置文件使用环境变量的操作方法
2021/06/02 Servers