JavaScript中带日期的操作

当我们把日期转换为Number类型的时候,就会变成时间戳(毫秒)

const future = new Date(2037, 10, 19, 15, 23);
console.log(Number(future));
// console.log(+future); //与上行代码等效

在这里插入图片描述

● 所以我们就可以利用时间戳去做点东西,例如你的女朋友给你两个时间,一个时间是第一次约会的时间,第二个时间是第二次约会的时间,问你第一次约会和第二次约会间隔多少天?

const calcDaysPassed = (date1, date2) =>
  (date2 - date1) / (1000 * 60 * 60 * 24);

const day1 = calcDaysPassed(new Date(2037, 3, 4), new Date(2037, 3, 14));
console.log(day1);

在这里插入图片描述

但是为了防止出现负数,我们还是给加上绝对值

const calcDaysPassed = (date1, date2) =>  //定义一个函数,可以传两个参数
  Math.abs(date2 - date1) / (1000 * 60 * 60 * 24);  //用参数2减去参数1,然后取绝对值,最后转换为天数

const day1 = calcDaysPassed(new Date(2037, 3, 4), new Date(2037, 3, 14));  //传值
console.log(day1);  //打印

实例

现在我们将我们学习的知识加到我们实际的项目上去
在这里插入图片描述

之前我们制作好了这个时间,但是我们现在想时间如果这个时间是今天,就显示今天,不必显示详细时间,昨天显示昨天,类似这样

movs.forEach(function (mov, i) {
    const type = mov > 0 ? 'deposit' : 'withdrawal';

    const date = new Date(acc.movementsDates[i]);
    const day = `${date.getDate()}`.padStart(2, 0);
    const month = `${date.getMonth() + 1}`.padStart(2, 0);
    const year = date.getFullYear();
    const displayDate = `${day}/${month}/${year}`;

    const html = `
      <div class="movements__row">
        <div class="movements__type movements__type--${type}">${
      i + 1
    } ${type}</div>
        <div class="movements__date">${displayDate}</div>
        <div class="movements__value">${mov.toFixed(2)}€</div>
      </div>
    `;

    containerMovements.insertAdjacentHTML('afterbegin', html);
  });
};

这个是我们之前的代码,现在我们将时间定义的拿走,不然我们没法直接定义

const formatMovementDate = function (date) {
  const calcDaysPassed = (date1, date2) =>
    Math.round(Math.abs(date2 - date1) / (1000 * 60 * 60 * 24));

  const daysPassed = calcDaysPassed(new Date(), date);

  if (daysPassed === 0) return '今天'; //如果天数等于0,那就输出今天
  if (daysPassed === 1) return '昨天'; //如果天数等于1,那就输出昨天
  if (daysPassed <= 7) return `${daysPassed} 天前`;//如果天数小于等于七天,那就输出几天内

  const day = `${date.getDate()}`.padStart(2, 0);  //如果上面都不匹配的话,我们直接输出真实的时间
  const month = `${date.getMonth() + 1}`.padStart(2, 0);
  const year = date.getFullYear();
  return `${day}/${month}/${year}`;
};

const displayMovements = function (acc, sort = false) {
  containerMovements.innerHTML = '';

  const movs = sort
    ? acc.movements.slice().sort((a, b) => a - b)
    : acc.movements;

  movs.forEach(function (mov, i) {
    const type = mov > 0 ? 'deposit' : 'withdrawal';
    const date = new Date(acc.movementsDates[i]);
    const displayDate = formatMovementDate(date);

    const html = `
      <div class="movements__row">
        <div class="movements__type movements__type--${type}">${
      i + 1
    } ${type}</div>
        <div class="movements__date">${displayDate}</div>
        <div class="movements__value">${mov.toFixed(2)}€</div>
      </div>
    `;

    containerMovements.insertAdjacentHTML('afterbegin', html);
  });
};

在这里插入图片描述

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:/a/627875.html

如若内容造成侵权/违法违规/事实不符,请联系我们进行投诉反馈qq邮箱809451989@qq.com,一经查实,立即删除!

相关文章

Ceph集群扩容及数据再均衡原理分析

