JS常用的公共方法

 1.获取当前年月日

// 获取当前年月日
export function getNowFormatDate(interval = "/") {let date = new Date(),year = date.getFullYear(), //获取完整的年份(4位)month = date.getMonth() + 1, //获取当前月份(0-11,0代表1月)strDate = date.getDate(); // 获取当前日(1-31)if (month < 10) month = `0${month}`; // 如果月份是个位数,在前面补0if (strDate < 10) strDate = `0${strDate}`; // 如果日是个位数,在前面补0return `${year}${interval}${month}${interval}${strDate}`;
}

 2.获取当前时分秒

// 获取当前时分秒
const formatV = (val) => {if (val < 10) return "0" + val;return val;
};
export function getLocalTime() {var date = new Date();// var Y = date.getFullYear() + '-'// var M = formatV(date.getMonth() + 1) + '-'// var D = formatV(date.getDate()) + ' 'var h = formatV(date.getHours()) + ":";var m = formatV(date.getMinutes()) + ":";var s = formatV(date.getSeconds());return h + m + s;
}

 3.获取当前星期

// 获取当前星期
export function getWeekDay() {const WeekDays = ["星期日","星期一","星期二","星期三","星期四","星期五","星期六",];return WeekDays[new Date().getDay()];
}

 4.获取本月第一天日期

// 获取本月第一天日期
export function getMonthFirst() {const currentDate = new Date();const year = currentDate.getFullYear(); //获取当前年const month = String(currentDate.getMonth() + 1).padStart(2, "0"); //获取当前月const firstDay = "01"; //日return `${year}-${month}-${firstDay}`;
}

 5.获取本月最后一天日期

// 获取本月最后一天日期
export function getMonthLast() {// 获取当前日期const currentDate = new Date();// 获取当前年份let year = currentDate.getFullYear();// 获取下个月的月份,使用 padStart 在月份小于 10 时在前面补零let month = String(currentDate.getMonth() + 2).padStart(2, "0");// 如果月份为 '13',说明当前是12月,需要更新年份并将月份设置为 '01'if (month === "13") {year = year + 1;month = "01";}// 设置每个月的第一天为 '01'let firstDay = "01";// 构建下个月的第一天的日期字符串,格式为 'YYYY-MM-DD'const firstDayOfNextMonth = `${year}-${month}-${firstDay}`;// 计算当前月的最后一天,通过减去一天的毫秒数来得到const lastDayOfMonth = new Date(new Date(firstDayOfNextMonth).getTime() - 86400000);// 将最后一天的日期转换为 ISO 格式,并提取日期部分return lastDayOfMonth.toISOString().split("T")[0];
}

  6.获取本年第一天日期

// 获取本年第一天日期
export function getYearFirst() {var date = new Date();var year = date.getFullYear();return year + "-" + "01" + "-" + "01";
}

 7.获取本年最后一天日期

// 获取本年最后一天日期
export function getYearLast() {// 获取当前年份const thisYear = new Date().getFullYear();// 创建下一年的第一天const nextYearFirstDay = new Date(thisYear + 1, 0, 1); // 注意:月份是从0开始的,0代表1月// 减去一天得到今年的最后一天const thisYearLastDay = new Date(nextYearFirstDay - 1);// 获取年月日const year = thisYearLastDay.getFullYear();const month = String(thisYearLastDay.getMonth() + 1).padStart(2, "0"); // 月份是从0开始的,所以需要加1const date = String(thisYearLastDay.getDate()).padStart(2, "0");// 组合成 YYYY-MM-DD 格式const formattedDate = `${year}-${month}-${date}`;return formattedDate;
}

8.时间戳转年月日

