重操旧业,继续码农生活,温故vue moment类库和new Date()

技术方面,越使用越熟练,越放越陌生,确实是这样。这几年在技术方面的投入减少了很多,工作职责发生了一些变化,更多的是一些比较杂的事情,工作本身也是心力交瘁。和领导沟通了下,说了些自己的想法,如果全局的事情做不好,就把具体的事情做好,也算是尽自己一些绵簿之力,至于职业或者未来可见的天花板,就这样吧,选择就是这样,失去了一些东西也得到了一些东西,如果无法改变现状就改变自己。人改变自己都很难.

从最初中断的地方重新开始,比如前端当年用的Vue 2,VS还是用的VS2019.几年过去了,需要再温故知新下了。

从一个开胃小菜开始。Vue中moment的使用,最近开发了一个小功能,用到了moment中的一些日期函数,查了一些资料,熟悉了下moment中常用的日期功能。

在Vue项目中,new Date()是JavaScript内置的对象,用于处理日期和时间;而moment是一个第三方库,提供了更丰富的日期操作功能。以下是它们的主要区别:

‌基本性质‌:

new Date()是原生JavaScript对象,无需额外安装即可使用;moment是一个独立的库,需要通过npm或yarn安装后引入。‌

‌功能丰富度‌:

new Date()支持基本的日期获取(如getFullYear、getMonth)和格式化方法(如toLocaleString),但复杂操作(如日期加减、相对时间计算)需要手动实现;moment提供了大量内置方法,例如format格式化、startOf/endOf设置日期边界、add/subtract进行时间计算,以及多语言支持。‌

‌使用便捷性‌:

new Date()直接通过实例调用方法,语法简单但灵活性有限;moment通过链式调用简化操作,例如moment().format('YYYY-MM-DD')可直接输出指定格式,且支持自定义解析和过滤器。‌

‌性能与体积‌:

new Date()作为原生对象,无额外体积开销;moment库体积较大(约未压缩时几十KB),可能影响项目加载速度,而轻量级替代品如Dayjs更注重性能。‌

6

‌国际化支持‌:

new Date()的格式化依赖本地环境设置,国际化处理需额外代码;moment内置多语言支持,可通过locale方法轻松切换中文等语言。‌

在实际开发中,若需求简单,new Date()足够高效;若涉及复杂日期逻辑(如时间范围筛选、格式转换),moment能提升开发效率,但需权衡体积影响。‌

1.moment 是一个 JavaScript 日期处理类库。

(1)引入库:npm install moment

(2)在main.js中全局引入,也可单独引入

import moment from "moment"

Vue.prototype.$moment = moment;

2.new Date()

let time = new Date(); //获取当前时间

let year = time.getFullYear(); //获取年 2025

let month = time.getMonth() + 1; //获取月 12

let day = time.getDate(); //获取天 15

let h = time.getHours(); //获取小时 21

let m = time.getMinutes(); //获取分钟 56

let s = time.getSeconds(); //获取秒 37

let weekDay = time.getDay(); //获取星期

相关推荐
一只机电自动化菜鸟7 分钟前
一建机电备考笔记(38) 焊接技术—焊接质量检验(含考频+题型)
笔记·学习·职场和发展·生活·学习方法
欧阳天风28 分钟前
vue+vite生产环境更新提示
前端·javascript·vue.js
布局呆星1 小时前
Pinia 综合笔记:介绍、两种 API、实例方法与持久化
前端·javascript·vue.js
fxshy1 小时前
Vue 项目中 vis-network 点击节点不生效的问题排查:外层 transform 缩放导致坐标偏移
前端·javascript·vue.js
智慧医养结合软件开源14 小时前
智慧养老系统医生管理模块:专业赋能,筑牢老人诊疗安全防线
大数据·人工智能·安全·生活
Bug-制造者16 小时前
【Vue3 实战】全局错误处理体系搭建:实现业务与错误彻底解耦
前端·javascript·vue.js
前端那点事18 小时前
Vue3+TS 封装高复用 ECharts 通用组件,自适应+防抖+主题切换,开箱即用
前端·vue.js
前端那点事18 小时前
Vue3+TS动态路由终极方案|后端权限、刷新不丢、按钮权限、解决所有404BUG
前端·vue.js
前端那点事18 小时前
Vue3+TS手写不定高虚拟列表Hooks,彻底解决长列表卡顿,生产直接复用
前端·vue.js