用户文件在Ceph RADOS中存储、定位过程大概包括&#xff1a;用户文件切割成对象、对象映射到PG、PG分组PGP、PG映射到OSD。这些过程中&#xff0c;可能涉及了大量概念和变量&#xff0c;而其实它们大部分是通过HASH、CRUSH等算法计算出来的&#xff0c;初始参数可能也就只有这么…

【源码】相亲交友系统全新UI/情感测试/婚庆中介/交友系统

【交友】相亲交友系统全新UI/情感测试/婚庆中介/交友系统 带商城&#xff0c;情感测试。 https://www.52codes.cc/codes/qt

swift语法新手快速入门,10分钟足以

编程语言教程中的第一个程序应该在屏幕上打印“Hello, world”。在 Swift 中&#xff0c;可以用一行代码实现&#xff1a; print("Hello, world!") 如果你写过 C 或者 Objective-C 代码&#xff0c;那你应该很熟悉这种形式——在 Swift 中&#xff0c;这行代码就是…

是德keysight N1911A与N1913A单通道功率计

Agilent N1911A和N1912A P系列单通道和双通道功率计以及N192XA传感器可提供宽带宽和高性能测量&#xff0c;这是确保用户的产品符合其功率规范所需要的。 P系列功率计具有30MHz视频带宽和每秒100M/s 的持续采样率&#xff0c;可进行快速、准确、可重复的功率测量。当这些功…

音视频入门基础:像素格式专题(2)——不通过第三方库将RGB24格式视频转换为BMP格式图片

音视频入门基础&#xff1a;像素格式专题系列文章&#xff1a; 音视频入门基础&#xff1a;像素格式专题&#xff08;1&#xff09;——RGB简介 音视频入门基础&#xff1a;像素格式专题&#xff08;2&#xff09;——不通过第三方库将RGB24格式视频转换为BMP格式图片 一、引…

抖音、快手、百度极速版挂机项目分享、看广告收益最多的软件!快手极速版挂机脚本,刷金币脚本、挂机项目、免费分享!

“看小说就能赚钱”、“刷视频就能赚钱”...... 号称动动手指就能赚钱的APP越来越多&#xff0c;比如各种极速版的APP、电子书APP、新闻资讯APP、搜索APP等等。 很多人也都乐此不疲&#xff0c;一天到晚就是“刷刷刷”。 最近一位“阿姨”晒各种“赚钱的APP”收入截图在业内传…

【LeetCode:23. 合并 K 个升序链表 + 链表 + 归并 + 递归】

&#x1f680; 算法题 &#x1f680; &#x1f332; 算法刷题专栏 | 面试必备算法 | 面试高频算法 &#x1f340; &#x1f332; 越难的东西,越要努力坚持&#xff0c;因为它具有很高的价值&#xff0c;算法就是这样✨ &#x1f332; 作者简介&#xff1a;硕风和炜&#xff0c;…

正点原子FreeRTOS学习笔记——列表与列表项

目录 一、什么是列表和列表项 1、概念 2、FreeRTOS代码 &#xff08;1&#xff09;列表 &#xff08;2&#xff09;列表项 &#xff08;3&#xff09;迷你列表项 二、列表与列表项初始化 1、列表初始化 2、列表项初始化 三、列表插入与删除列表项 1、原理解释 2、…

Django使用

一、根目录下安装 pip install django 二、创建djiango项目 django-admin startproject 项目名称 三、创建app python manage.py startapp app名称 四、启动 python manage.py runserver 五、编写URL与视图关系&#xff0c;相对路径 1、manage.py&#xff08;见资源绑定…

(十)Python基础练习题一(50道选择题)#Python

本文整理了Python基础知识相关的练习题&#xff0c;共50道&#xff0c;适用于刚入门初级Python想巩固基础的同学。来源&#xff1a;如荷学数据科学题库&#xff08;技术专项-Python一&#xff09;。 1&#xff09; 2&#xff09; 3&#xff09; 4&#xff09; 5&#xff09; 6…

Vue的学习 —— <vue组件>

