TS
被 readonly 標(biāo)記的屬性只能在聲明時(shí)或類的構(gòu)造函數(shù)中賦值。
只讀屬性
?
Partial
泛型可以理解為寬泛的類型，通常用于類和函數(shù)
泛型可以用于類和構(gòu)造器
泛型可以用于普通函數(shù)
1.let和const命令2.變量的解構(gòu)賦值3.Symbol4.Set和Map數(shù)據(jù)結(jié)構(gòu)5.Proxy6.Reflect7.Promise對(duì)象8.Interator和for...of循環(huán)9.Generator函數(shù)10.async await11.Class
實(shí)現(xiàn)兩個(gè)請(qǐng)求鏈?zhǔn)秸{(diào)用
Promise的then調(diào)用是一個(gè)鏈?zhǔn)秸{(diào)用
一.外形不同：箭頭函數(shù)使用箭頭定義，普通函數(shù)中沒有二.箭頭函數(shù)都是匿名函數(shù)，普通函數(shù)可以有匿名函數(shù)，也可以有具體名函數(shù)，? ? 但是箭頭函數(shù)都是匿名函數(shù)。三.箭頭函數(shù)不能用于構(gòu)造函數(shù)，不能使用new四.箭頭函數(shù)中this的指向不同在普通函數(shù)中，this總是指向調(diào)用它的對(duì)象，如果用作構(gòu)造函數(shù)，this指向創(chuàng)建的對(duì)象實(shí)例。? ? 1.箭頭函數(shù)本身不創(chuàng)建this? ? 2.結(jié)合call()，apply()方法使用? ? 3.箭頭函數(shù)不綁定arguments，取而代之用rest參數(shù)…解決
? ? （1）.箭頭函數(shù)不能Generator函數(shù)，不能使用yeild關(guān)鍵字。? ? （2）.箭頭函數(shù)不具有prototype原型對(duì)象。? ? （3）.箭頭函數(shù)不具有super。? ? （4）.箭頭函數(shù)不具有new.target。
1.普通函數(shù)調(diào)用，此時(shí) this 指向 window2.構(gòu)造函數(shù)調(diào)用， 此時(shí) this 指向 實(shí)例對(duì)象3.對(duì)象方法調(diào)用， 此時(shí) this 指向 該方法所屬的對(duì)象4.通過事件綁定的方法， 此時(shí) this 指向 綁定事件的對(duì)象5.定時(shí)器函數(shù)， 此時(shí) this 指向 window
async&await函數(shù)依賴執(zhí)行怎么寫
Promise是異步編程的一種解決方案，它是一個(gè)對(duì)象，可以獲取異步操作的消息，他的出現(xiàn)大大改善了異步編程的困境，避免了地獄回調(diào)，它比傳統(tǒng)的解決方案回調(diào)函數(shù)和事件更合理和更強(qiáng)大
Promise，簡單說就是一個(gè)容器，里面保存著某個(gè)未來才會(huì)結(jié)束的事件（通常是一個(gè)異步操作）的結(jié)果。從語法上說，Promise 是一個(gè)對(duì)象，從它可以獲取異步操作的消息。
Promise 提供統(tǒng)一的 API，各種異步操作都可以用同樣的方法進(jìn)行處理。
Promise的實(shí)例有三個(gè)狀態(tài):
Pending（進(jìn)行中）
Resolved（已完成）
Rejected（已拒絕）
Promise的實(shí)例有兩個(gè)過程：
pending -> fulfilled：[f?l?f?ld] : Resolved：[r??z?lvd] （已完成）
pending -> rejected: [r??d?ekt?d]：Rejected:（已拒絕）
注意：一旦從進(jìn)行狀態(tài)變成為其他狀態(tài)就永遠(yuǎn)不能更改狀態(tài)了。
1.CORS(Corss origin resource sharing)? ? access-control-allow-credentials: true? ? access-control-allow-origin: https://main.m.taobao.com? ? access-control-expose-headers: x-eagleeye-id? ? access-control-allow-methods: GET,POST,OPTIONS2.JSONP? ? 主要就是利用了 script 標(biāo)簽的src沒有跨域限制來完成的。只能是get請(qǐng)求3.代理? ? 本地webpack的Proxy(vue和react的代理方式)? ? 線上nginx/apache的反向代理
(1) 創(chuàng)建一個(gè)新對(duì)象；(2) 將構(gòu)造函數(shù)的作用域賦給新對(duì)象（因此 this 就指向了這個(gè)新對(duì)象） ；(3) 執(zhí)行構(gòu)造函數(shù)中的代碼（為這個(gè)新對(duì)象添加屬性） ；(4) 返回新對(duì)象。
1.冒泡排序法：將數(shù)組中的相鄰兩個(gè)元素進(jìn)行比較，將比較大（較?。┑臄?shù)通過兩兩比較移動(dòng)到數(shù)組末尾（開始），執(zhí)行一遍內(nèi)層循環(huán)，確定一個(gè)最大（最?。┑臄?shù)，外層循環(huán)從數(shù)組末尾（開始）遍歷到開始（末尾）。**(冒泡排序:比較兩個(gè)相鄰的元素，將值大的元素交換到右邊)2.選擇排序法：將要排序的數(shù)組分成兩部分，一部分是從大到小已經(jīng)排好序的，一部分是無序的，從無序的部分取出最小的放到已經(jīng)排序的最后面。**(選擇排序:首先在未排序序列中找到最小元素，存放到排序序列的起始位置，然后，再從剩余未排序元素中繼續(xù)尋找最小元素，然后放到已排序序列的末尾。以此類推，直到所有元素均排序完畢。)3.插入排序法：將要排序的數(shù)組分成兩部分，每次從后面的部分取出索引最小的元素插入到前一部分的適當(dāng)位置**(插入排序:從數(shù)組里面找到最小值和它的前面比較將一個(gè)記錄插入到已經(jīng)排好序的數(shù)組中，從而一個(gè)新的、記錄數(shù)增 1 的有序表)4.快速排序法：快速排序法號(hào)稱是目前最優(yōu)秀的算法之一，實(shí)現(xiàn)思路是，將一個(gè)數(shù)組的排序問題看成是兩個(gè)小數(shù)組的排序問題，而每個(gè)小的數(shù)組又可以繼續(xù)看成更小的兩個(gè)數(shù)組，一直遞歸下去，直到數(shù)組長度大小最大為2。**(快速排序:首先設(shè)定一個(gè)中間值，數(shù)組分成左右兩部分。將大于或等于分界值的數(shù)據(jù)集中到數(shù)組右邊，小于分界值的數(shù)據(jù)集中到數(shù)組的左邊。左邊和右邊的數(shù)據(jù)可以獨(dú)立排序。對(duì)于左側(cè)的數(shù)組數(shù)據(jù)，又可以取一個(gè)分界值，將該部分?jǐn)?shù)據(jù)分成左右兩部分，同樣在左邊放置較小值，右邊放置較大值。右側(cè)的數(shù)組數(shù)據(jù)也可以做類似處理。這是一個(gè)遞歸定義。通過遞歸將左側(cè)部分排好序后，再遞歸排好右側(cè)部分的順序。當(dāng)左、右兩個(gè)部分各數(shù)據(jù)排序完成后，整個(gè)數(shù)組的排序也就完成了。)
拷貝其實(shí)就是對(duì)象復(fù)制，為了解決對(duì)象復(fù)制是產(chǎn)生的引用類型問題。區(qū)別:? ? 淺拷貝只是增加了一個(gè)指針指向已存在的內(nèi)存地址，僅僅是指向被復(fù)制的內(nèi)存地址，如果原地址發(fā)生改變，那么淺復(fù)制出來的對(duì)象也會(huì)相應(yīng)的改變。深拷貝是增加了一個(gè)指針并且申請(qǐng)了一個(gè)新的內(nèi)存，使這個(gè)增加的指針指向這個(gè)新的內(nèi)存。實(shí)現(xiàn)深拷貝:? ? JSON.parse(JSON.stringify),? ? [...], {...}? ? slice, concat,? ? lodash, _cloneDeep實(shí)現(xiàn)淺拷貝:? ? Object.assign
Cookie? LocalStorage? SessionStorage
cookie localstorage sessionstorage 的區(qū)別
gitlab有一個(gè)主分支main分支，每個(gè)人都有自己的分支，先在自己的分支git pull origin 別人的分支名。再git add . 再git commit -m "名字"提交代碼，再git push origin 自己的分支名，再切換到main分支，再git merge 自己的分支名，把自己的代碼合并到主分支上。再git add .再git commit -m "名字" 再git push origin main 然后代碼就合并好了。
解決沖突啊
服務(wù)器可以主動(dòng)向客戶端推送信息，客戶端也可以主動(dòng)向服務(wù)器發(fā)送信息，是真正的雙向平等對(duì)話，屬于服務(wù)器推送技術(shù)的一種。協(xié)議標(biāo)識(shí)符是ws（如果加密，則為wss），服務(wù)器網(wǎng)址就是 URL。websocket的客戶端的API1.WebSocket 構(gòu)造函數(shù) var ws = new WebSocket('ws://localhost:8080');2.webSocket.readyState readyState屬性返回實(shí)例對(duì)象的當(dāng)前狀態(tài)，共有四種。? ? CONNECTING：值為0，表示正在連接。? ? OPEN：值為1，表示連接成功，可以通信了。? ? CLOSING：值為2，表示連接正在關(guān)閉。? ? CLOSED：值為3，表示連接已經(jīng)關(guān)閉，或者打開連接失敗。3.webSocket.onopen 實(shí)例對(duì)象的onopen屬性，用于指定連接成功后的回調(diào)函數(shù)。4.webSocket.onclose 實(shí)例對(duì)象的onclose屬性，用于指定連接關(guān)閉后的回調(diào)函數(shù)。5.webSocket.onmessage 實(shí)例對(duì)象的onmessage屬性，用于指定收到服務(wù)器數(shù)據(jù)后的回調(diào)函數(shù)。6.webSocket.send() 實(shí)例對(duì)象的send()方法用于向服務(wù)器發(fā)送數(shù)據(jù)。7.webSocket.bufferedAmount 實(shí)例對(duì)象的bufferedAmount屬性，表示還有多少字節(jié)的二進(jìn)制數(shù)據(jù)沒有發(fā)送出去。它可以用來判斷發(fā)送是否結(jié)束。8.webSocket.onerror 實(shí)例對(duì)象的onerror屬性，用于指定報(bào)錯(cuò)時(shí)的回調(diào)函數(shù)。
請(qǐng)求攔截器的作用是在請(qǐng)求發(fā)送前進(jìn)行一些操作響應(yīng)攔截器的作用是在接收到響應(yīng)后進(jìn)行一些操作
把數(shù)據(jù)存到合適的瀏覽器存儲(chǔ)里面
.env.production和.env.development的作用
不同環(huán)境下的配置不一樣.env.development 開發(fā)環(huán)境下的配置文件.env.production 生產(chǎn)環(huán)境下的配置文件
Ajax 是通過js的異步通信，從服務(wù)器中獲取XML文檔從中提取數(shù)據(jù)，在更新
當(dāng)前頁面的對(duì)應(yīng)部分，而不用刷新整個(gè)頁面
創(chuàng)建AJAX 請(qǐng)求的步驟
創(chuàng)建一個(gè)HMLHttpRequest對(duì)象
在這個(gè)對(duì)象上使用 open 方法創(chuàng)建一個(gè) HTTP 請(qǐng)求，open 方法所需要的參數(shù)
是請(qǐng)求的方法、請(qǐng)求的地址、是否異步和用戶的認(rèn)證信息。
在發(fā)起請(qǐng)求前，可以為這個(gè)對(duì)象添加一些信息和監(jiān)聽函數(shù)。
當(dāng)對(duì)象的屬性和監(jiān)聽函數(shù)設(shè)置完成后，最后調(diào)用 sent 方法來向服務(wù)器發(fā)起請(qǐng)求，
可以傳入?yún)?shù)作為發(fā)送的數(shù)據(jù)體。
特性
不能作為構(gòu)造函數(shù)，不能使用new
不能使用argumetns,取而代之用rest參數(shù)…解決
不綁定this，會(huì)捕獲其定義時(shí)所在的this指向作為自己的this。由于在vue中自動(dòng)綁定 this 上下文到實(shí)例中，
因此不能使用箭頭函數(shù)來定義一個(gè)周期方法。箭頭函數(shù)的this永遠(yuǎn)指向上下文的this，call、apply、bind也無法改變
箭頭函數(shù)沒有原型對(duì)象
http 80 https 443? ftp 21smtp 465SSH 22websokect 2120
csrf (Cross-site request forgery)XSS (corss-site scripting)?
disk cache? 硬盤緩存 第一次請(qǐng)求走disk
memory cache 內(nèi)存緩存 會(huì)話進(jìn)程結(jié)束內(nèi)存釋放
http 緩存不會(huì)緩存接口 一般會(huì)緩存靜態(tài)資源文件（某一段時(shí)間不會(huì)變化的資源）
http2.0 cache-control 強(qiáng)緩存 max-age 最大緩存時(shí)間 相對(duì)第一次請(qǐng)求時(shí)間
http1.0 expires GMT 時(shí)間字符串 絕對(duì)時(shí)間? 9.8? 容易出現(xiàn)時(shí)間誤差
協(xié)商緩存有兩個(gè)方法：
etag 設(shè)置版本號(hào)
last-modifed? 比較文件最后一次修改時(shí)間
https為什么比http安全HTTPS是在HTTP上建立SSL加密層，并對(duì)傳輸數(shù)據(jù)進(jìn)行加密，是HTTP協(xié)議的安全版。HTTPS并不算是一個(gè)新協(xié)議，是將HTTP協(xié)議通信接口部分用SSL和TLS協(xié)議代替。SSL(Secure Sockets Layer 安全套接字協(xié)議),及其繼任者傳輸層安全（Transport Layer Security，TLS）是為網(wǎng)絡(luò)通信提供安全及數(shù)據(jù)完整性的一種安全協(xié)議。在采用SSL后，HTTP就擁有了HTTPS的加密、證書和完整性保護(hù)這些功能。也就是說HTTP加上加密處理和認(rèn)證以及完整性保護(hù)后即是HTTPS。
對(duì)稱和非對(duì)稱相結(jié)合
對(duì)稱加密:這種方式加密和解密同用一個(gè)密鑰。加密和解密都會(huì)用到密鑰。
非對(duì)稱加密:公開密鑰加密使用一對(duì)非對(duì)稱的密鑰。一把叫做私有密鑰，另一把叫做公開密鑰。
https在交換密鑰環(huán)節(jié)使用非對(duì)稱加密方式，之后的建立通信交換報(bào)文階段則使用對(duì)稱加密方式。
內(nèi)容分發(fā)網(wǎng)絡(luò)（Content Delivery Network，簡稱CDN）CDN是構(gòu)建在現(xiàn)有網(wǎng)絡(luò)基礎(chǔ)之上的智能虛擬網(wǎng)絡(luò)，依靠部署在各地的邊緣服務(wù)器，通過中心平臺(tái)的負(fù)載均衡、內(nèi)容分發(fā)、調(diào)度等功能模塊，使用戶就近獲取所需內(nèi)容，降低網(wǎng)絡(luò)擁塞，提高用戶訪問響應(yīng)速度和命中率。CDN的關(guān)鍵技術(shù)主要有內(nèi)容存儲(chǔ)和分發(fā)技術(shù)。基本就是通過外地部署的外地服務(wù)器來分流內(nèi)容，讓主服務(wù)器不會(huì)有那么大的工作量。
項(xiàng)目優(yōu)化減少 HTTP 請(qǐng)求數(shù)減少 DNS 查詢使用 CDN避免重定向圖片懶加載減少 DOM 元素?cái)?shù)量減少DOM 操作壓縮 JavaScript 、 CSS 、字體、圖片等使用 iconfont字體裁剪多域名分發(fā)劃分內(nèi)容到不同域名盡量減少 iframe 使用避免圖片 src 為空把JavaScript放在頁面底部
三次握手:
發(fā)送端發(fā)送一個(gè)SYN標(biāo)志的數(shù)據(jù)包,詢問是否能收到請(qǐng)求
接收端接收后返回一個(gè)SYN/ACK標(biāo)志的數(shù)據(jù)包表示,我能收到,并詢問請(qǐng)求端是否能收到
最后發(fā)送端再發(fā)送一個(gè)ACK標(biāo)志的數(shù)據(jù)包代表我能收到,可以建立連接
四次揮手:
Client發(fā)送一個(gè)FIN,用來關(guān)閉Client到Server的數(shù)據(jù)傳送
Server收到FIN后，發(fā)送一個(gè)ACK給Client
Server發(fā)送一個(gè)FIN，用來關(guān)閉Server到Client的數(shù)據(jù)傳送
Client收到FIN后，Client進(jìn)入TIME_WAIT狀態(tài)，接著發(fā)送一個(gè)ACK給Server
GET一般用于獲取/查詢資源信息，而POST一般用于更新資源信息。GET 方法的參數(shù)應(yīng)該放在 url 中，POST 方法參數(shù)應(yīng)該放在 body 中GET請(qǐng)求，請(qǐng)求的數(shù)據(jù)會(huì)附加在URL之后，以?分割URL和傳輸數(shù)據(jù)，多個(gè)參數(shù)用&連接。POST請(qǐng)求：POST請(qǐng)求會(huì)把請(qǐng)求的數(shù)據(jù)放置在HTTP請(qǐng)求包的包體中。不同瀏覽器和服務(wù)器會(huì)對(duì)請(qǐng)求有不同的URL的長度和傳輸?shù)臄?shù)據(jù)大小的限制POST的安全性要比GET的安全性高。
重排:瀏覽器下載完頁面中的所有組件（HTML、JavaScript、CSS、圖片）之后會(huì)解析生成兩個(gè)內(nèi)部數(shù)據(jù)結(jié)構(gòu)（DOM樹和渲染樹），DOM樹表示頁面結(jié)構(gòu)，渲染樹表示DOM節(jié)點(diǎn)如何顯示。重排是DOM元素的幾何屬性變化，DOM樹的結(jié)構(gòu)變化，渲染樹需要重新計(jì)算。重繪:重繪是一個(gè)元素外觀的改變所觸發(fā)的瀏覽器行為.瀏覽器會(huì)根據(jù)元素的新屬性重新繪制，使元素呈現(xiàn)新的外觀。由于瀏覽器的流布局，對(duì)渲染樹的計(jì)算通常只需要遍歷一次就可以完成。(1)頁面渲染初始化時(shí)；(2)瀏覽器窗口改變尺寸；(3)元素尺寸改變時(shí)；(4)元素位置改變時(shí)；(5)元素內(nèi)容改變時(shí)；(6)添加或刪除可見的DOM 元素時(shí)。
分離讀寫操作
樣式集中改變
盡量避免style的使用
不要經(jīng)常獲取同一個(gè)元素，可以第一次獲取元素后，用變量保存下來，減少遍歷時(shí)間
不要使用Table布局
批量修改元素時(shí)，可以先讓元素脫離文檔流，等修改完畢后，再放入文檔流。
點(diǎn)擊地址欄回車事件會(huì)觸發(fā)什么事件
在瀏覽器中獲取輸入的域名,例如www.sixseven.xyz,搜索自身的DNS緩存
DNS緩存:指的是DNS返回正確的IP后,會(huì)把這個(gè)結(jié)果臨時(shí)存儲(chǔ)起來,并且會(huì)為緩存設(shè)置一個(gè)失效時(shí)間(N小時(shí)),在這N小時(shí)之內(nèi),當(dāng)再次訪問該網(wǎng)站時(shí),
系統(tǒng)會(huì)直接從電腦本地的DNS緩存中把結(jié)果返回,而不必去請(qǐng)求DNS服務(wù)器,從而加速域名的解析
搜索瀏覽器操作系統(tǒng)的DNS緩存
讀取本地的HOST文件
瀏覽器向DNS請(qǐng)求,將域名解析為外網(wǎng)的IP地址,并緩存起來
客戶端的瀏覽器打開連接,與服務(wù)器進(jìn)行連接(web服務(wù)默認(rèn)端口號(hào)為80),進(jìn)行TCP的三次握手,從資源庫中返回相應(yīng)的資源
建立TCP連接后,瀏覽器發(fā)出HTTP請(qǐng)求,請(qǐng)求內(nèi)容
服務(wù)器通過HTTP響應(yīng),網(wǎng)站可能會(huì)有負(fù)載均衡設(shè)備來平均分配所有用戶的請(qǐng)求,分配到多個(gè)操作單元上執(zhí)行,將首頁發(fā)送到瀏覽器
瀏覽器解析HTML代碼,并請(qǐng)求相應(yīng)的圖片,CSS,JS資源.看是否是長連接來決定是不是斷開TCP連接
TCP連接釋放(四次揮手)
瀏覽器解析服務(wù)端發(fā)送的首頁文件,并進(jìn)行解析渲染,將web頁面展示給用戶點(diǎn)擊地址欄回車事件會(huì)觸發(fā)什么事件
vconsole? dataset
javascript contains方法是在IE瀏覽器
compareDocumentPosition()compareDocumentPosition
better-scroll組件實(shí)現(xiàn)了什么功能 怎么封裝的
上拉刷新 下拉加載
利用Cookie機(jī)制實(shí)現(xiàn)? http方式? sessionID存到Cookie中。
用戶名和密碼
token方式? ? 提交賬號(hào)和密碼給服務(wù)端，服務(wù)端根據(jù)定義的的策略生成一個(gè)token? token有時(shí)效，過期了
header請(qǐng)求頭中
post請(qǐng)求用于修改服務(wù)器上的資源，對(duì)所發(fā)的信息沒有限制
登錄帶的token算是修改資源，get一般用來獲取數(shù)據(jù)
數(shù)組循環(huán)
jsonp? cors
img標(biāo)簽的src屬性
可視區(qū)域的判斷
document.documentElement.clientHeight //獲取屏幕可視區(qū)域的高度
element.offsetTop//獲取元素相對(duì)于文檔頂部的高度
document.documentElement.scrollTop//獲取瀏覽器窗口頂部與文檔頂部之間的距離，也就是滾動(dòng)條滾動(dòng)的距離
如果：offsetTop-scroolTop< clientHeight，則圖片進(jìn)入了可視區(qū)內(nèi)，則被請(qǐng)求。
一般情況下，loader的執(zhí)行順序?yàn)閺挠彝?，從下往?/p>
ESLint
Find Problems。ESLint 通過靜態(tài)代碼分析可以快速發(fā)現(xiàn)代碼中的問題。
ESLint 可以運(yùn)行在大多數(shù)文本編輯器中，并且也可以在工作流中接入 ESLint
Fix Automatically。ESLint 發(fā)現(xiàn)的很多問題都可以自動(dòng)修復(fù)
Customize?？梢远ㄖ?ESLint 檢查規(guī)則
Source map就是一個(gè)信息文件，里面儲(chǔ)存著位置信息。也就是說，
轉(zhuǎn)換后的代碼的每一個(gè)位置，所對(duì)應(yīng)的轉(zhuǎn)換前的位置。
先登錄npm login
再發(fā)包npm publish
