资讯专栏INFORMATION COLUMN

javascript引用类型之Date

tinna / 3403人阅读

摘要:实际上如果我们直接将字符串传入构造函数,后台也会调用方法。而直接与方法参数相同的值传入构造函数,获取的日期对象都是基于系统设置的本地时间创建的。中国标准时间中国标准时间中国标准时间由上面的代码可以发现,其实是的引用,发生变化时,也随之改变。

最近的项目需要实现一个时间表格的效果,如下图所示,每次更换第几周时也更新对应的日期。使用了Date类型,也踩了些坑。故写下此篇笔记。

Date类型

ECMAScript中的Date类型是在早期Java中的java.util.Date类基础上构建的。使用自UTC(1970
年1月1日零时)开始经过的毫秒数来保存日期

创建对象

获取当前时间

var d = new Date();//无参数时自动获得当前日期和时间

获取特定日期时间

Date.parse()

  var someday = new Date(Date.parse("Jul 1 2016"));

Date.UTC()

var someday = new Date(Date.UTC(2016,6,1,22,06,15));

具体含义

Date.parse()接受一个表示日期的字符串参数,若不能表示日期则返回NaN。实际上如果我们直接将字符串传入构造函数,后台也会调用Date.parse()方法。可接受的日期格式包括:6/15/2016;July 12,2016;Fri, July 25 2016 00:00:00 GMT-0700(时区);2016-07-01T00:00:00【最后一种表示反射只有兼容ECMAScript5的支持】

Date.UTC()构造的参数分别是年份、基于0的月份(0-11)、月中的哪天(1-31),小时(0-23),分钟、秒、毫秒。其中年和月的参数是必需的,若没有提供后面的参数,则默认为第一天,0时0分0秒。

需要注意的是,不同浏览器对于日期的解释有所差异。调用Date.UTC()方法时,直接console.log()出来的结果是当地时间,而不是GMT时间。但实际上UTC返回的是GMT时间。而直接与UTC方法参数相同的值传入Date()构造函数,获取的日期对象都是基于系统设置的本地时间创建的。

调用方法时的日期和时间的毫秒数,时间戳
//使用Date.now()方法【IE9+,Firefox 3+,Safari 3+,Opera 10.5,Chrome】
var start = Date.now();//开始时间
doSomething();//调用函数
var end = Date.now();//停止时间
var result = end-start;//执行时间

//使用+获取Date对象的时间戳【运行有误?望了解的人能告知】
var start = +new Date();
doSomething();
var end = +new Date();
var result = end - start;

//使用valueOf()获取时间戳
var start = (new Date()).valueOf();

//使用parse()获取时间戳
var start = Date.parse(new Date());
日期格式化方法

toLocaleString();

//"2016/7/1 下午11:01:45" 

toString()

//"Fri Jul 01 2016 23:01:45 GMT+0800 (中国标准时间)"

toDateString()

//"Fri Jul 01 2016"

toTimeString()

//"23:01:45 GMT+0800 (中国标准时间)"

toLocaleDateString()

//"2016/7/1"

toLocaleTimeString()

//"下午11:01:45"

toUTCString()

//"Fri, 01 Jul 2016 15:01:45 GMT"

但这些方法中,输出也是因浏览器而异。以上显示均在Chrome控制台输出。

日期时间组件方法

这次项目中所用到的方法即是setDate()方法,获取当天时间后,再利用setDate(today.getDate()+/-n)去获取日期。setDate()传入的参数若超过了该月中应有的天数,则增加月份。setDate()的返回值是时间戳,不能直接用today.setDate(n).toLocaleDateString(),而是应该在setDate(n)后再调用today.toLocaleDateString();
除此之外,这次还牵扯到对象引用的问题。

var x = new Date();
var y = x;
console.log(x);//Sat Jul 02 2016 00:08:10 GMT+0800 (中国标准时间)
x.setDate(15);
console.log(x);//Fri Jul 15 2016 00:08:10 GMT+0800 (中国标准时间)
console.log("y",y);//y Fri Jul 15 2016 00:08:10 GMT+0800 (中国标准时间)

由上面的代码可以发现,y其实是x的引用,x发生变化时,y也随之改变。若想改变这种情况,可使用var y = new Date(x);则y与x则不同。

文章版权归作者所有,未经允许请勿转载,若此文章存在违规行为,您可以联系管理员删除。

转载请注明本文地址:https://www.ucloud.cn/yun/79831.html

相关文章

  • 从[]==![]为true来剖析JavaScript各种蛋疼的类型转换

    摘要:将他们放在堆中是为了不影响栈的效率。所以简单数据类型的值直接存放在栈中。可以对比上面那张图默认是调用方法的依,于是等于空字符串。空字符串中国标准时间方法返回对象的原始值,可能是字符串数值或值等,看具体的对象。,需要两个操作数同时转为。 你是否在面试中遇到过各种奇葩和比较细节的问题? []==[] //false []==![] //true {}==!{} //false {}==![...

    Jeff 评论0 收藏0
  • JavaScript系列--浅析JavaScript解析赋值、浅拷贝和深拷贝的区别

    摘要:它将返回目标对象。有些文章说是深拷贝,其实这是不正确的。深拷贝相比于浅拷贝速度较慢并且花销较大。拷贝前后两个对象互不影响。使用深拷贝的场景完全改变变量之后对没有任何影响,这就是深拷贝的魔力。 一、赋值(Copy) 赋值是将某一数值或对象赋给某个变量的过程,分为: 1、基本数据类型:赋值,赋值之后两个变量互不影响 2、引用数据类型:赋址,两个变量具有相同的引用,指向同一个对象,相互之间有...

    laznrbfe 评论0 收藏0
  • JavaScript学习笔记(一)

    摘要:虽然会输出,但是这只是存在的一个悠久。在的最初版本中使用的是位系统,为了性能考虑使用低位存储变量的类型信息,开头代表是对象,然而表示为全零,所以将它错误的判断为。 参考来源: JavaScript高级程序设计: book.douban.com/subject/105… 千古壹号: github.com/qianguyihao… 小册前端面试之道: juejin.im/book/5bdc71…...

    pingan8787 评论0 收藏0
  • JavaScript专题类型判断(上)

    摘要:专题系列第四篇,讲解类型判断的各种方法,并且跟着写一个函数。返回值为表示操作数类型的一个字符串。考虑到实际情况下并不会检测和,所以去掉这两个类型的检测。 JavaScript专题系列第四篇,讲解类型判断的各种方法,并且跟着 jQuery 写一个 type 函数。 前言 类型判断在 web 开发中有非常广泛的应用,简单的有判断数字还是字符串,进阶一点的有判断数组还是对象,再进阶一点的有判...

    lk20150415 评论0 收藏0
  • 深入理解 Javascript 对象

    摘要:返回如下仔细分析下面的图,将会加深你的理解和我们有一个类对象有一个属性,其指向构造器的原型是一个类构造器是之后产生的。 撸js基础之对象 图例 showImg(https://segmentfault.com/img/remote/1460000015949904?w=768&h=448); 先谈谈 ECMAScript 中的数据类型 ES6 之前 ECMAScript 中有 5 种...

    neroneroffy 评论0 收藏0

发表评论

0条评论

最新活动
阅读需要支付1元查看
<