目录 前言 正文 一、选项式API与组合式API 二、生命周期函数 1、onBeforeMount() 2、onMounted() 3、onBeforeUpdate() 4、onUpdated() 5、onBeforeUnmount() 6、onUnmounted() 三、组件之间的样式冲突 四、父组件向子组件传递数据 1、定义props 2、静态绑定props…

java内容快速回顾+SSM+SpringBoot简要概述

文章目录 java基础知识基本知识列表面对对象堆与栈的关系值修改与引用修改异常&#xff1a;错误异常 SSMspringMVCServletSpringMVC&#xff1a;基于 Servlet的 Spring Web 框架&#xff0c; spring控制反转 IoC(Inversion of Control)面向切面 Aop MybatisJDBCMybatis SpringB…

【启明智显技术分享】工业级HMI芯片--Model系列(Model3C/Model3/Model4)烧录操作指南

前言 「Model系列」芯片是启明智显针对工业、行业以及车载产品市场推出的系列HMI芯片&#xff0c;主要应用于工业自动化、智能终端HMI、车载仪表盘、串口屏、智能中控、智能家居、充电桩显示屏、储能显示屏、工业触摸屏等领域。此系列具有高性能、低成本的特点&#xff0c;支持…

失误删除也能救回,推荐前10款手机数据恢复软件!

在手机的日常使用中&#xff0c;不可避免的会误删数据&#xff0c;这些数据可能包括照片、视频、联系人、短信等重要信息。不过好在市面上有很多优秀的手机数据恢复软件&#xff0c;可以帮助我们从各种情况下恢复丢失的数据。 本文将为您推荐十大手机数据恢复软件&#xff0c;…

【全开源】JAVA同城圈子达人交友系统源码支持微信小程序+微信公众号+H5+APP

同城达人 精准匹配&#xff1a;系统通过用户填写的个人信息和兴趣爱好&#xff0c;运用智能算法进行精准匹配&#xff0c;推荐合适的同城朋友。多种互动方式&#xff1a;提供在线聊天、语音通话、视频交流等多种互动方式&#xff0c;让用户能够随时随地与朋友保持联系。本地生…

外贸营销脚本,自动化营销工具的制作!

在当今全球化的商业环境下&#xff0c;外贸行业面临着日益激烈的竞争&#xff0c;为了提高营销效率、降低成本并增加销售额&#xff0c;许多外贸企业开始寻求自动化营销的解决方案。 本文将深入探讨外贸自动化营销脚本与工具的制作方法&#xff0c;并分享五段实用的源代码&…

2023年数维杯国际大学生数学建模挑战赛C题人工智能生成文本的智能识别与检测解题全过程论文及程序

2023年数维杯国际大学生数学建模挑战赛 C题 人工智能生成文本的智能识别与检测 原题再现&#xff1a; 近年来&#xff0c;随着信息技术的飞速发展&#xff0c;人工智能的各种应用应运而生。典型应用包括机器人导航、语音识别、图像识别、自然语言处理和智能推荐等。其中&…

【class8】人工智能初步(图像识别-----卷积神经网络)

上节回顾 上节课&#xff0c;我们简单了解了图像识别和深度学习的相关知识。 快速回顾一下吧&#xff5e; A图像识别是以图像的主要特征为基础的。B. 图像分辨率决定图像的质量。 C&#xff0e; 像素是图像中的最小单位D. 在图像识别的原理上&#xff0c;计算机和人类在本质…

富唯智能复合机器人:CNC铝块上下料安全新标准

在CNC铝块加工过程中&#xff0c;上下料环节的安全问题一直是企业关注的焦点。富唯智能复合机器人的应用&#xff0c;为这一环节树立了新的安全标准。 传统的上下料方式往往依赖于人工操作&#xff0c;存在着较大的安全隐患。而富唯智能复合机器人采用先进的视觉识别技术和精准…

机器学习中常用的几种距离——欧式、余弦等

目录 一、欧式距离&#xff08;L2距离&#xff09;二、曼哈顿距离&#xff08;L1距离&#xff09;三、汉明距离四、余弦相似度 一、欧式距离&#xff08;L2距离&#xff09; &#xff08;1&#xff09;二维空间的距离公式&#xff08;三维空间的在这个基础上类推&#xff09;&…