目錄

1. 如何遍歷數(shù)組
2. 如何遍歷對(duì)象
3. http瀏覽器緩存機(jī)制
4. 304狀態(tài)碼
5. 500狀態(tài)碼具體場(chǎng)景
6. DNS原理
7. CND原理
8. osi七層模型每層分別是什么，http在哪層，tcp在哪層
9. for與 forEach的區(qū)別（forEach跳出循環(huán)）
10. onclick和addeventlistener的區(qū)別
11. setTimeOut與requestAnimationFrame的區(qū)別
12. eCharts 框架原理
13. 深入理解CSS動(dòng)畫(huà)
14. css為什么頭部，js在底部
15. CSS選擇器的權(quán)重計(jì)算
16. rgba中最后一個(gè)參數(shù)和opacity有什么區(qū)別
17. canvas 和 svg的區(qū)別
18. 重繪和重排
19. axios和ajax和fetch區(qū)別
20. 前端如何捕獲錯(cuò)誤
21. 進(jìn)程與線程的一個(gè)簡(jiǎn)單解釋
22. script標(biāo)簽阻塞渲染問(wèn)題，defer與async
23. HTTP協(xié)議的ETag
24. *js執(zhí)行上下文
25. js中斷
26. head和get的區(qū)別
27. *ssl握手過(guò)程，非對(duì)稱加密和對(duì)稱加密的區(qū)別
28. *移動(dòng)端 1px 像素問(wèn)題及解決辦法
29. *前端緩存
30. *前端埋點(diǎn)方法

1. 如何遍歷數(shù)組

https://www.cnblogs.com/lgnblog/p/11654512.html

2. 如何遍歷對(duì)象

var fzb = {
  name:'fzbnb',
  age: 23,
  hight:170
}


Object.keys(fzb).forEach(function(i){
  console.log(i,fzb[i]);
})



Object.getOwnPropertyNames(fzb).forEach(function(i){
  console.log(i,fzb[i]);
})

for(let i in fzb){
  console.log(i,fzb[i]);
}

Reflect.ownKeys(fzb).forEach(function(i){
  console.log(i,fzb[i]);
})

3. http瀏覽器緩存機(jī)制

https://www.cnblogs.com/chenqf/p/6386163.html

4. 304狀態(tài)碼

200表示成功，服務(wù)器已成功處理了請(qǐng)求，通常表示為服務(wù)器提供了請(qǐng)求的網(wǎng)頁(yè)，304表示未修改，自從上次請(qǐng)求后，請(qǐng)求的網(wǎng)頁(yè)未修改過(guò)，服務(wù)器返回此響應(yīng)時(shí)不會(huì)返回網(wǎng)頁(yè)內(nèi)容
https://blog.csdn.net/huwei2003/article/details/70139062?utm_term=304%E7%8A%B6%E6%80%81%E7%A0%81%E6%98%AF%E4%BB%80%E4%B9%88&utm_medium=distribute.pc_aggpage_search_result.none-task-blog-2_allsobaiduweb~default-0-70139062&spm=3001.4430

5. 500狀態(tài)碼具體場(chǎng)景

http://www.xusseo.com/seoswgwsm/77367.html

6. DNS原理

https://www.cnblogs.com/gopark/p/8430916.html

7. CND原理

CDN的全稱是Content Delivery Network，即內(nèi)容分發(fā)網(wǎng)絡(luò)。CDN的基本原理是廣泛采用各種緩存服務(wù)器，將這些緩存服務(wù)器分布到用戶訪問(wèn)相對(duì)集中的地區(qū)或網(wǎng)絡(luò)中，在用戶訪問(wèn)網(wǎng)站時(shí)，利用全局負(fù)載技術(shù)將用戶的訪問(wèn)指向距離最近的工作正常的緩存服務(wù)器上，由緩存服務(wù)器直接響
https://blog.csdn.net/xiangzhihong8/article/details/83147542

8. osi七層模型每層分別是什么，http在哪層，tcp在哪層

https://blog.csdn.net/weixin_42092787/article/details/107632967

9.for與 forEach的區(qū)別（forEach跳出循環(huán)）

https://zhuanlan.zhihu.com/p/62603085
throw拋出錯(cuò)誤可以跳出循環(huán)
https://blog.csdn.net/qjhsmd2015/article/details/103991750

10.onclick和addeventlistener的區(qū)別

https://blog.csdn.net/weixin_42881768/article/details/104856558

11. setTimeOut與requestAnimationFrame的區(qū)別

https://blog.csdn.net/qq_42177478/article/details/104148843

