获取时间戳的几种方法

我们有两种方式获取,一种是new Date()得到时间对象,一种是Date函数对象静态方法获取。new Date()与Date的区别就是,前者是构造函数,后者是函数对象,函数对象返回的,只是我们需要的值,他不会有Date对象的内置方法(prototype),所以,它的使用更简洁明确,但是如果我们想要获取时间的年份,月份,星期几,那么new Date()才是最好的选择。new Date() 获取const date = new Date(); //没有传入参数获取当前本地时间 date.getTime(); //1626746413673 date.valueOf(); //1...

0
0
木灵鱼儿 1 个月前 JavaScript

javascript 生成随机密码,指定位数,难度(大小写、数字、特殊字符)

原理也没啥好藏着掖着的,就是为了保证密码难度,开头的字符一定是满足安全需要的,比如要求大小写数字加特殊字符,那么开头四位就一定是:大写一位、小写一位、数字一位、特殊字符一位;然后剩下的随机。/** * @description: 随机密码 * @param {*} len 密码位数 * @param {*} mode 密码难度:hide(大小写数字特殊字符)、medium(大小写数字)、low(小写数字) * @Date: 2021-07-02 15:52:32 * @Author: mulingyuer */ export const randomPass = functi...

0
0
木灵鱼儿 1 个月前 JavaScript

base64转file文件方法

