2020年05月_kiscon

原创 vue项目中的优化

不要在模板里面写过多表达式循环调用子组件时添加key频繁切换的使用v-show，不频繁切换的使用v-if尽量少用float，可以用flex按需加载，可以用require或者import()按需加载需要的组件合理使用路由懒加载、异步组件，拆分chunkName避免组件嵌套导致子组件强制更新:id="$route.params.id"会导致页面更新，route是响应式的数据，因为路由跳转就会导致route是响应式的数据，因为路由跳转就会导致route是响应式的数据，..

2020-05-30 22:47:45 285

原创 vue自定义指令原理

vue指令本质指令本质上是装饰器，是vue对HTML元素的扩展，给HTML元素增加自定义功能，语义化HTML标签。vue编译DOM时，会执行与指令关联的JS代码，即找到指令对象，执行指令对象的相关方法。自定义指令生命周期自定义指令有五个生命周期（也叫钩子函数），分别是bind、inserted、update、componentUpdated、unbind钩子函数作用介绍bind：只调用...

2020-05-05 20:03:07 2551

原创 computed的实现原理

介绍官方文档写起来像一个方法，用起来像一个属性，基于它的依赖进行缓存的只要跟计算属性相关的数据发生了改变，计算属性就会重新计算，不相关的值发生变化，不会重新计算计算属性根据已知data中的值，生成一个额外的新值，且新值还要跟着data中的值变化而变化computed和watch的区别watch擅长处理的场景：一个数据影响多个数据。是观察一个特定的值，当该值变化时执行特定的函数。...

2020-05-05 16:34:29 936

原创 keep-alive原理及实现

介绍keep-alive是Vue.js的一个内置组件。它会缓存不活动的组件实例，而不是直接将其销毁，它是一个抽象组件，不会被渲染到真实DOM中，也不会出现在父组件链中。它提供了include与exclude属性，允许组件有条件地进行缓存，max最多可以缓存多少组件实例。官方文档原理在created钩子会创建一个cache对象，用来作为缓存容器，保存vnode节点。在需要重新渲染的时候再将v...

2020-05-05 14:25:09 3897

原创 nextTick原理及实现过程

next-tick源码作用：将回调延迟到下次DOM更新周期之后执行。下次DOM更新周期：其实是下次微任务执行时更新DOM。而vm.$nextTick是将回调添加到微任务中。原理1）先定义了一个callbacks存放所有的nextTick里的回调函数2) 然后判断一下当前的浏览器内核是否支持Promise，支持就用Promise来触发回调函数3) 如果不支持Promise，再判断是否支持...

2020-05-02 21:30:05 2897

原创 js数组去重的常见方式

前言数组去重，在面试、笔试中，会经常遇到，下面谈下常见的去重方法，从中可以观察不同的去重方法的效果。利用ES6的Set去重let arr = [1, '1', 2, 2, true, true, 'true', undefined, null, undefined, null, NaN, NaN, {}, {}, [], []]// 利用ES6 Set去重（ES6中最常用），{}没去重...

2020-05-02 00:12:05 196

原创浅谈地图可视化

前言地图可视化在我们生活中无处不在，开车导航，寻找某个地方需要导航等，下面浅谈一下地图的一些知识及应用。当前互联网地图的坐标系现状地球坐标 (WGS84)国际标准，从专业GPS 设备中取出的数据的坐标系国际地图提供商使用的坐标系火星坐标 (GCJ-02)也叫国测局坐标系中国标准，从国行移动设备中定位获取的坐标数据使用这个坐标系国家规定：国内出版的各种地图系统（包括电.........

2020-05-01 22:56:15 1585

原创浅谈crypto、rsa、3des的使用

前言在针对密码加密，有各种各样的加密手段，下面谈谈用过的密码加密方式。cryptocrypto：模块的目的是为了提供通用的加密和哈希算法。它是nodejs的内置模块。 const fs = require('fs') const crypto = require('crypto') const config = require('./config') export cons...

2020-05-01 20:56:03 765

kiscon的博客