https://blog.csdn.net/VhWfR2u02Q/article/details/79492303?utm_medium=distribute.pc_relevant_t0.none-task-blog-2%7Edefault%7EBlogCommendFromMachineLearnPai2%7Edefault-1.baidujs&depth_1-utm_source=distribute.pc_relevant_t0.none-task-blog-2%7Edefault%7EBlogCommendFromMachineLearnPai2%7Edefault-1.baidujs

使用

https://www.cnblogs.com/mengfangui/p/8664315.html

12.eCharts 框架原理

13. 深入理解CSS動(dòng)畫(huà)animation

14. css為什么頭部，js在底部

15. CSS選擇器的權(quán)重計(jì)算

16. rgba中最后一個(gè)參數(shù)和opacity有什么區(qū)別

17. canvas 和 svg的區(qū)別

首先，從它們的功能上來(lái)講，canvas可以看做是一個(gè)畫(huà)布。，其繪制出來(lái)的圖形為標(biāo)量圖，因此，可以在canvas中引入jpg或png這類格式的圖片，在實(shí)際開(kāi)發(fā)中，大型的網(wǎng)絡(luò)游戲都是用canvas畫(huà)布做出來(lái)的，并且canvas的技術(shù)現(xiàn)在已經(jīng)相當(dāng)?shù)某墒?。另外，我們喜歡用canvas來(lái)做一些統(tǒng)計(jì)用的圖表，如柱狀圖曲線圖或餅狀圖等。而svg，所繪制的圖形為矢量圖，所以其用法上受到了限制。因?yàn)橹荒芾L制矢量圖，所以svg中不能引入普通的圖片，因?yàn)槭噶繄D的不會(huì)失真的效果，在項(xiàng)目中我們會(huì)用來(lái)做一些動(dòng)態(tài)的小圖標(biāo)。但是由于其本質(zhì)為矢量圖，可以被無(wú)限放大而不會(huì)失真，這很適合被用來(lái)做地圖，而百度地圖就是用svg技術(shù)做出來(lái)的。

另外從技術(shù)發(fā)面來(lái)講canvas里面繪制的圖形不能被引擎抓取，如我們要讓canvas里面的一個(gè)圖片跟隨鼠標(biāo)事件：canvas.οnmοuseοver=function(){}。而svg里面的圖形可以被引擎抓取，支持事件的綁定。另外canvas中我們繪制圖形通常是通過(guò)javascript來(lái)實(shí)現(xiàn)，svg更多的是通過(guò)標(biāo)簽來(lái)來(lái)實(shí)現(xiàn)，如在svg中繪制正矩形形就要用<rect>，這里我們不能用屬性style="width:XXX;height:XXX;"來(lái)定義。我再來(lái)介紹一個(gè)svg的js庫(kù)：TWO.JS。其中包含two.js和three.js前者用于繪制二維圖形，后者用于繪制三維圖形。TWO.JS可以支持三種格式，svg（默認(rèn)）、canvas、和WEBGL。當(dāng)然也可以在普通div中引入。

1. canvas時(shí)h5提供的新的繪圖方法
   svg已經(jīng)有了十多年的歷史

2. vanvas畫(huà)圖基于像素點(diǎn)，是位圖，如果進(jìn)行放大或縮小會(huì)失真
   svg基于圖形，用html標(biāo)簽描繪形狀，放大縮小不會(huì)失真

3. canvas需要在js中繪制
   svg在html正繪制

4. canvas支持顏色較svg多

5. canvas無(wú)法對(duì)已經(jīng)繪制的圖像進(jìn)行修改、操作
   svg可以獲取到標(biāo)簽進(jìn)行操作

6. canvas它是逐像素渲染，依賴屏幕的分辨率
   Svg不依賴

7. canvas不支持事件處理
   SVG支持事件處理

8. canvas適合圖像密集的游戲，其中的許多對(duì)象會(huì)被頻繁重繪
   SVG適合帶有大型渲染區(qū)域的應(yīng)用程序（如百度地圖）

9. svg復(fù)雜度越高渲染速度越慢（過(guò)度依賴DOM）

18. 重繪和重排

19. axios和ajax和fetch區(qū)別

20. 前端如何捕獲錯(cuò)誤

21. 進(jìn)程與線程的一個(gè)簡(jiǎn)單解釋

瀏覽器進(jìn)程與線程

22. script標(biāo)簽阻塞渲染問(wèn)題，defer與async

23. HTTP協(xié)議的ETag

24. *js執(zhí)行上下文

25. js中斷

26. head和get的區(qū)別

27. *ssl握手過(guò)程，非對(duì)稱加密和對(duì)稱加密的區(qū)別

https://blog.csdn.net/qq_29689487/article/details/81634057

28. *移動(dòng)端 1px 像素問(wèn)題及解決辦法

29. *前端緩存\

30. *前端埋點(diǎn)方法