- 博客(8)
- 收藏
- 关注
RSS订阅原创 图解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
301
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
728
原创 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
847
原创 通过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
129
原创 原生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
422
原创 跨域及其解决——JSONP和CORS
跨域及其解决——JSONP和CORS一、浏览器的同源策略二、所有的资源都不允许跨域吗？三、判断跨域的过程四、`JSONP`五、`CORS` 一、浏览器的同源策略 弱小的浏览器在请求资源的时候，并不知道前方等待着它的是不是地狱，为了保证自己的安全，浏览器就利用同源策略来隔绝世间险恶。 同源策略要求：浏览器只能访问当前域的资源，而不信任其他域的资源。 违反了同源策略就会产生跨域，那么，什么才算是其他域呢？ 以http://www.kop.com:8080为例，只要出现以下一种情况就是其他域 协议不同：请求协
2021-05-01 23:33:36
184
原创 区分slice/splice/split
文章目录slicesplicesplit slice 两者类似，返回一个新的数组/字符串，不改变原数组/字符串 start：必须参数，表示从第start个开始切割 end：可选参数，表示切割到第end个（不包含第end个），默认切割到最后一个（包括最后一个） 上面两个参数，如果为负数，表示从尾巴开始 splice 改变原数组 index：必须参数，表示从第index个开始截取，如果index是负数，表示从尾巴开始 num：必须参数，表示要截取几个，为0表示不删除 item1, …, itemx：
2021-03-10 17:58:44
195
原创 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
313
2
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人