使用canvas操作内容后,如果想保存图片之类的操作,就无可避免的要处理这一步,因为canvas导出的是base64格式的文件,如果你只做预览还好,存储的话,就要想办法了。我的想法是转成上传文件的那种file格式。方法如下:/** * @description: 将base64转换为文件对象 * @param {*} dataUrl base64 * @param {*} fileName 文件名 * @Date: 2021-06-30 14:33:47 * @Author: mulingyuer */ export function dataURLtoFile(dataUr...

0
0
木灵鱼儿 1 个月前 JavaScript

自己照着别人教程写的canvas操作类

预览图类源码/* * @Author: mulingyuer * @Date: 2021-06-21 11:29:12 * @LastEditTime: 2021-06-21 18:39:31 * @LastEditors: mulingyuer * @Description: canvas * @FilePath: \form-create\src\utils\canvas.js * 怎么可能会有bug!!! */ class Chart { constructor(options) { const defaultOptions = { el:...

0
0
自己照着别人教程写的canvas操作类
木灵鱼儿 1 个月前 JavaScript

JSON 格式化对象,对象中存在函数的解决办法,JSON格式化函数

json在格式化对象是,如果是普通的键值对对象还是没有问题的,但是如果他的值是一个函数,在格式化之后,函数就会被剔除。const a = { name: '我爱你', fn: function(){ console.log("我也爱你!") } }; const b = JSON.stringify(a);当你输出变量b的时候,你得到的会是:"{\"name\":\"我爱你\"}"fn不见了!引用JSON.stringify()方法描述中的一段解释:undefined、任意的函数以及 s...

173
0
木灵鱼儿 2 个月前 JavaScript

做个笔记 判断对象中是否存在某个属性

本来是一个很简单的需求:const a = { b:1 }本来我的需求是判断,这个a对象里面b是否存在,但是b的值不确定,他可能是布尔值false,也可能是数字0,或者是空字符。那么if(a.b)就不太行了,一般来说,老前端一般都是用in 操作符。"b" in a; //true但是es6后,一般来说,不建议这样使用的,同时不建议的还有delete操作符。于是问了下群友,因为我记得es6有那么一个方法,可以判断一个对象的属性是否存在,并且不会去查prototype上的内容。但是我忘了啥名字来着!const a = { b:1 } a.hasOwnPrope...

0
6
木灵鱼儿 2 个月前 JavaScript

目前前端下载文件的最佳实践

目前前端最佳的方案其实有两种:a元素下载iframe 无闪下载事实上这两种下载方式,其实都存在相同的一个问题,就是如果下载的文件是跨域的(不是同域名下的问题,或者其他原因);并且这个文件浏览器可以直接打开的,比如:图片、文本文件。那么浏览器会直接打开文件,并不是触发下载,而如果下载的文件是安装包,压缩包zip这些,则是触发下载。这个问题就很头疼。a元素下载的缺点a元素下载,那么就必须设置download属性,这个属性可以接收一个参数,可以是带后缀的文件名,或者不带后缀。也可以为空,但是要设。不带后缀的话文件格式就会与下载的文件保持一致,如果带了格式后缀,可能导致下载的jpg文件,你设置为...

26
0
目前前端下载文件的最佳实践
木灵鱼儿 3 个月前 JavaScript

异步队列管理器

造这个轮子其实也是没得办法,搜不到合适的轮子用,就只能自己干了。使用场景我们有N个异步任务promise,他们没有顺序关系,谁先触发都无所谓,但是我们只关心一点,如果某一个任务出错,后续就不要运行了,只有全部都success完成,那么才运行成功后的处理方式then。当然,我们肯定不能使用Promise.all运行N个任务,这等于是同步触发了,如果我有2000个任务,难道你也一口气发2000个任务,那这就不现实了,所以这里我们要引入线程概念,一个进程可以有多个线程,那么进程就是管理器,线程就是我们一次可以发多少个请求。线程是可以配置的,我们可以指定触发多少个线程,当1个线程完成后,我们要填...

0
0
木灵鱼儿 4 个月前 JavaScript

文件上传时对input标签的重置

今天就遇到了这个需求,当我上传文件超时或者失败后,再选择同一个文件上传,是不会触发change事件的,所以失败或者成功后我们需要重置下元素。<form action="" id="uploads"> <input type="file" id="fileUp"/> </form>1# 将整个form表单重置 $("#uploads")[0].reset(); //重置 2# 将当前input标签的value值设为空 document.getElem...

0
0
木灵鱼儿 4 个月前 JavaScript

目前最好用的 JavaScript判断变量类型

typeof无法准确的判断object类型,instanceof判断起来还需要new出对象,想来想去最稳的就是Object.prototype.toString.call,于是乎组合一下://判断数据类型 function getType(value) { let type = typeof value; if (type !== "object") { return type; } return Object.prototype.toString.call(value).slice(8, -1).toLowerCase...

0
0
木灵鱼儿 5 个月前 JavaScript

JavaScript 网站已运行xx年xx月xx小时xx分钟xx秒的方法

应狗群友的要求,写一个网站已经运行了多少时间的代码,本来php就完事了,非要js的。无奈总结了下百度上的一些方法,写了一个稍微花了点心思的方法,使用很简单,new出这个函数,在使用init初始化方法,传入参数即可,完全不需要jq。事先声明:本方法没有考虑到闰年平年月份统一30天计算所以时间上可能不是很准确,但是相对准确,233有能力完全可以自定义,我都有注释,中文友好满分。不多说,上代码function WebsiteElapsedTime() { //初始化 this.init = function({ id = "", ...

0
0
JavaScript 网站已运行xx年xx月xx小时xx分钟xx秒的方法
木灵鱼儿 5 个月前 JavaScript

axios 速读

快速了解axios常用功能,适用于对axios有一定使用经验的人。常用请求方法的参数axios.get(url, config);get方法支持两个参数,第一个是url,第二个是{}键值对配置对象。axios.post(url, data, config);post方法支持三个参数:请求地址,上传的数据{},{}键值对配置对象。当然还有一些其他请求类型,可以查看官方文档,这两种常用。除了.xxx方法使用协议,还可以直接传入配置对象的形式使用。axios({ method:'get', url:'xxxx', })这种方式比较适合封装使用。适用度广泛一些。一些常用的config配置...

0
0
axios 速读
木灵鱼儿 5 个月前 JavaScript

浅谈一下关于a链接通过下载链接下载文件的方法

群友今天让我帮忙改一下他站点下载音频文件的方法,为此有了这篇心得。首先当我通过api请求后端时,后端返回的其实是一个键值对对象,里面并没有实际的文件,只有一个url下载地址。https://xxxxxxasdasdas.mp3大概是这么一个地址段,可能会更长一些,总体是差不多。当时我想得挺简单,我直接就将这个url地址赋值给a元素href,然后a.click触发下载,但是实际上并不会下载,谷歌浏览直接就给你打开这个文件了。如果需要a链接下载这个文件,我们需要先将文件下载下来,然后本地转成url地址,再赋值给a元素,再click即可。于是代码如下://我的下载方法 function myD...

0
6
木灵鱼儿 6 个月前 JavaScript

fetch 请求报错处理思路

之前写过一片使用fetch下载文件的方法,但是如果后端返回一个错误对象,使用response.blob()会将这个错误对象直接转为blob对象,然后被转为文件下载下来。但实际上我们是要区分处理的,比如是文件流我们就下载文件,是错误对象,我们就进行错误提示和抛出错误。所以这里,我主要分享下我对错误处理的思路。基础知识首先,在fetch第一个then回调中,我们可以对response对象进行三种方法操作:response.text 返回的是一个纯文本 是一个promise对象response.json 返回的是一个对象(json/array) 是一个promise对象response.b...

0
0
fetch 请求报错处理思路
木灵鱼儿 6 个月前 JavaScript

js取消资源请求

之前研究了下axios的取消请求操作,也配合vue写了篇文章笔记,现在考虑下资源请求了。当vue页面在切换的时候,一般不同的页面有不同的api请求,也有一些资源的请求下载,比如图片,视频...;当资源文件很大,而服务器带宽不足,并且多个页面同时打开,很容易造成服务器的堵塞。而正因为堵塞,页面的资源一直卡在下载中,加上单页app的效果,我们可能会切换其他页面浏览,但是由于上一个路由页的资源已经在加载中了,即便我们切换了页面,资源还是处于下载中的。所以我们要解决这个问题。怎么办?window.stop();这个方法会直接结束当前页面的所有请求,类似于我们点击了浏览器的x按钮,不进行加载了。目...

0
0
木灵鱼儿 6 个月前 JavaScript

原生js获取、添加、删除元素class

className方式我自己之前学es5的时候,老师教我们是用的是className属性,他是dom的一个属性,返回元素的class值,兼容性可以说是通杀吧,所有浏览器都是支持的,但是,他是一个string操作。document.getElementById('myid').className; 他会返回一个string的值(空的话返回empty string,empty string===“”,length为0),而class的设置,他是需要空格的:class="class1 class2",当我们添加一个新的class时就不得不考虑空格的问题:document.g...

0
0
木灵鱼儿 6 个月前 JavaScript

获取元素距离顶部的距离

这个方法太常用了,写个笔记 //获取顶部距离 function getTop(element) { let realTop = element.offsetTop; let parent = element.offsetParent; while (parent !== null) { realTop += parent.offsetTop; parent = parent.offsetParent; } return realTop; },接收原生dom对象

0
0
木灵鱼儿 7 个月前 JavaScript

fetch下载后端提供的文件

最近有这么一个需求,就是后端api地址返回一个文件,这个文件是已经格式化好的,比如表格.xlsx,或者是其他文件zip这些。但是后端他加了鉴权,所以如果直接a链接访问这个接口,我们无法在头信息上添加token字段,于是这个请求被作为无效。然后我使用了axios的请求,结果返回的内容,转换为blob对象后,下载完文件就被破坏了,无法打开。这里我贴一下之前的代码。api().then(res=>{ let blob = new Blob([err]); let a = document.createElement("a"); a.href = URL.c...

5
0
木灵鱼儿 7 个月前 JavaScript

防抖动

js里面的防抖动,就是当一个函数不断被触发,但是实际有效值是最后一次的时候,为了节省资源,提高性能,让这个函数只触发最后一次。比如常见的resize事件,scroll事件,非常典型的一个重复触发,有效的是最后一次。那么怎么做呢?function debounce(fn, delay) { // 维护一个 timer let timer = null; return function() { // 通过 ‘this’ 和 ‘arguments’ 获取函数的作用域和变量 let context = this; let args = arguments;...

0
0
木灵鱼儿 7 个月前 JavaScript

moment的diff计算相差几天,结果返回的值差一天的解决办法

最近有一个地方需要计算过期时间,然后返回天数,但是我用diff计算,得到的结果就是和后端算的相差一天。//后端返回的时间 const endTime = "2021-12-04"; //前端获取当前时间 const startTime = Date.now(); //或者new Date().getTime() //计算结果 const day = moment(endTime).diff(startTime,"days");得到的结果,永远是差一天的结果。比如今天是时间是:2020-12-08 10:46:00,转为时间戳为:160739556...

61
0
木灵鱼儿 8 个月前 JavaScript

原生js 滚动条返回顶部 动画函数

直接把饿了么的返回顶部动画提取出来了,直接上代码//返回顶部函数 const cubic = (value) => Math.pow(value, 3); const easeInOutCubic = (value) => value < 0.5 ? cubic(value * 2) / 2 : 1 - cubic((1 - value) * 2) / 2; const el = document.documentElement; export const goScroll = function() { const beginTime = Date.n...

0
0
木灵鱼儿 8 个月前 JavaScript

常用的正则

包含数字、字符、特殊字符,6-16位/(?=.*[a-z_])(?=.*\d)(?=.*[^a-z0-9])[\S]{6,16}$/提示信息:密码为6-16位,必须包含数字和字母和至少一个特殊字符!@-_=<>#*%+&^$

0
0
木灵鱼儿 8 个月前 JavaScript

阻止双击选中文本

阻止双击选中文本个人有两种实现方式,可以根据实际环境进行操作。使用非文本元素如果我们对一个div元素双击,你会发现,他的文本会被选中,如果不想被选中,只能通过css的方式来进行操作,但是,css一旦设置,就永远不能选中了,也许,我们只是希望在双击时不选择,用户滑动选择时已经可以选中文字。css阻止选中.no-select { -moz-user-select: none; /*火狐*/ -webkit-user-select: none; /*webkit浏览器*/ -ms-user-select: none; /*IE10*/ -khtml-user-sel...

1
0
木灵鱼儿 9 个月前 JavaScript

js 函数注释

函数注释的一个常用的格式:/** * @description: 函数描述 * @param {类型} 参数 描述 * @return {类型} 描述 */description 就是函数的说明,干什么用的param 是函数的参数; {}里面表示这个参数是什么类型,后面接参数名称,描述,参数有多少个,@param就有多少个return 表示要输出的内容,一般可以省略不写,也可以写,和param 差不多示例/** * @description: 测试函数 * @param {*} a 任何类型参数 * @param {*} b 用来xxx * @return {*} 返回空...

0
0
js 函数注释
木灵鱼儿 9 个月前 JavaScript

javascript 拼接两条正则或多条正则

今天遇到一个问题,就是在使用mock模拟本地api请求的时候,因为做了一个全局配置文件,配置文件里面有一个devUrl属性,这个属性是本地的url地址,所以我就想着,让mock那边自动将devUrl和api地址进行拼接。但是api地址段不一定只是字符,有可能是正则。所以,我们需要进行拼接正则。知识点1.如何获取正则的匹配的那段文本?也就是/[a-z]/ig中我们怎么拿到[a-z],因为这个内容是自定义的,你不知道他会是什么内容。这里我们就需要了解到reg对象的source属性:RegExpObject.sourcesource就可以直接返回给我们模式匹配所用的文本/[a-z]/ig.so...

0
0