// 时间戳转年月日
export function formatDate(value) {if (typeof value == "undefined") {return "";} else {let date = new Date(parseInt(value));let y = date.getFullYear();let MM = date.getMonth() + 1;MM = MM < 10 ? "0" + MM : MM;let d = date.getDate();d = d < 10 ? "0" + d : d;// let h = date.getHours();// h = h < 10 ? "0" + h : h;// let m = date.getMinutes();// m = m < 10 ? "0" + m : m;// let s = date.getSeconds();// s = s < 10 ? "0" + s : s;return y + "-" + MM + "-" + d;}
}

 9.前端导出csv文件

// 前端导出csv文件
export function exportCsv(columns, dataList, fileName) {let title = columns.map(item => item.title);let keyArray = columns.map(item => item.key);let str = [];str.push(title.join(',') + '\n');for (let i = 0; i < dataList.length; i++) {const temp = [];for (let j = 0; j < keyArray.length; j++) {temp.push(dataList[i][keyArray[j]]);}str.push(temp.join(',') + '\n');} console.log(str)let uri = 'data:text/csv;charset=utf-8,\ufeff' + encodeURIComponent(str.join(''));let downloadLink = document.createElement('a');downloadLink.href = uri;downloadLink.download = fileName;document.body.appendChild(downloadLink);downloadLink.click();document.body.removeChild(downloadLink);
}

 10.前端导出xml文件

// 前端导出xml文件
export function exportXml(columns, dataList, fileName) {let str = '<?xml version="1.0" encoding="utf-8" ?>\n<dataSource>\n';dataList.forEach(dataItem => {str += `<dataItem>\n`;columns.forEach(columnsItem => {str += `<${columnsItem.key}>${dataItem[columnsItem.key]}</${columnsItem.key}>\n`;});str += `</dataItem>\n`;});str += '</dataSource>';let downloadLink = document.createElement('a');let uri = window.URL.createObjectURL(new Blob([str], { type: 'text/plain;charset=utf-8,\ufeff' }));downloadLink.href = uri;downloadLink.download = `${fileName}.xml`;downloadLink.click();window.URL.revokeObjectURL(uri);
}

 11.前端导出html文件

// 前端导出html文件
export function exportHtml(columns, dataList, fileName) {let str = '<table border="1" style="border-collapse: collapse;min-width:80%;margin:0 10%;">\n';columns.forEach(columnsItem => {str += `<th>${columnsItem.title}</th>\n`;});dataList.forEach(dataItem => {str += `<tr>\n`;columns.forEach(columnsItem => {str += `<td>${dataItem[columnsItem.key]}</td>\n`;});str += `</tr>\n`;});str += '</table>';let html = `<!DOCTYPE html><html lang="en"><head><meta charset="UTF-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>Document</title></head><body><h2 style="text-align:center">${fileName}</h2><div style="width:100%">${str}</div></body></html>`;let downloadLink = document.createElement('a');let uri = window.URL.createObjectURL(new Blob([html], { type: 'text/html;charset=utf-8,\ufeff' }));downloadLink.href = uri;downloadLink.download = `${fileName}.html`;downloadLink.click();window.URL.revokeObjectURL(uri);
}

 12.前端导出pdf文件

// 前端导出pdf文件
export function exportPDF(columns, dataList, fileName) {let str = '<table border="1" style="border-collapse: collapse;min-width:80%;margin:0 10%;">\n';columns.forEach(columnsItem => {str += `<th>${columnsItem.title}</th>\n`;});dataList.forEach(dataItem => {str += `<tr>\n`;columns.forEach(columnsItem => {str += `<td>${dataItem[columnsItem.key]}</td>\n`;});str += `</tr>\n`;});str += '</table>';let ele = document.createElement('div');ele.innerHTML = `<h2 style="text-align:center">${fileName}</h2><div style="width:100%">${str}</div>`;document.body.appendChild(ele);// var w = ele.offsetwidth; //获得该容器的宽// var h = ele.offsetwidth; //获得该容器的高// var offsetTop = ele.offsetTop + 24; //获得该容器到文档顶部的距离// var offsetLeft = ele.offsetLeft + 24; //获得该容器到文档最左的距离var w = 960; //获得该容器的宽var h = 1024; //获得该容器的高var offsetTop = 24; //获得该容器到文档顶部的距离var offsetLeft = 24; //获得该容器到文档最左的距离var canvas = document.createElement('canvas');var abs = 0;var win_i = document.body.clientwidth; //获得当前可视窗口的宽度(不包含滚动条)var win_o = window.innerwidth; //获得当前窗口的宽度(包含滚动条)if (win_o > win_i) {abs = (win_o - win_i) / 2; //获得滚动条长度的—半}canvas.width = w * 2; //将回布宽&&高放大两倍canvas.height = h * 2;var context = canvas.getContext('2d');context.scale(2, 2);context.translate(-offsetLeft - abs, -offsetTop);//这里默认横向没有滚动条的情况,因为offset.Left(),有无滚动条的时候存在差值,因此 transLate的时候,要把这个差值去掉html2canvas(ele, {allowTaint: true,scale: 2, //提升画面质量,但是会增加文件大小}).then(function(canvas) {var contentwidth = canvas.width;var contentHeight = canvas.height;//一页pdf显示htmL页面生成的canvas高度;var pageHeight = (contentwidth / 592.28) * 841.89;//未生成pdf 的htmL页面高度var leftHeight = contentHeight;//页面偏移var position = 0;//a4纸的尺寸[ 595.28,841.89],html页面生成的canvas在pdf中图片的宽高var imgwidth = 595.28;var imgHeight = (592.28 / contentwidth) * contentHeight;var pageData = canvas.toDataURL(' image/jpeg ', 1.0);var pdf = new jsPDF('', 'pt', 'a4');console.log(pdf);//有两个高度需要区分,一个是htmL页面的实际高度,和生成pdf的页面高度(841.89) 当内容未超过pdf—页显示的范围,无需分页if (leftHeight < pageHeight) {pdf.addImage(pageData, 'JPEG', 0, 0, imgwidth, imgHeight);} else {//分页while (leftHeight > 0) {pdf.addImage(pageData, 'JPEG', 0, position, imgwidth, imgHeight);leftHeight -= pageHeight;position -= 841.89;//避免添加空白页if (leftHeight > 0) {pdf.addPage();}}}pdf.save(`${fileName}.pdf`);document.body.removeChild(ele);});
}
const s2ab = s => {var buf;if (typeof ArrayBuffer !== 'undefined') {buf = new ArrayBuffer(s.length)var view = new Uint8Array(buf)for (var i = 0; i != s.length; ++i) view[i] = s.charCodeAt(i) & 0xffreturn buf} else {buf = new Array(s.length);for (var i = 0; i != s.length; ++i) buf[i] = s.charCodeAt(i) & 0xFF;return buf;}
} 

13.树状结构过滤掉某个属性值

//arr 数组 , value :过滤掉的值
export function recursivefilter(arr, value) {return arr.filter(item => {if (item.type === value) {return false}if(item.children && item.children.length > 0){item.children = recursivefilter(item.children , value)}return true})
}

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

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

网络安全——防火墙技术

目录 前言基本概念常见防火墙技术防火墙的主要功能防火墙的不足之处相关题目1.组织外部未授权用户访问内部网络2.DMZ区3.包过滤防火墙和代理服务防火墙 前言 这是在软件设计师备考时编写的资料文章&#xff0c;相关内容偏向软件设计师 基本概念 防火墙技术是网络安全领域中的…

如何在Node.js中执行解压缩文件操作

一、解压文件 1.安装依赖&#xff1a; 安装adm-zip依赖包&#xff1a;npm install adm-zip --save 安装iconv-lite依赖包&#xff1a;npm install iconv-lite --save 解压前的file文件夹结构&#xff1a; update-1.0.2.zip压缩包内容&#xff1a; 2.在depresssFile.js文件&…

鸿蒙是必经之路

少了大嘴的发布会&#xff0c;老实讲有点让人昏昏入睡。关于技术本身的东西&#xff0c;放在后面。 我想想来加把油~ 鸿蒙发布后褒贬不一&#xff0c;其中很多人不太看好鸿蒙&#xff0c;一方面是开源性、一方面是南向北向的利益问题。 不说技术的领先点&#xff0c;我只扯扯…

【网络原理】网络地址转换----NAT技术详解

&#x1f490;个人主页&#xff1a;初晴~ &#x1f4da;相关专栏&#xff1a;计算机网络那些事 我们在 IP协议 一文中介绍过&#xff0c;由于IPv4协议中 IP地址只有32位&#xff0c;导致最多只能表示 42亿9千万个IP地址。但我们需要通过IP地址来标识网络上的每一个设备&#x…

【p2p、分布式,区块链笔记 IPFS】go-ipfs windows系统客户端节点实现 kubo试用

Kubo &#xff08;go-IPFS&#xff09; 是最早和使用最广泛的 IPFS 实现。它包括&#xff1a; 一个 IPFS 守护程序服务器广泛的命令行工具用于控制节点的 HTTP RPC API用于向 HTTP 浏览器提供内容的 HTTP 网关 下载 https://dist.ipfs.tech/#go-ipfs 解压 初始化 C:\User…

docker-minio启动参数

完整命令 docker run -p 9000:9000 -p 9090:9090 -v /opt/minio/data:/data -d --name -d --restartalways minio -e "MINIO_ACCESS_KEYminio" -e "MINIO_SECRET_KEYminioadmin123" minio/minio server --console-address ":9090" -address &q…

IDEA开发工具使用技巧积累

一、IDEA 工具设置默认使用maven的settings.xml文件 第一步&#xff1a;打开idea工具&#xff0c;选中 File ——> New Projects Setup ——> Settings for New Projects 第二步&#xff1a;先设置下自动构建项目这个选项 第三步&#xff1a;选中 Build Tools ——>…

正点原子阿尔法ARM开发板-IMX6ULL(九)——关于SecureCRT连接板子上的ubuntu

文章目录 一、拨码器二、SecureCRT 一、拨码器 emmm,也是好久没学IMX6ULL了&#xff0c;也是忘了拨码器决定了主板的启动方式 一种是直接从TF卡中读取文件&#xff08;注意这里是通过imdownload软件编译好了之后&#xff0c;通过指令放入TF卡&#xff09; 一种是现在这种用串口…

日常笔记记录

1、Http 1.1 概念 HTTP 是 HyperText Transfer Protocol&#xff08;超文本传输协议&#xff09;的简写&#xff0c;它是 TCP/IP 协议集中的一个应用层协议&#xff0c;是客户端与服务端进行交互时必须遵循的规则。它用于定义 Web 浏览器与 Web 服务器之间交换数据的过程以及…

Golang | Leetcode Golang题解之第504题七进制数

题目&#xff1a; 题解&#xff1a; func convertToBase7(num int) string {if num 0 {return "0"}negative : num < 0if negative {num -num}s : []byte{}for num > 0 {s append(s, 0byte(num%7))num / 7}if negative {s append(s, -)}for i, n : 0, len…

verilog实现一个5bit序列检测器

以下是用 Verilog 实现一个 5bit 序列检测器的代码&#xff1a; module five_bit_sequence_detector(input clk,input reset,input [4:0] in,output reg detected );// 定义状态参数localparam IDLE 4b0000;localparam STATE1 4b0001;localparam STATE2 4b0010;localparam …

《虚拟现实的边界:探索虚拟世界的未来可能》

内容概要 在虚拟现实&#xff08;VR&#xff09;技术的浪潮中&#xff0c;我们见证了其从实验室的奇想逐渐走向日常生活的非凡旅程。技术发展的背后是不断突破的创新&#xff0c;早期的设备虽然笨重&#xff0c;但如今却趋向精致、轻巧&#xff0c;用户体验显著提升。想象一下…

ELK Stack与Graylog:强大的日志分析和可视化工具

ELK Stack的使用方法 ELK Stack由Elasticsearch、Logstash和Kibana三个核心组件组成&#xff0c;它们协同工作&#xff0c;提供了从日志收集、解析、存储到可视化的完整解决方案。 安装与配置Elasticsearch Elasticsearch是ELK Stack的存储和查询引擎&#xff0c;负责存储日…

Java并发学习总结:原子操作类

本文是学习尚硅谷周阳老师《JUC并发编程》的总结&#xff08;文末有链接&#xff09;。 基本类型原子类 AtomicIntegerAtomicLongAtomicBoolean AtomicInteger 的方法 getAndIncrement 和 incrementAndGet 的区别&#xff1a; 两个方法都能实现对当前值加 1 &#xff0c; 但…

7 种常见的前端攻击

大家都知道&#xff0c;保证网站的安全是十分重要的&#xff0c;一旦网站被攻陷&#xff0c;就有可能造成用户的经济损失&#xff0c;隐私泄露&#xff0c;网站功能被破坏&#xff0c;或者是传播恶意病毒等重大危害。所以下面我们就来讲讲7 种常见的前端攻击。 1. 跨站脚本 (X…

家用wifi的ip地址固定吗?换wifi就是换ip地址吗

在探讨家用WiFi的IP地址是否固定&#xff0c;以及换WiFi是否就意味着换IP地址这两个问题时&#xff0c;我们首先需要明确几个关键概念&#xff1a;IP地址、家用WiFi网络、以及它们之间的相互作用。 一、家用WiFi的IP地址固定性 家用WiFi环境中的IP地址通常涉及两类&#xff1a…

图解:什么是多租户?

大家好&#xff0c;我是汤师爷~ 什么是多租户&#xff1f; 多租户是SaaS&#xff08;软件即服务&#xff09;领域里特有的一个概念。在SaaS服务中&#xff0c;“租户”指的就是使用这个SaaS系统的客户。 那么租户和用户有什么区别呢&#xff1f;举个例子。假设你正在使用一款…

springboot基本概念

springboot的配置文件? springboot的全局配置文件主要分为两个类型 yml和properties,并且必须以application开头,比如application.properties、application.yaml&#xff0c;两个文件的作用就是覆盖了springboot的自动配置的默认值&#xff0c;可以在这两个文件中去修改默认的…

从零开始的Go语言之旅(2 Go by Example: Values)

Go 语言有多种值类型&#xff0c;包括字符串、整数、浮点数、布尔值等。以下是一些基本示例。 package mainimport "fmt"func main() {fmt.Println("go" "lang")fmt.Println("11 ", 11)fmt.Println("7.0/3.0 ", 7.0/3.0)f…

[计算机网络]第一周

TCP/IP 与OSI TCP/IP TCP/IP 四层模型是一个分层网络通信模型&#xff0c;它将网络通信过程分为四个层次&#xff0c;这四层分别是&#xff1a;网络接口层、互联网层、传输层和应用层。 网络接口层负责在计算机和网络硬件之间传输数据&#xff0c;负责在物理网络上发送和接收…