重操旧业,继续码农生活,温故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(); //获取星期

相关推荐
墨染倾城殇6 小时前
蓝牙车钥匙方案:低功耗蓝牙模块引领科技与生活完美融合
科技·嵌入式硬件·生活·蓝牙模块·低功耗蓝牙·车钥匙解决方案
Kaze_story7 小时前
Vue第五章(1):scoped、组件通信
前端·javascript·vue.js
匠心网络科技7 小时前
前端框架-Vue为何开发更高效?
前端·javascript·vue.js·前端框架
哆啦A梦15887 小时前
商城后台管理系统 02 添加规格参数-动态表单
javascript·vue.js·elementui
nnnnna7 小时前
插槽(Slots)(完整详细版)
前端·vue.js
计算衎8 小时前
FastAPI后端和VUE前端的数据交互原理详解
前端·vue.js·fastapi
哆啦A梦15888 小时前
商城后台管理系统 03 规格参数配置
javascript·vue.js·elementui
小番茄夫斯基8 小时前
使用 pnpm + Workspaces 构建 Monorepo 的完整指南
前端·javascript·vue.js
shuaijie05188 小时前
两个表格进行相互联动
前端·javascript·vue.js