JavaScript Date与Array引用类型核心用法详解
深入解析JavaScript中的Date对象与Array数组,涵盖创建语法、关键注意事项(如月份索引)、内置转换与排序逻辑,以及ES5引入的强大数组操作方法。
一、Date对象:时间与格式的掌控
第1步:了解基础原理
JavaScript中的Date类型基于UTC时间构建,通过自1970年1月1日零时起经过的毫秒数来保存日期,能够覆盖该时间点前后约28万多年的范围。
第2步:使用Date构造函数创建日期对象
可以通过Date()构造函数初始化日期。若不传参,将获取当前日期和时间。若传入特定值,则需严格区分以下三种格式:
- 字符串解析格式:如
"2/27/2014"或"February 27, 2014"。此方式依赖内部解析。 - 独立数值参数格式:如
new Date(2014, 1, 27, 11, 24, 0)。关键注意:在此模式下,月份是从0开始计算的(即0代表一月),其余年份、日等均为必填项,未提供的参数默认为0。 - 混合参数格式:如果传入一个包含逗号的字符串(如
"2014,1,27,11,24,0"),浏览器会将其视为非标准格式而返回Invalid Date。
// 示例代码:正确的日期创建方式
var date1 = new Date("2/27/2014"); // Thu Feb 27 2014 00:00:00 GMT+0800
var date3 = new Date(2014, 1, 27, 11, 24, 0); // 注意:这里的 '1' 实际上是二月
第3步:掌握日期格式化与组件获取
Date类型提供了丰富的方法用于展示和操作时间:
toDateString():显示星期、月、日、年。toLocaleString():转换为本地特定的日期时间字符串格式。getMonth()等 getter 方法:用于提取具体的时间分量(同样遵循月份从0开始的规则)。
二、Array数组:灵活的数据集合
与其他语言不同,JavaScript数组具有两大特征:任意类型存储与动态大小增长(上限约为43亿项)。
第1步:数组的创建方式
- 使用构造函数:
new Array()。
- 当参数为单个数字时,创建一个长度为该数字的空数组。
- 当参数为非数字(如字符串)或其他数量时,该值成为数组的一项。 - 字面量表示法:
[]。
- 推荐使用的初始化方式,例如["red", "blue"]。
- 警告:在老旧浏览器(如IE8及以下)中,末尾的多余逗号可能导致意外的 undefined 项填充问题,建议始终确保尾部无多余逗号。
第2步:长度管理与读写
数组的 length 属性不仅可读,还可写。利用这一特性:
- 截断数组:手动缩小
length可直接移除末尾元素。 - 填补空白:增大
length会在尾部补充undefined。 - 安全写入:向不存在的索引赋值会自动扩容数组。
var colors = ['red', 'blue', 'green'];
colors.length = 2; // colors 变为 ['red', 'blue']
第3步:数组检测机制
在涉及多框架页面时,instanceof Array可能失效,因为不同环境下的 Array构造函数并不相同。因此,应优先使用ECMAScript 5提供的 Array.isArray(value) 方法来进行精确判断。
第4步:数组的核心操作方法
- 栈/队列模拟:
-push()/pop():尾进尾出(LIFO)。
-shift()/unshift():头出头进或头进(FIFO)。注意部分旧版IE下unshift返回值可能存在兼容性问题。 - 排序:
sort()与反转:reverse()
-sort()默认按字符串Unicode码点排序。若要排序数字,必须传入比较函数:function compare(a, b) { return a - b; } - 增删改查(splice):
splice(start, deleteCount, ...items)是一个强大但需小心的方法:删除指定数量的项后,可将新项插入到该位置,同时返回被删除的元素组成的数组。 - 切片:
slice()
用于在不修改原数组的情况下提取子数组。支持负数索引,且不包含结束位置的元素。
第5步:现代ES5迭代与归并方法
这是处理数据最高效的方式,均不会改变原数组:
- 过滤与映射:
filter()筛选符合条件的项生成新数组;map()对每一项执行转换生成新数组。 - 循环遍历:
forEach()替代传统for循环。 - 归并:
reduce()从左至右、reduceRight()从右至左,将数组折叠为单一最终值(常用于累加求和)。
// reduce 求和示例
var sum = values.reduce(function(prev, cur) {
return prev + cur;
}, 0); // 0 是初始值
以上就是JavaScript Date对象与Array数组引用类型的详细内容,更多关于前端基础知识的资料请关注本站其它相关文章!
本站声明
本文内容仅供参考,不代表本站观点。转载或引用请注明出处。如发现内容问题,请通过联系我们页面反馈。













