2 tianmeng1999

尚未进行身份认证

我要认证

暂无相关简介

等级
TA的排名 1w+

localStorage 封装

function setStorage(key,value){ let time = Date.now() localStorage.setItem(key,JSON.stringify({val:value,time:time}));}function getStorage(key){ let val = localStorage.getItem(key) if(!val) return; let data = JSON.parse(val) if(D

2020-10-23 14:56:52

jquery 自定义插件 拖拽

<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title> <script src="https://cdn.bootcdn.net/

2020-10-22 20:57:53

jquery 事件

绑定事件绑定事件名$(div).click(function(){ // ...})绑定事件 on可重复添加事件可添加多个事件参数事件名 触发对象传输数据 {}回调函数示例$(div).on('click',function(){ // ...})传输数据$(div).on('click',{name:"传输数据"},function(e){ // ... e.data => {name:"传输数据"}})事件委托// h2 是 p

2020-10-22 20:55:20

webSocket 基本使用

后端安装 webSocketnpm i ws创建对象const webSocket = require('ws')const wss = new webSocket.Srever({ port: 9998})监听事件连接事件wss.on("connection", client=>{ console.log('有客户端连接。。。')})接收数据事件wss.on("connection", client=>{ client.on("message", msg=&

2020-10-22 13:30:03

js 防抖 节流

文章目录为什么需要函数防抖应用场景方法实现函数节流应用场景方法实现为什么需要在开发中,有部分的行为会频繁的触发事件执行,对于dom操作,资源请求等耗性能的处理,很可能导致界面卡顿,甚至浏览器的奔溃函数防抖 函数节流就是为了解决类似的需求函数防抖在函数需要频繁触发的情况下,只要有足够空闲的时间,才执行一次。应用场景实时搜索 input输入防抖示例拖拽方法实现function debounce(fun, delay=100){ let timer = null return func

2020-10-17 10:11:15

js 函数柯里化

柯里化是一个将使用多个参数的函数转换成一系列使用一个参数的函数的技术。用处前端使用柯里化的用途主要是简化代码结构,提高系统的维护性,一个方法,只有一个参数,强制的功能的单一性,很自然就做到了功能内聚,降低耦合。柯里化优点就是降低代码的重复,提高代码的适应性。实现柯里化期望function add(a,b,c){}let newAdd = curry(add)// 可随意传 但参数个数固定newAdd(1)(2)(3)newAdd(1,2)(3)newAdd(1)(2,3)ne

2020-10-16 15:22:30

js 纯函数编程

定义纯函数的定义是 对于相同的输入,永远会得到相同的输出,而且没有任何可1观察的副作用,也不依赖外部环境的状态即纯函数是指不依赖,修改作用域之外变量的函数纯函数是健壮的,改变执行次序不会对系统造成影响,因此纯函数的操作可以并行执行作用减少bug的引入纯函数非常容易进行单元测试,因为不需要考虑上下文环境,只需要考虑输入和输出更好的管理状态,使得可预测性增强,降低代码管理的难度,但是前端基本是在和副作用打交道,所有函数都是纯函数这种愿望不可强求原因在JavaScript中可以

2020-10-16 11:00:51

封装 bind方法

Function.prototype.mybind = function(target,...args){ // target 改变函数执行的this指向 // [].slice.call(arguments,1) let _this = this let tmp = function(){}; let f = function(...args2){ // _this show的调用者 // 判断是否 new f()

2020-10-15 19:05:37

Koa2 初始 洋葱模型指向顺序中间件 Koa2与express的关系简单示例

文章目录介绍特点快速上手中间件特点介绍文档基于Nodejs的web开发框架由 Express原班人马打造特点支持async/await洋葱模型的中间件快速上手安装node7.6版本之上npm i koa创建app.js文件// 1创建koa对象const Koa = require('koa')const app = new Koa()// 2编写响应函数(中间件)// ctx: 上下文 ctx.request ctx.response// next 下一

2020-10-13 11:13:31

Echarts 交互API 全局echarts对象/echarts实例方法

文章目录全局echarts对象echartsInstance对象全局echarts对象引入了 echarts.js 就可以直接使用的// 初始化echarts.init(dom,'主题名称') // 注册主题 然后再初始化使用echarts.registertheme('主题名称',{ // 主题配置})// 注册矢量地图的JSON数据$.get('json/map/china.json', ret => { echarts.registerMap('key',jsonDat

2020-10-13 09:22:16

Echarts 动画使用 加载动画/增量动画/动画配置

文章目录加载动画增量动画动画配置加载动画Echarts已经内置好了加载数据的动画,只需要在合适的时机显示或隐藏myChart.showLoading() // 显示myChart.hideLoading() // 隐藏增量动画// 重新触发setOption option可以只有变化的内容myChart.setOption(option)动画配置animation:true, // 默认是true 是否开启动画animationDuration:3000, // 动画时长 ms

2020-10-12 17:26:45

Echarts 显示相关(主题/调色盘(渐变色)/样式(直接/高亮)/自适应)

文章目录主题内置主题自定义主题调色盘主题调色盘全局调色盘局部调色盘渐变色线性渐变径向渐变 由一点向4周散发样式直接样式高亮样式 当鼠标滑过自适应主题内置主题Echarts默认内置的2套主题 light darkecharts.init(dom, 'light') 自定义主题https://www.echartsjs.comtheme-builder或者在主题编辑器中编辑主题下载主题 js文件引入页面在init中使用echarts.init(dom, 'xxx') 调色盘是一

2020-10-12 13:40:56

Echarts 仪表盘 常用配置(数值范围/多个指针/指针差异)

文章目录特点使用常用配置数值范围 min max多个指针多个指针差异特点主要用于在进度把控以及数据范围的检测可以更直观的表现某个指标的进度或实际情况使用<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0">

2020-10-12 09:37:48

Echarts 雷达图 常用配置(数值/填充/绘制类型shape)

文章目录特点基本使用特点基本使用

2020-10-12 09:22:15

jquery 扩展方法($.fn.extend/$.extend) 自定义插件 拖拽

文章目录扩展方法给jquery对象本身扩展方法 $.xxx给jquery Dom对象扩展方法 $(div).xxx自定义插件 拖拽扩展方法给jquery对象本身扩展方法 $.xxx$.extend({ lg(){ console.log('扩展lg方法') }})// $.lg()给jquery Dom对象扩展方法 $(div).xxx$.fn.extend({ domfun(){ // $(this); 指向调用者 $(div

2020-10-11 10:13:08

Echarts 地图配置 拖动缩放/初始化缩放比例/不同地区显示不同颜色/地图和散点图结合

文章目录特点基本使用百度地图API矢量地图常用配置拖动缩放 roam名称显示初始化缩放比例设置地图中心点常见效果显示某个区域不同地区显示不同颜色地图和散点图结合特点基本使用百度地图API需要申请百度地图ak矢量地图资料需要准备矢量地图数据注册矢量地图数据 echarts.registerMap('map',data)<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8

2020-10-10 18:02:20

Echarts 饼图 显示数值/圆环/南丁格尔图/选中效果

文章目录基本使用常见效果显示数值圆环南丁格尔图选中效果 点击选中基本使用<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title> &

2020-10-10 16:51:00

echarts 直角坐标系常用配置 网格grid/坐标轴axis/区域缩放dataZoom

文章目录网格 grid坐标轴 axis区域缩放 dataZoom直角坐标系图表:柱状图 折线图 散点图常用配置网格 grid坐标轴 axis区域缩放 dataZoom网格 gridgrid是用来控制直角坐标系的布局和大小let option = { grid:{ show: true, // 显示 // 边框 borderWidth: 10, borderColor: 'red', // 位置 left top right bottom left:20, t

2020-10-10 15:26:22

echarts 散点图 气泡图scatter/涟漪动画effectScatter

文章目录特点基本使用常见效果气泡图涟漪动画 type:effectScatter特点散点图可以帮助推断出不同纬度数据之间的相关性也常用于地图的标注上基本使用身高和体重的关系 (正相关)<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-s

2020-10-10 14:49:29

echarts折线图 常见效果(最大值/最小值/平均值/标注区间) 线条平滑smooth 样式 填充风格areaStyle 紧挨边缘 缩放 堆叠图

文章目录折线图特点基本使用常见效果最大值 最小值 平均值标注区间 markArea线条控制平滑 smooth修改样式填充风格 areaStyle紧挨边缘 boundaryGap缩放:脱离0值比例堆叠图折线图特点通常用来分析数据随时间的变化趋势基本使用<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" conten

2020-10-10 14:06:38

查看更多

勋章 我的勋章
  • 签到新秀
    签到新秀
    累计签到获取,不积跬步,无以至千里,继续坚持!
  • 持之以恒
    持之以恒
    授予每个自然月内发布4篇或4篇以上原创或翻译IT博文的用户。不积跬步无以至千里,不积小流无以成江海,程序人生的精彩需要坚持不懈地积累!
  • 勤写标兵Lv4
    勤写标兵Lv4
    授予每个自然周发布9篇以上(包括9篇)原创IT博文的用户。本勋章将于次周周三上午根据用户上周的博文发布情况由系统自动颁发。