![](https://img-blog.csdnimg.cn/20201014180756925.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
JavaScript
livezsw
这个作者很懒,什么都没留下…
展开
-
常用数组方法总结中
数组属性属性 描述 constructor 返回创建数组对象的原型函数。 length 设置或返回数组元素的个数。 prototype 允许你向数组对象添加属性或方法。 Array 对象方法方法 描述 map() 通过指定函数处理数组的每个元素,并返回处理后的数组。 filter() 检测数值元素,并返回符合条件所有元素的数组。 find() 返回符合传入测试(函数)条件的数组元素。 some() 检测数组元素中是原创 2020-09-27 11:02:10 · 91 阅读 · 0 评论 -
html2canvas
npm install --save html2canvas // 执行下载图片逻辑 downloadPic(refName) { window.scrollTo(0, 0) html2canvas(this.$refs[refName], { // backgroundColor: 'red' }).then((canvas) => { // 回调中返回的其实就是一个canvas对象 // 可以使原创 2021-12-13 10:11:05 · 1007 阅读 · 0 评论 -
axios利用Blob下载
Blob对象表示一个不可变、原始数据的类文件对象。它的数据可以按文本或二进制的格式进行读取,也可以转换成ReadableStream来用于数据操作。Blob 表示的不一定是JavaScript原生格式的数据。File接口基于Blob,继承了 blob 的功能并将其扩展使其支持用户系统上的文件。 download(param) { // 响应类型:arraybuffer, blob this.$axios .post('url', param, {...原创 2021-10-28 16:24:38 · 1650 阅读 · 0 评论 -
async await 循环
串行async function dbFuc(db) { let docs = [{}, {}, {}]; for (let doc of docs) { await db.post(doc); }}并行async function dbFuc(db) { let docs = [{}, {}, {}]; let promises = docs.map((doc) => db.post(doc)); let results = await Prom原创 2021-09-28 16:23:50 · 133 阅读 · 0 评论 -
使用xlsx.full.min.js处理excel表格
下载地址:xlsx.full.min.js<!DOCTYPE html><html> <head> <meta charset="UTF-8" /> <link rel="stylesheet" href="https://unpkg.com/element-ui/lib/theme-chalk/index.css" /> </head> <body> <div id="..原创 2021-03-19 17:25:28 · 2615 阅读 · 0 评论 -
展开运算符...
// 合并数组和对象 a = [1, 2, 3] b = [3, 4, 5] console.log([...a, ...b])//[1, 2, 3, 3, 4, 5] c = { 'c': 1, 'c1': 2 } d = { 'c1': 2, 'd1': 3 } console.log({ ...c, ...d })//{c: 1, c1: 2, d1: 3} key相同的会覆盖 // 解构赋值数组和对象 let [e, .....原创 2021-02-08 16:28:24 · 84 阅读 · 0 评论 -
深拷贝与浅拷贝
如何区分深拷贝与浅拷贝,简单点来说,就是假设B复制了A,当修改A时,看B是否会发生变化,如果B也跟着变了,说明这是浅拷贝,拿人手短,如果B没变,那就是深拷贝,自食其力。深拷贝与浅拷贝,只对于引用数据类型(数组,对象),浅拷贝只是复制了引用地址,深拷贝是复制了其值,并有了新的内存地址深拷贝:通过JSON对象来实现深拷贝: function deepClone2(obj) { var _obj = JSON.stringify(obj), objClo...原创 2021-02-08 16:01:11 · 66 阅读 · 0 评论 -
map对象
定义:Map是一组键值对的结构,键可以为数字,数组,对象等,是ES6标准新增的数据类型,优点:具有很快的查询速度,主要用于数据存储创建: var m = new Map([[1, 'zhang'], [2, 'wang'], [3, 'li']]); //参数为二维数组或者一个对象常用方法:keys获取所有的keyvalues获取所有的valueforEach循环map对象set添加一个新建元素到映射。ge...原创 2021-02-08 15:19:16 · 563 阅读 · 0 评论 -
常用日期方法总结
时间戳转为固定格式 Number.prototype.formatDate = function (bool) { var date = new Date(this.toString().length === 13 ? this : this * 1000) var y = date.getFullYear() var m = date.getMonth() + 1 var d = date.getDate() var h = d..原创 2021-02-05 10:59:07 · 194 阅读 · 1 评论 -
niceScroll 的使用
官方网址【https://nicescroll.areaaperta.com/】 注:效果见官网右侧滚动条jquery.nicescroll文件下载地址引入核心文件,插件需要引入1.5.X以上版本的jquery库<html><head></head><body id="scrollid" style='margin:10px auto; padding-right:12px; overflow:hidden;'><div styl.原创 2021-01-12 11:46:51 · 260 阅读 · 0 评论 -
简单数组和对象数组的去重及排序
function trimArr(arr) { return Array.from(new Set(arr)); } console.log(trimArr([2, 3, 2, 2, 44]))//[2, 3, 44] function trimObjArr(arr) { var mapObj = new Map() return arr.filter(n => !mapObj.has(n.id) && mapOb...原创 2020-12-30 20:06:29 · 132 阅读 · 0 评论 -
时间戳转换其他格式
function timestampToTime(timestamp) { var date = new Date(timestamp * 1000);//时间戳为10位需*1000,时间戳为13位的话不需乘1000 var Y = date.getFullYear() + '-'; var M = (date.getMonth() + 1 < 10 ? '0' + (date.getMonth() + 1) : date.getMonth() + 1) + '-'; .原创 2020-12-21 16:03:31 · 72 阅读 · 0 评论 -
简单的图片放大插件
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title> <style> .zoomin { cursor: poin.原创 2020-12-03 18:10:33 · 173 阅读 · 0 评论 -
flexible.js例子
<!DOCTYPE html><html><head> <meta charset="UTF-8"> <title></title> <style> * { margin: 0; padding: 0; } .labc { color: #7C7C7C; font-size: 0.2rem; } .labc h2 .原创 2020-12-01 17:24:24 · 336 阅读 · 0 评论 -
简单的提示插件
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title></head><body> <script src="ht.原创 2020-12-01 15:39:49 · 138 阅读 · 0 评论 -
关于new,继承的理解
类和实例是大多数面向对象编程语言的基本概念,js通过原型(prototype)来实现面向对象编程,类指具有相同属性和方法的泛指的一群对象(人类),实例指具有特性的单个个体(小明)通过new(语法糖)类得到实例,实例的原型就是类,实例一定具有类的属性和方法,但类不具有实例特有的属性和方法。之所以使用原型的概念,因为这样可以让多个实例相同的属性方法都指向同一个地址,可以节省内存ES5通过函数(构造函数)创建类,通过prototype给类添加属性和方法,再new构造函数来创建实...原创 2020-11-27 17:21:17 · 493 阅读 · 0 评论 -
常用的ES6语法
<!-- <p> Let const:ES5只有全局作用域和函数作用域,let是块级作用域 。const也用来声明变量,但是声明的是常量。一旦声明,常量的值就不能改变。 class, extends, super,箭头函数: classAnimal{//class定义类 //构造方法内定义自己私有的属性方法 constructor(){ this.type='anim...原创 2020-11-27 11:55:26 · 107 阅读 · 1 评论 -
简单的jq插件例子
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title></head><body> <img src="h.原创 2020-11-27 11:44:34 · 142 阅读 · 0 评论 -
Promise定义及应用
定义:Promise对象代表了未来将要发生的事件,用来传递异步操作的消息。(用来处理异步事件的对象)为什么要用?可以将异步操作以同步操作的流程表达出来,避免了层层嵌套的回调函数。使代码更加具有可读性和可维护性,将数据请求与数据处理明确的区分开来,此外,Promise对象提供统一的接口,使得控制异步操作更加容易。Promise对象有以下两个特点:1.Promise对象代表一个异步操作,有三种状态:Pending(进行中)、Resol...原创 2020-11-20 17:23:27 · 683 阅读 · 0 评论 -
关于回调函数
回调函数定义:回调函数作为参数传递给另一个函数,并在父函数完成后执行。第一句的理解:函数名(函数对象)可以把它当成形参传给需要回调函数的函数,加上()之后就会执行此函数。第二句的理解:回调函数在父函数里面当然会在父函数执行完后再执行,这样函数的执行就存在了前后的依赖关系,所以当有些方法执行需要前提条件的时候,这些方法就可以写成回调函数。为什么要用回调函数?因为回调函数是作为形参在父函数上存在的,所以可以通过传不同的实参(不同的函数名),来实现不同的功...原创 2020-09-10 10:36:46 · 308 阅读 · 0 评论 -
JavaScript与或运算符 || && 妙用
1.几乎所有语言中||和&&都遵循“短路”原理,如&&中第一个表达式为假就不会去处理第二个表达式,而||正好相反。2.在js逻辑运算中,0、""、null、false、undefined、NaN都会判为false,其他都为true // 例: // aaa为10时,bbb为1; // aaa为20时,bbb为2; // aaa为30时,bbb为3; // aaa为40时,bbb为4; // 其他情况bbb为0。...原创 2020-09-01 14:39:39 · 377 阅读 · 0 评论 -
在js函数中关于this指向问题及call()、apply()、bind() 的用法
1.在js函数中关于this指向问题 var name = "张三"; var obj = { name: "李四", es5fun: function () { console.log(this); }, es6fun: () => { console.log(this); }, }; obj.es5fun(); //obj .原创 2020-08-28 17:06:52 · 216 阅读 · 0 评论 -
多行省略展开
<!DOCTYPE html><html lang="en"> <head> <meta charset="UTF-8" /> <meta name="viewport" content="width=device-width, initial-scale=1.0" /> <title>Document</title> <style> * { m.原创 2020-08-24 16:16:57 · 166 阅读 · 0 评论 -
关于闭包的理解及利用闭包的例子
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title></head><body> <script> // 闭包.原创 2020-08-18 21:04:45 · 125 阅读 · 0 评论 -
js阻止事件冒泡附案例
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title> <style> * { margin: 0; padding: 0; .原创 2020-08-18 21:00:50 · 170 阅读 · 0 评论 -
判断浏览器与终端
<script>//判断是否是IEfunctionisIE(){if(!!window.ActiveXObject||"ActiveXObject"inwindow){returntrue;}else{returnfalse;}}console.log('isIE--'+isIE...原创 2020-08-18 20:53:51 · 142 阅读 · 0 评论 -
正则表达式总结(校验数字,字符串及特殊需求的表达式)
例:验证字符串全为数字,全为数字返回true,否则返回false。注:str为空时,也返回true,即先要判断非空。var pattern = /^[0-9]*$/, str = '';console.log(pattern.test(str));一、校验数字的表达式数字:^[0-9]*$ n位的数字:^\d{n}$ 至少n位的数字:^\d{n,}$ m-n位的数字:^\d{m,n}$ 零和非零开头的数字:^(0|[1-9][0-9]*)$ 非零开头的最多带两位小数的数字:^..原创 2020-08-18 19:52:59 · 3216 阅读 · 0 评论 -
JavaScript中数字与字符串相互转化的常用方法
一.数字转换成字符串①Number类定义的toString()方法:这个方法可以接收表示转换基数(radix,范围在2~36之间)的可选参数,如果不指定此参数,转换规则将是基于十进制。②Number类定义的toFixed()方法:这个方法可以指定小数点后的位数。二.字符串转换为数字①通过Number()转换函数传入一个字符串,它会试图将其转换为一个整数或浮点数直接量,这个方法只能基于十进制进行转换,并且字符串中不能出现非数字的字符,否则将返回NaN。②parseInt()函数:它是全局函原创 2020-08-18 10:09:13 · 469 阅读 · 0 评论