lesson 3 ---浏览器相关知识 2021-04-14

课程标题 路白-浏览器相关

知识点

• BOM
• 事件模型

知识点

• stopPropgation是阻止冒泡，为什么也可以阻止捕获阶段的向下传递。
  其实：stopPropagation的作用是阻止事件的传播，而非只阻止冒泡

• preventDefault
  阻止标签的默认行为，标签的默认行为，在stoppropgation限制下依然可以执行到，需要preventDefault来阻拦。
  例如：a标签跳转、 点击表单的submit行为

• 请求的方式

1. 原生ajax
   new XMLHttpRequest() 了解一下用法。
   xhr.onreadystatechange, xhr.timeout, xhr.upload,xhr.send

2. fetch API
   a. 默认不带cookie，如果要带cookies可以试着credentials
   b. 错误不会reject，需要自己处理 比如404,500，不会导致fetch返回的promise标记为 reject。 可以通过response.ok来判断请求
   c. 不支持设置超时，需要自己封装
   d. 可以中止fetch，ctl= new AbourtController(),通过signall在请求中传递，ctl.abort（）来中止
   fetch(request, options) ,返回一个promise
   node-fetch

3. axios
   支持adapter来适配各种平台的请求

课后问题

1. 如何从顶层阻止事件的传播？
   传入addEventlistener的第三个参数，true为捕获阶段，false为冒泡阶段，然后在顶层捕获到事件的时候阻止事件的传播，stopPropagation
2. stopPropagation 的具体作用
   阻止事件继续传播
3. event.target 和event.currentTarget的区别是什么？
   .target 是当前点击的元素，currentTarget是事件实际执行到的元素
4. fetch如果不特殊设置，能自带cookie吗？ fetch如何abort？
   不带cookie如果要带cookie，需要设置credential属性。
   abort 可以通过调用 AbortController 将token传递给singnal，在需要中止的地方调用abort()
5. 封装一个工具函数，处理对于异步函数的超时处理

function asyncFunction