数据结构 与JS 的运行机制 渲染机制 性能 错误处理

1 数据结构 简单的 

堆栈 先进后出   可以理解为一个梳着的堆 只有上面一个出口

队列 先进先出   FIFO   可以理解为一个横着的先 一个口出一个口进 单向的

链表 

链式存储结构   顺序存储结构

链式存储结构 又分单向链表  双向链表  循环链表

链表的每一个组成都有两部分  一部分是数据  一部分是下一个元素的地址 next 指针

双向链表 就是 既有下一个又有上一个

循环链表  尾部指向头部  （ 方便合并链表）

2 JS的运行机制

单线程 同一时间只能执行一个任务

任务队列分为   同步人物 异步任务

异步任务要等同步任务执行完 才执行

console.log('A');

setTimeout(()=>{console.log('B')},0)

while (true) {}

只输出A

setTimeout 不会立刻将任务加到异步任务队列中  而是到了时间后才会加上去

JS 的基础类型 number  string  boolean  null  undefined

引用类型  Object function array data

基础类型的复制 拷贝没有指针问题  

引用类型有深拷贝浅拷贝的问题

typeOf 的类型  Object  function  boolean string  number  undefined

 

渲染机制

DTD  用来定义xml 或html文件类型

DOCTYPE  声明文件类型和DTD规范的  作用是验证文件的合法性

渲染流程就是 自上而下加载  遇到js 会停止解析先加载js 因为js可能会改变dom结构

生成dom树和css树 然后组合生成render树 然后leyout 计算布局位置  然后绘制

提升性能的方法

1 资源压缩合并  webpack 做的事之一

2 非核心代码异步加载    defer async

    defer 是html解析完成之后才会执行 多个的话按顺序执行

   async  是加载完同步之后就执行  多个的话 执行顺序不一定

  写法  都是script的属性 <srcipt defer src=""></script><srcipt async src=""></script>

3 利用浏览器的缓存 避免多次请求

4 使用cdn  代理  不用到源服务器下载资源

5 预解析DNS

      <meta  http-equiv="x-dns-prefresh-control" content="on">

      <link rel="dns-prefetch" href="//host_name_to_prefetch.com">

 

缓存的分类  

  1  强缓存    不发送请求直接使用缓存

2 协商缓存  发送一个请求带上上次请求的时间 服务器告诉还能不能继续使用

错误分类

 1  即使运行错误  （代码错误）

  2 资源加载错误

错误的捕获方式  try catch

                          window.onerror

 

object.onerrror     performance.getEntriest()  

上吧错误的原理是利用了image对象上报