05 2020 档案
摘要：memo memo是只能在函数组件中使用的，类似于class组件中的pureComponent。pureComponent只能对组件中的props和state进行浅层对比。memo第一个参数传入组件，而可以在第二个参数中传入一个函数，其中包含对数据的对比，可以实现深层对比。此时就类似于shouldC
阅读全文
摘要：当请求或计算时，如果每次都进行重新请求或计算，非常损耗CPU性能，因此可以通过缓存将之前的记录保存下来，当请求某已经请求过的资源时，就可以直接使用缓存了。 封装如下： function memoize(fn){ return function(){ var args = Array.prototyp
阅读全文
摘要：大致从两个方向上进行判断， 1. 函数的返回结果只依赖于它的参数 2. 执行过程中没有副作用 对于第一点，下面看一个例子，func1中返回的值只依赖于传入的参数属于纯函数，而func2中返回的值依赖于外部参数x，是不纯的 var x = 1; function func1(a, b){ return
阅读全文
摘要：今天看某vue中nextTick的某篇博客时，其中经常提到事件循环机制，之前面试也经常被问到，所以点进了该niubility博主解释循环机制的博客。原来。。。。 宏任务并不是同步任务啊！！！之前一直理解错了。 在事件循环机制中，首先在调用栈中执行主线程上的所有同步任务。此时web API会对异步任务
阅读全文
摘要：<template> <div> <ul> <li v-for="item in list1">{{item}}</li> </ul> <ul> <li v-for="item in list2">{{item}}</li> </ul> <ol> <li v-for="item in list3">
阅读全文
摘要：在React中，当更改state时，不能直接通过this.state更改，而应该通过setState更改。setState会引起某一组件更新后的重绘，会引起新旧虚拟DOM的比较（diff算法）。 因此如果每次更改state都立即执行，进行重绘就会很耗费性能。 因此，对于setState根据情况而决定
阅读全文
摘要：首先了解一下设计原则： 单一职责原则（SRP）：一个对象或一个方法只做一件事情。如果一个方法承担了过多的事情，那么在需求更改的时候，需要改写这个方法的可能性就越大。应该把对象或方法划分为更小的粒度。 最少知识原则（LKP）：一个软件实体，应该尽可能少的与其他实体发生相互作用。应当尽量减少两个对象之间
阅读全文
摘要：1. 禁止使用iframe，会阻碍父文档的onload事件 搜索引擎的解读程序无法解析这种页面，不利于SEO iframe和主页面共享连接池，而浏览器对于同域的加载是有限制的，会阻碍主页面的并行加载 2. 禁止使用gif文件实现loading效果 3. 使用css3代替js实现动画，减少对DOM的操
阅读全文
摘要：工作原理： 是基于一个新建的.appcache文件的缓存机制。解析清单离线存储资源，这些资源就像cookies一样存储起来。 如何实现呢？ 在html的头部加入manifest属性，并在cache.manifest文件中编写离线存储的资源。在离线状态时，操作window.applicationCac
阅读全文
摘要：BFC实际上是形成一个独立的区域，与外界元素互不影响。 触发BFC的条件可以有： 1. overflow不为visible 2. float不为none 3. position不为static或relative 4. display为table-cell、flex、inline-block、inli
阅读全文
摘要：宏任务： 当前调用栈中执行的任务，称为宏任务 微任务： 一次循环中的宏任务执行完成后，下一个宏任务执行之前，执行微任务，可以当做是回调函数 宏任务被放在在callback queue中，由事件触发线程维护；微任务被放在微任务队列中，由js引擎线程维护
阅读全文
摘要：时间戳方式 function throttle(func, delay) { // 首先获取使用节流机制时的时间 var prev = Date.now(); return function () { // 再获取调用时的时间 var now = Date.now(); var context =
阅读全文
摘要：representational state transfer，表现层状态转化，是一种规范 在理解这种规范之前，首先要了解几个概念： 资源 网络上的一个具体信息，比如说一张图片、一段文本、一份音频都是资源 表现层 每种资源都有不同的表现形式。比如文本可以有txt格式、html格式、xml格式等；图片
阅读全文
摘要：vue和react有很多共同之处，但也存在完全不同的方面 1. 模板 VS JSX VUE中书写DOM结构依然使用原始的html代码，将html、js、css分在不同标签中书写 而React中使用jsx，将js和html结合。 2. 状态管理 VS 对象属性 vue和react中对于共享数据的管理都
阅读全文
摘要：这两个方法，都是并行执行多个异步操作。而不同的是，all方式遵循“谁跑得慢，以谁为准执行回调”，而race遵循的是“谁跑的快，以谁为准执行回调” 以下为两个异步函数 function yibu1() { var p1 = new Promise((resolve, reject) => { setT
阅读全文
摘要：vuex的存储是在内存中的，而localStorage是以文件的形式储存在本地，sessionStorage是临时存储的。 localStorage和sessionStorage只能存储字符串类型的数据，对于复杂对象类型，通过JSON.parse、JSON.stringfy来转换 vuex是进行组件
阅读全文
摘要：GET 向特定的资源发出请求 POST 向指定资源提交数据进行处理请求，数据被包含在请求体中。POST请求可能会导致新的资源的建立、或已有资源的修改。 PUT 向指定资源位置上传其最新内容 OPTIONS 返回服务器针对特定资源所支持的HTTP请求方式，也可以通过向服务器发送‘*’的请求来测试服务器
阅读全文
摘要：什么是死锁？ 多个进程互相等待对方所占有的资源所形成的僵持局面。 形成原因： 系统分配资源太少，不能支持多个并发进程的需求； 进程推进顺序不合理，互相占有彼此需要的资源，又请求对方所占有的资源，形成死锁 死锁产生的必要条件： 互斥条件：某个资源在同一时刻只能被一个进程所占用。 不可抢占条件：进程所获
阅读全文
摘要：什么是进程？ 进程是资源分配的基本单位，用来管理资源。比如QQ和微信就是两个进程。 进程控制块PCB就是描述进程的基本信息和运行状态，比如创建进程和撤销进程就是对进程控制块的操作。PCB是描述进程的数据结构。 什么是线程？ 线程是独立调度的基本单位。一个进程可以有多个线程，它们共享进程的资源。 比如
阅读全文
摘要：状态管理工具 state 存储状态，数据 mutations 当需要修改store中的数据时，不能直接对state进行修改，而要调用mutations中定义的方法进行修改。 function setNum(state, payload){ } this.$store.commit({type:'函数
阅读全文
摘要：在页面中，每个路由都对应着js文件。 在打包时，会把所有业务代码，也就是所有路由对应的代码，打包到一个文件中。这样会造成页面过于大的问题。每次从服务器请求时，会花费较长时间。 但是通过路由懒加载，将每个路由对应的组件打包成一个个的js代码块，只有在这个路由被加载到的时候，才执行这个相应代码块。 在v
阅读全文
摘要：只向服务器请求一次html+css+js代码。根据前端路由的映射关系，分离出不同路由对应页面的代码，进行渲染。 页面切换时，不会再向服务端发送请求
阅读全文
摘要：通过同一个组件模板可以创建多个组件实例，但是创建的组件实例是互不相关的。 也就是说，在某个组件实例中将数据更改了，在另一个组件实例中不应该被影响。这就是data作为函数的好处： data(){ return { msg:'hhh' } } 如上，每次创建的组件实例的数据，都是返回了一个新的对象。如果
阅读全文
摘要：在使用v-for指令时，官方建议对key进行绑定，之前在使用时都是将key绑定为index--索引，但是使用index是没有起到效果的。 使用key的作用： 当使用v-for遍历的数组更改时， 如：['a', 'b', 'c', 'd']的第二个位置插入'f' 在不使用key的情况下，更新时会将 b
阅读全文
摘要：挂载卸载过程 constrctor() 完成数据的初始化，接收参数props和context。需要通过super()传入这两个参数才能使用。 componentWillMount() 组件已经经历了constructor数据初始化后，还未渲染到页面上。一般用于服务端渲染。 componentDidM
阅读全文
摘要：vue利用“发布者 订阅者模式”和数据劫持实现双向数据绑定。 发布者 新建一个订阅者数组 遍历绑定数据的所有子属性，利用 对属性进行get、set的改写。 在get方法中，每当调用get，调用者就是订阅者，就添加这个订阅者到订阅者数组 addSub(dep.target)。并将数据返回。 在set方
阅读全文
摘要：vue router包含三种模式： history，通过history API 实现 hash，通过onhashChange事件实现 abstract hash模式实现原理 将mode更改为hash 设置a标签为跳转链接 js var aObjs = document.querySelectorAl
阅读全文
