zoulei

2022/1/18 算法——归并排序链表 - 代码 - [排序链表(迭代法)](https://github.com/alienRidingCat/Study-code/blob/main/%E7%AE%97%E6%B3%95/021/排序链表(迭代法).js) - [排序链表(递归法)](https://github.com/alienRidingCat/Study-code/blob/main/%E7%AE%97%E6%B3%95/021/排序链表(递归法).js) - 掘进文章 [[路飞]算法——归并排序链表 ](https://juejin.cn/post/7054590366657282056/)

2022/1/10 算法——二叉搜索树Ⅱ - 代码 - [018-验证二叉搜索树](https://github.com/alienRidingCat/Study-code/blob/main/%E7%AE%97%E6%B3%95/018/018-验证二叉搜索树.js) - [018-二叉搜索树中第K小的元素](https://github.com/alienRidingCat/Study-code/blob/main/%E7%AE%97%E6%B3%95/018/018-二叉搜索树中第K小的元素.js) - 掘金文章 [[菜鸟刷题]算法——二叉搜索树Ⅱ](https://juejin.cn/post/7051617836761874439/)

### 昨天完成： - 相同二叉树、对称二叉树 - 代码： - [016-相同的树](https://github.com/alienRidingCat/Study-code/blob/main/%E7%AE%97%E6%B3%95/016/016-相同的树.js) - [016-对称二叉树](https://github.com/alienRidingCat/Study-code/blob/main/%E7%AE%97%E6%B3%95/016/016-对称二叉树.js) - 掘金文章 [算法——二叉树 ](https://juejin.cn/post/7049740269633142820/) ### 今日计划： - 二叉搜索树中第K小的元素 - 二叉树的右视图 - 面试题 04.05. 合法二叉搜索树

2022/1/6 算法——二叉搜索树 - 代码 - [017-二叉搜索树的最近公共祖先](https://github.com/alienRidingCat/Study-code/blob/main/%E7%AE%97%E6%B3%95/017/017-二叉搜索树的最近公共祖先.js) - 掘金文章 [算法——二叉搜索树 ](https://juejin.cn/post/7050132954047053855/)

new操作会先创建一个对象并绑定 this 实现构造函数的继承，绑定操作先改变了this的指向，而bind中绑定的操作，会根据当前this的指向而绑定不同的对象，也就是bind函数的第一个参数，所以bind不会继承

HTML5简化了HTML4的DOCTYPE声明，并兼容HTML4的语法； 新增了多媒体标签video和audio； 新增了header、footer、section、article等语义化标签，并废除了big、font等网页美化方面的标签； 新增了一些新的表单属性，并支持更多input类型； 新增canvas画布功能

window是浏览器宿主对象，与js无关，支持所有浏览器，表示浏览器窗口，window还有一些子对象，可以不需要window前缀。 比如： window.navigator 对象，此对象包含有关浏览器的信息，常用于获取客户端浏览器和操作系统信息； window.screen 对象，包含有关客户端显示屏幕的信息，常用于获取屏幕的分辨率和色彩； window.location 对象，包含有关当前 URL 的信息。 window.history 对象，包含用户（在浏览器窗口中）访问过的 URL。 window.JSON 对象， 用于处理json串数据，可以对数据进行编码解码。 还有用于处理缓存数据的sessionStorage、localStorage对象，可以在控制台输出日志的console对象等等

● 浏览器将获取的HTML文档解析成DOM树。 ● 解析CSS，构成层叠样式表模型CSSOM(CSS Object Model)，CSS解析可以与DOM解析同时进行。。 ● 将DOM和CSSOM（层叠样式表模型）合并为渲染树(rendering tree)，代表一系列将被渲染的对象。 ● 渲染树的每个元素包含的内容都是计算过的，它被称之为布局layout。浏览器使用一种流式处理的方法，只需要一次绘制操作就可以布局所有的元素 ● 将渲染树的各个节点绘制到屏幕上，这一步被称为绘制painting。 ● 在此过程中，js的解析会阻塞DOM和CSSOM的构建，并且JavaScript和CSS的某些操作往往会多次修改DOM或者CSSOM

### Canvas canvas是html5提供的新元素，canvas可以看做是一个画布，其绘制出来的图形为标量图，会受到分辨率的限制，也由于Canvas 是逐像素进行渲染的，如果Canvas 图层的位置发生变化，那么整个场景也需要重新绘制，包括任何已被图形覆盖的对象； 可以在canvas中引入jpg或png这类格式的图片，一般用来做游戏和图表类的展示； 另外我们通常是通过javascript来绘制canvas，并且canvas里面绘制的图形是不能被引擎抓取的。 #### 特点 ● 依赖分辨率 ● 不支持事件处理器 ● 弱的文本渲染能力 ● 能够以 .png 或 .jpg 格式保存结果图像 ● 最适合图像密集型的游戏，其中的许多对象会被频繁重绘 ### SVG svg的出现要比canvas更早，最初svg是用xml技术描述二维图形的语言； 由于svg是超文本扩展语言，包含DOM节点信息，可以自定义标签或属性，因此里面的图形可以被引擎抓取，支持事件的绑定 它所绘制的图形为矢量图，不能引入普通的图片，因为矢量图不需要依赖分辨率，不会失真，在项目中我们会用来做一些动态的小图标，比较适合用来开发地图。 #### 特点...

### 什么是回流 每个页面第一次加载的时候，因为要构建render tree（渲染树），都会发生回流。当render tree中的一部分(或全部)因为元素的规模尺寸，布局，隐藏等改变而需要重新构建，浏览器会使渲染树中受到影响的部分失效，并重新构造这部分渲染树，这一过程称为回流，之后浏览器会重新绘制受影响的部分到屏幕中，该过程成为重绘。 ### 什么是重绘 当render tree中的一些元素需要更新属性，而这些属性只是影响元素的外观，风格，而不会影响布局的，比如颜色的更改。则称为重绘。 ### 总结 当页面布局和几何属性改变时就需要回流，回流必将引起重绘，而重绘则不一定会引起回流 ### 优化 一般为了减少页面回流和重绘，可以在操作页面时尽可能少的操作DOM，比如将DOM插入操作放进队列，在一定时间后或者队列中操作打到一定数量时再进行统一操作，VUE和React的虚拟DOM就是用JavaScript模拟DOM树，并操作模拟的DOM树对象，最后对处理后的模拟DOM树进行渲染