每日记录_2020_4月

2020-4-30

-休息

2020-4-29

-说实话,感觉很多面试题都挺无聊的,浪费时间。threejs,canvas,那么多有意思的东西不去研究。整天盯着些老掉牙的玩意。

-为了让Github好看点。刷的算法题,丢上去。

-ES5原型链我是知道,但是一堆继承。。混入式继承(拷贝式继承)、原型链继承、借用构造函数继承、组合式继承、原型式继承、寄生式继承、寄生组合式继承。。。真的,还是要了解下。ES6直接一个Class语法糖爽太多,或者TS的。

-diff算法,其实就是,将DOM转Virtual DOM树,然后对比,同层级比较,不跨级别比较,比较完了打patch。深度优先遍历

计算一棵树形结构转换为另一棵树形结构需要最少步骤,如果使用传统的diff算法通过循环递归遍历节点进行对比,其复杂度要达到O(n^3),其中n是节点总数,效率十分低下,假设我们要展示1000个节点,那么我们就要依次执行上十亿次的比较。React对此进行优化,分为tree diff,component diff,element diff

一、找到相同的前置元素、后置元素;

二、找到需要被删除、插入、移动的元素

三、找到最少的移动次数

优化,只进行同层级比较,忽略跨级操作

如果设置了Key,可以直接用Key插入。否则,插入必须要从头到尾。一个一个挪位置。

VUE和React的DIFF,Patch,update可以有很多挖掘的地方。

-JS 只有在执行栈在try catch中,未完成才能捕获异常。之前,之中,之后。之前比如语法错误,之中可以,之后比如setTimeout不能捕获。Promise不需要。

2020-4-28

-Diff算法,树比较

-复习下Promise,看下前端设计模式及应用

-vue渲染大量数据时候,使用https://github.com/Akryum/vue-virtual-scroller

2020-4-27

-手写Promise,状态(pending,fulfilled,rejected),value,resovle方法,

this.onFulfilledCallbacks = [];回调队列,拒绝队列 this.onRejectedCallbacks = [];

resolve ->异步调用,setTimeout,如果是pending,改变状态,改变value,this.onFulfilledCallbacks.map(cb => { this.value = cb(this.value); }); reject差不多。只是不返回终值,返回原因this.reason = reason;

.then then(onFulfilled, onRejected) resolvePromise 需要判断是否循环引用,因为你的then可以返回任何职,当然包括Promise对象,而如果是Promise对象,我们就需要将他拆解,直到它不是一个Promise对象,取其中的值。

– AST实现简单版webpack。使用babel,获取文件AST结构,遍历,转换ES6为ES5.最后运行。

2020-4-21<->2020-4-26

rest.连着加班,我都忘了我学了什么。快工作断片了。

2020-4-20

-连着加班三天。没有提升,惭愧啊。

-一小时算法。

2020-4-16

https://github.com/knightsj/awesome-algorithm-question-solution 缓存下,剑指offer算法题。

-Python 与 Javascript 之比较

-这一次,彻底弄懂 JavaScript 执行机制

-学习数据结构和算法的框架思维。。关于算法,

数据结构的存储方式只有两种:数组(顺序存储)和链表(链式存储)。这句没错了。其他那些花里胡哨的玩意,本质还是这俩货。

2020-4-15

-vue文件结构分析

-感觉,看别人的解析,不如自己看代码舒服。有种探秘冒险的感觉。

-Vue白话版本原理。。复习下

-https://juejin.im/post/5d197e80e51d455d877e0d74 prop原理

-https://csspod.com/frontend-performance-best-practices/ 前端性能优化最佳实践

-获取当前页面元素数量

document.getElementsByTagName('*').length;

-【1 月最新】前端 100 问:能搞懂 80% 的请把简历给我

2020-4-14

-每天看一篇神仙朱德文章吧。写的还不错

-ajax,xmlhttprequest.(new ->open(‘post/get’,url) -> xhr回调,onreadystatechange ->readystate 4 -> xhr.status 200-300 ->xhr.responseText ->ontimeout ->timeout -> xhr.send() /IE ActiveXObject兼容

-jquery,ajax

-typeof 原理,变量机器码低位类型信息,000对象,null,010浮点数,100字符串,110布尔,1整数。

-instanceof 原理,原型链便利对比

-又看了些面试题。代码优化相关


2020-4-13

-今天了解了个新跨平台框架uniapp,研究了下weex、cordova、flutter、react-native、uniapp。这几个玩意的区别。

-了解了下,let,const,的实现方式,let立即执行函数。const,修改defineproperty不可编辑

-又看了下vue原理

发表评论

邮箱地址不会被公开。