口喷-CSDN博客

原创图解vue的diff算法

每次修改或新增数据都要创建渲染一整个真实dom的话要开销大量性能，所以vue用diff算法来实现局部更新。真实dom和虚拟dom渲染完真实dom以后，会根据真实dom生成一个虚拟dom当树上某个VNODE节点的数据发生改变后，会生成一个新的虚拟dom把新旧两个虚拟dom进行对比，把两者的差异更新到真实dom上并渲染这个需要更新的部分，这样就避免了重新渲染一整棵树然后把旧的虚拟dom删除，新的虚拟dom就成为了下一次要进行对比的旧虚拟dom虚拟dom的对比过程对树上的节点VNODE进行了遍历对

2021-10-16 16:40:55 259 2

原创 vue+nodejs+jwt的验证登录

服务器配置jwt安装jwt库 : npm i jsonwebtoken导入jwt库，并声明传输密钥实现颁发jwt功能，即往header里面加入authorization字段/** * 颁发jwt * @param {*} res 服务端向客户端发送的响应 * @param {*} info 主体信息 * @param {*} maxAge 过期时间 */exports.publish = function (res, maxAge = 3600 * 24, info = {}

2021-09-30 10:54:47 698

原创 ES5实现类的继承

假设有一个Animal类和一个Dog类，Dog要继承自Animal在ES6中，我们可以通过extends关键字来实现继承class Animal { sleep(){ console.log("睡觉"); }}class Dog extends Animal { // Dog会继承Animal原型链上的所有方法和属性 sound(){ console.log("汪汪"); }}const dog = new Dog();dog

2021-05-16 16:13:04 819

原创通过call+apply实现bind

// 1、函数A调用bind方法时，需要传递参数 // 2、返回一个新的函数B // 3、函数B在执行的时候，还是使用A的功能，但是this指向改变了 // 4、函数B在执行的时候，传递的参数会拼接到bind方法的参数后面，然后一起在内部传递给A执行 // 5、new B()的构造函数仍然是A，改变this指向不会起任何作用Function.prototype.myBind = function (target) { // target ：改变返回函数执...

2021-05-16 14:28:24 103

原创原生js实现页面滚动进度条

window.pageYOffset：已滚动的高度window.innerHeight：可视区高度document.body.clientHeight：body高度当滚动条滚动到底部的时候，还有最后一屏不能滚动，所以总高度要减去一个可视区的高度<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compati

2021-05-03 21:22:02 392

原创跨域及其解决——JSONP和CORS

跨域及其解决——JSONP和CORS一、浏览器的同源策略二、所有的资源都不允许跨域吗？三、判断跨域的过程四、`JSONP`五、`CORS`一、浏览器的同源策略弱小的浏览器在请求资源的时候，并不知道前方等待着它的是不是地狱，为了保证自己的安全，浏览器就利用同源策略来隔绝世间险恶。同源策略要求：浏览器只能访问当前域的资源，而不信任其他域的资源。违反了同源策略就会产生跨域，那么，什么才算是其他域呢？以http://www.kop.com:8080为例，只要出现以下一种情况就是其他域协议不同：请求协

2021-05-01 23:33:36 164

原创区分slice/splice/split

文章目录slicesplicesplitslice两者类似，返回一个新的数组/字符串，不改变原数组/字符串start：必须参数，表示从第start个开始切割end：可选参数，表示切割到第end个（不包含第end个），默认切割到最后一个（包括最后一个）上面两个参数，如果为负数，表示从尾巴开始splice改变原数组index：必须参数，表示从第index个开始截取，如果index是负数，表示从尾巴开始num：必须参数，表示要截取几个，为0表示不删除item1, …, itemx：

2021-03-10 17:58:44 175

原创 HTML行级元素和块级元素

行级元素/内联元素——inline特点：内容决定元素所占位置不可以通过CSS改变宽高列举：span、strong、em、a、del 、b、i块级元素——block特点：独占一行可以通过CSS改变宽高列举：div、p、ul、li、ol、form、address、h1~h6行级块元素——inline-block特点：内容决定元素所占位置可以通过CSS改变宽高列举：img、input...

2020-09-05 14:02:49 265 2

Bermida的博客