能來講講 JS 的語言特性嗎
??運(yùn)行在客戶端瀏覽器上臭增；
??不用預(yù)編譯懂酱，直接解析執(zhí)行代碼； 是弱類型語言誊抛，較為靈活列牺；
??與操作系統(tǒng)無關(guān)，跨平臺(tái)的語言拗窃； 腳本語言瞎领、解釋性語言
變量函數(shù)的提升，怎么提升至作用域頂部随夸？
一個(gè)變量的生命周期
JS數(shù)據(jù)類型九默？
??8種。Number宾毒、String驼修、Boolean、Null伍俘、undefined、object勉躺、symbol癌瘾、bigInt。
??基本類型（單類型）：String饵溅、Number妨退、boolean、null蜕企、undefined咬荷。
??引用類型：object。里面包含的 function轻掩、Array幸乒、Date
怎么判斷變量類型？之間的區(qū)別唇牧？
??typeof：typeof只能判斷基本類型罕扎，不能判斷引用類型聚唐；
??instanceof：用來測(cè)試一個(gè)對(duì)象在其原型鏈中是否存在一個(gè)構(gòu)造函數(shù)的 prototype 屬性；
??constructor：
??Object.prototype.toString.call()：可以精準(zhǔn)的判斷對(duì)象類型腔召，推薦
如何判斷變量類型
如何判斷一個(gè)數(shù)據(jù)是 NaN?
??NaN 非數(shù)字 但是用 typeof 檢測(cè)是 number 類型
??a. 利用 NaN 的定義 用 typeof 判斷是否為 number 類型并且判斷是否滿足 isNaN
??b. 利用 NaN 是唯一一個(gè)不等于任何自身的特點(diǎn) n !== n
??c. 利用 ES6 中提供的 Object.is()方法（判斷兩個(gè)值是否相等）Object.is(n, NaN)
Js 中 null 與 undefined 區(qū)別
相同點(diǎn)：用 if 判斷時(shí)杆查，兩者都會(huì)被轉(zhuǎn)換成 false
不同點(diǎn)：
Number 轉(zhuǎn)換的值不同: Number(null)為 0，而Number(undefined)為 NaN
Null 表示一個(gè)值被定義了臀蛛，但是這個(gè)值是空值 Undefined 變量聲明但未賦值
講一下 TS 亲桦，有哪些關(guān)鍵字?
??interface、enum浊仆、class客峭、原始數(shù)據(jù)類型（number、string氧卧、boolean桃笙、null、undefined沙绝、Symbol搏明、Bigint）
箭頭函數(shù)和普通函數(shù)的區(qū)別是什么？
??普通函數(shù)this：
????this總是代表它的直接調(diào)用者闪檬。
????在默認(rèn)情況下星著，沒找到直接調(diào)用者，this指的是window粗悯。
????在嚴(yán)格模式下虚循，沒有直接調(diào)用者的函數(shù)中的this是undefined。
????使用call,apply,bind綁定样傍，this指的是綁定的對(duì)象横缔。
??箭頭函數(shù)this：
????在使用=>定義函數(shù)的時(shí)候，this的指向是 定義時(shí)所在的對(duì)象衫哥，而不是使用時(shí)所在的對(duì)象茎刚；
????不能夠用作構(gòu)造函數(shù)，這就是說撤逢，不能夠使用new命令膛锭，否則就會(huì)拋出一個(gè)錯(cuò)誤；
????不能夠使用 arguments 對(duì)象蚊荣；
????不能使用 yield 命令初狰；
JS 的 new 操作符做了哪些事情
??new 操作符新建了一個(gè)空對(duì)象，這個(gè)對(duì)象原型指向構(gòu)造函數(shù)的 prototype互例，執(zhí)行構(gòu)造函數(shù)后返回這個(gè)對(duì)象奢入。
call、apply媳叨、bind三者的用法和區(qū)別
??通過apply和call改變函數(shù)的this指向俊马，他們兩個(gè)函數(shù)的第一個(gè)參數(shù)都是一樣的表示要改變指向的那個(gè)對(duì)象丁存，第二個(gè)參數(shù)，apply是數(shù)組柴我，而call則是arg1,arg2...這種形式解寝。
??通過bind改變this作用域會(huì)返回一個(gè)新的函數(shù)，這個(gè)函數(shù)不會(huì)馬上執(zhí)行艘儒。
call聋伦、apply、bind三者的用法和區(qū)別
講一下let界睁、var觉增、const的區(qū)別
??var 沒有塊級(jí)作用域，支持變量提升翻斟。
??let 有塊級(jí)作用域逾礁，不支持變量提升。不允許重復(fù)聲明访惜，暫存性死區(qū)嘹履。不能通過 window.變量名 進(jìn)行訪問.
??const 有塊級(jí)作用域，不支持變量提升债热，不允許重復(fù)聲明砾嫉，暫存性死區(qū)。聲明一個(gè)變量一旦聲明就不能改變窒篱，改變報(bào)錯(cuò)焕刮。
閉包是什么？有什么特性墙杯？對(duì)頁面會(huì)有什么影響
??閉包可以簡單理解成：定義在一個(gè)函數(shù)內(nèi)部的函數(shù)配并。其中一個(gè)內(nèi)部函數(shù)在包含它們的外部函數(shù)之外被調(diào)用時(shí)，就會(huì)形成閉包高镐。
特點(diǎn)：
??1. 函數(shù)嵌套函數(shù)溉旋。
??2. 函數(shù)內(nèi)部可以引用外部的參數(shù)和變量。
??3. 參數(shù)和變量不會(huì)被垃圾回收機(jī)制回收避消。
使用：
??1. 讀取函數(shù)內(nèi)部的變量低滩；
??2. 這些變量的值始終保持在內(nèi)存中召夹，不會(huì)在外層函數(shù)調(diào)用后被自動(dòng)清除岩喷。
優(yōu)點(diǎn)：
??1. 變量長期駐扎在內(nèi)存中；
??2. 避免全局變量的污染监憎；
??3. 私有成員的存在纱意；
缺點(diǎn)：
??會(huì)造成內(nèi)存泄露
Js 中常見的內(nèi)存泄漏
- 意外的全局變量
- 被遺忘的計(jì)時(shí)器或回調(diào)函數(shù)
- 脫離 DOM 的引用
- 閉包
事件委托是什么？如何確定事件源（Event.target 誰調(diào)用 誰就是事件源）
JS 高程上講：事件委托就是利用事件冒泡鲸阔，只制定一個(gè)時(shí)間處理程序偷霉， 就可以管理某一類型的所有事件迄委。
??事件委托，稱事件代理类少，是 js 中很常用的綁定事件的技巧叙身，事件委托就是把原本需要綁定在子元素的響應(yīng)事件委托給父元素，讓父元素?fù)?dān)當(dāng)事件監(jiān)聽的職務(wù)硫狞，事件委托的原理是 DOM 元素的事件冒泡
什么是事件冒泡信轿？
??一個(gè)事件觸發(fā)后，會(huì)在子元素和父元素之間傳播残吩，這種傳播分為三個(gè)階段：
????捕獲階段 —— 從 window 對(duì)象傳導(dǎo)到目標(biāo)節(jié)點(diǎn)（從外到里）财忽，這個(gè)階段不會(huì)響應(yīng)任何事件，
????目標(biāo)階段 —— 在目標(biāo)節(jié)點(diǎn)上觸發(fā)泣侮，
????冒泡階段 —— 從目標(biāo)節(jié)點(diǎn)傳導(dǎo)回 window 對(duì)象（從里到外）即彪，
事件委托/事件代理就是利用事件冒泡的機(jī)制把里層需要響應(yīng)的事件綁定到外層
本地存儲(chǔ)與 cookie 的區(qū)別
數(shù)組方法有哪些請(qǐng)簡述
- push() 從后面添加元素，返回值為添加完后的數(shù)組的長度
- arr.pop() 從后面刪除元素活尊，只能是一個(gè)隶校，返回值是刪除的元素
- arr.shift() 從前面刪除元素，只能刪除一個(gè) 返回值是刪除的元素
- arr.unshift() 從前面添加元素, 返回值是添加完后的數(shù)組的長度
- arr.splice(i,n) 刪除從 i(索引值)開始之后的那個(gè)元素酬凳。返回值是刪除的元素
- arr.concat() 連接兩個(gè)數(shù)組 返回值為連接后的新數(shù)組
- str.split() 將字符串轉(zhuǎn)化為數(shù)組
- arr.sort() 將數(shù)組進(jìn)行排序,返回值是排好的數(shù)組惠况，默認(rèn)是按照最左邊的數(shù) 字進(jìn)行排序，不是按照數(shù)字大小排序的
- arr.reverse() 將數(shù)組反轉(zhuǎn),返回值是反轉(zhuǎn)后的數(shù)組
- arr.slice(start,end) 切去索引值 start 到索引值 end 的數(shù)組宁仔，不包含 end 索引的值稠屠，返回值是切出來的數(shù)組
- arr.forEach(callback) 遍歷數(shù)組,無 return 即使有 return，也不會(huì)返回 任何值翎苫，并且會(huì)影響原來的數(shù)組
- arr.map(callback) 映射數(shù)組(遍歷數(shù)組),有 return 返回一個(gè)新數(shù)組
- arr.filter(callback) 過濾數(shù)組权埠，返回一個(gè)滿足要求的數(shù)組
- arr.flat() 扁平化
普通函數(shù)和構(gòu)造函數(shù)的區(qū)別
??1. 構(gòu)造函數(shù)也是一個(gè)普通函數(shù)，創(chuàng)建方式和普通函數(shù)一樣煎谍，但是構(gòu)造函數(shù)習(xí)慣上首字母大寫
??2. 調(diào)用方式不一樣攘蔽，普通函數(shù)直接調(diào)用，構(gòu)造函數(shù)要用關(guān)鍵字 new 來調(diào)用
??3. 調(diào)用時(shí)呐粘，構(gòu)造函數(shù)內(nèi)部會(huì)創(chuàng)建一個(gè)新對(duì)象满俗，就是實(shí)例，普通函數(shù)不會(huì)創(chuàng)建新對(duì)象
??4. 構(gòu)造函數(shù)內(nèi)部的 this 指向?qū)嵗麽胀ê瘮?shù)內(nèi)部的 this 指向調(diào)用函數(shù)的對(duì)象（如果沒有對(duì)象調(diào)用唆垃，默認(rèn)為 window）
??5. 構(gòu)造函數(shù)默認(rèn)的返回值是創(chuàng)建的對(duì)象（也就是實(shí)例），普通函數(shù)的返回值由 return 語句決定
??6. 構(gòu)造函數(shù)的函數(shù)名與類名相同
簡述深淺拷貝
淺拷貝——通常需要拷貝的對(duì)象內(nèi)部只有一層的這種對(duì)象痘儡。
常用的方法
??Object.assign方法來實(shí)現(xiàn)
??擴(kuò)展運(yùn)算符 ...obj
深拷貝——通常是嵌套二層或以上的復(fù)雜對(duì)象
常用方法
??JSON.parse(JSON.stringfy(object)); 該方法忽略掉undefined辕万、忽略Symbol、忽略function。只適合簡單深拷貝 關(guān)于JSON.parse(JSON.stringify(obj))實(shí)現(xiàn)深拷貝應(yīng)該注意的坑
??手寫遞歸方法去實(shí)現(xiàn)渐尿。
??通過第三方庫提供的深拷貝實(shí)現(xiàn)(lodash)醉途。
// 遞歸
function cloneObject(obj) {
var newObj = {} //如果不是引用類型，直接返回
if (typeof obj !== 'object' && obj === null) {
return obj
}
//如果是引用類型砖茸，遍歷屬性
else {
for (var attr in obj) {
//如果某個(gè)屬性還是引用類型隘擎，遞歸調(diào)用
newObj[attr] = cloneObject(obj[attr])
}
}
return newObj
}
Promise 的理解
??什么是 Promise？
????我們都知道凉夯，Promise 是承諾的意思嵌屎，承諾它過一段時(shí)間會(huì)給你一個(gè)結(jié) 果。Promise 是一種解決異步編程的方案恍涂，相比回調(diào)函數(shù)和事件更合理和更 強(qiáng)大宝惰。 從語法上講，promise 是一個(gè)對(duì)象再沧，從它可以獲取異步操作的消息尼夺；
??promise 有三種狀態(tài)：
????pending 初始狀態(tài)也叫等待狀態(tài)，fulfiled 成功狀態(tài)炒瘸，rejected 失敗狀態(tài)淤堵；狀態(tài)一旦改變，就不會(huì)再變顷扩。創(chuàng)造 promise 實(shí)例后拐邪，它會(huì)立即執(zhí)行。
??Promise 的兩個(gè)特點(diǎn)
????1隘截、Promise 對(duì)象的狀態(tài)不受外界影響
????2扎阶、Promise 的狀態(tài)一旦改變，就不會(huì)再變婶芭，任何時(shí)候都可以得到這個(gè)結(jié) 果东臀，狀態(tài)不可以逆
??Promise 的三個(gè)缺點(diǎn)
????1、無法取消 Promise,一旦新建它就會(huì)立即執(zhí)行犀农，無法中途取消
????2惰赋、如果不設(shè)置回調(diào)函數(shù)，Promise 內(nèi)部拋出的錯(cuò)誤呵哨，不會(huì)反映到外部
????3赁濒、當(dāng)處于 pending（等待）狀態(tài)時(shí)，無法得知目前進(jìn)展到哪一個(gè)階段孟害， 是剛剛開始還是即將完成
我們用 Promise 來解決什么問題拒炎？
??promise 是用來解決兩個(gè)問題的：
????1. 回調(diào)地獄，代碼難以維護(hù)纹坐， 常常第一個(gè)的函數(shù)的輸出是第二個(gè)函數(shù)的 輸入這種現(xiàn)象
????2. promise 可以支持多并發(fā)的請(qǐng)求枝冀，獲取并發(fā)請(qǐng)求中的數(shù)據(jù)
這個(gè) promise 可以解決異步的問題，本身不能說 promise 是異步的
請(qǐng)簡述 async 的用法
??async 就是 generation 和 promise 的語法糖耘子，async 就是將 generator 的*換成 async果漾，將 yiled 換成 await
??函數(shù)前必須加一個(gè) async，異步操作方法前加一個(gè) await 關(guān)鍵字谷誓，意思就是等一下绒障，執(zhí)行完了再繼續(xù)走，注意：await 只能在 async 函數(shù)中運(yùn)行捍歪， 否則會(huì)報(bào)錯(cuò)
??Promise 如果返回的是一個(gè)錯(cuò)誤的結(jié)果户辱，如果沒有做異常處理，就會(huì)報(bào)錯(cuò)糙臼，所以用 try..catch 捕獲一下異常就可以了
async/await 如何通過同步的方式實(shí)現(xiàn)異步
??async/await 是一個(gè)自執(zhí)行的 generate 函數(shù)庐镐。利用 generate 函數(shù)的特性把異步的代碼寫成“同步”的形式。
var fetch = require("node-fetch");
function *gen() { // 這里的 * 可以看成
async var url = "https://api.github.com/users/github";
var result = yield fetch(url); // 這里的 yield 可以看成 await
console.log(result.bio);
}
var g = gen();
var result = g.next();
result.value
.then(data => data.json())
.then(data => g.next(data));
setTimeout变逃、Promise必逆、Async/Await 的區(qū)別
??setTimeout: setTimeout 的回調(diào)函數(shù)放到宏任務(wù)隊(duì)列里，等到執(zhí)行棧清空以后執(zhí)行揽乱；
??Promise: Promise 本身是同步的立即執(zhí)行函數(shù)名眉，當(dāng)在 executor 中執(zhí)行 resolve 或者 reject 的時(shí)候，此時(shí)是異步操作凰棉，會(huì)先執(zhí)行 then/catch 等损拢，當(dāng)主棧完成 時(shí)，才會(huì)去調(diào)用 resolve/reject 方法中存放的方法撒犀。
??async: async 函數(shù)返回一個(gè) Promise 對(duì)象福压，當(dāng)函數(shù)執(zhí)行的時(shí)候，一旦遇到 await 就 會(huì)先返回或舞，等到觸發(fā)的異步操作完成隧膏，再執(zhí)行函數(shù)體內(nèi)后面的語句∪履牵可以理解為胞枕， 是讓出了線程，跳出了 async 函數(shù)體魏宽。
簡述一下 Generator 函數(shù)
??傳統(tǒng)的編程語言腐泻，早有異步編程的解決方案（其實(shí)是多任務(wù)的解決方案）。其中 有一種叫做“協(xié)程”（coroutine）队询，意思是多個(gè)線程互相協(xié)作派桩，完成異步任務(wù)。 協(xié)程有點(diǎn)像函數(shù)蚌斩，又有點(diǎn)像線程铆惑，它的運(yùn)行流程大致如下：
- 第一步，協(xié)程 A 開始執(zhí)行；
- 第二步员魏，協(xié)程 A 執(zhí)行到一半丑蛤，進(jìn)入暫停，執(zhí)行權(quán)轉(zhuǎn)移到協(xié)程 B撕阎；
- 第三步受裹，（一段時(shí)間后）協(xié)程 B 交還執(zhí)行權(quán)；
- 第四步虏束，協(xié)程 A 恢復(fù)執(zhí)行
上面流程的協(xié)程 A棉饶，就是異步任務(wù)，因?yàn)樗殖蓛啥危ɑ蚨喽危﹫?zhí)行镇匀。 舉例來說照藻，讀取文件的協(xié)程寫法如下：
function* asyncJob() { // ...
var f = yield readFile(fileA);
// ...
}
上面代碼的函數(shù) asyncJob 是一個(gè)協(xié)程，它的奧妙就在其中的 yield 命令汗侵。它表示執(zhí)行到此處岩梳，執(zhí)行權(quán)將交給其他協(xié)程。也就是說晃择，yield 命令是異步兩個(gè)階段的分界線冀值。協(xié)程遇到 yield 命令就暫停，等到執(zhí)行權(quán)返回宫屠，再從暫停的地方繼續(xù)往后執(zhí)行列疗。
??Generator 函數(shù)是協(xié)程在 ES6 的實(shí)現(xiàn)，最大特點(diǎn)就是可以交出函數(shù)的執(zhí)行權(quán)（即 暫停執(zhí)行）浪蹂。
function* gen(x) { var y = yield x + 2; return y;}
var g = gen(1);
g.next() // { value: 3, done: false }g.next(2) // { value: 2, done: false }
next 是返回值的 value 屬性抵栈，是 Generator 函數(shù)向外輸出數(shù)據(jù)；next 方法還可以 接受參數(shù)坤次，向 Generator 函數(shù)體內(nèi)輸入數(shù)據(jù)古劲。
上面代碼中，第一個(gè) next 方法的 value 屬性缰猴，返回表達(dá)式 x + 2 的值 3产艾。第二 個(gè) next 方法帶有參數(shù) 2，這個(gè)參數(shù)可以傳入 Generator 函數(shù)滑绒，作為上個(gè)階段 異步任務(wù)的返回結(jié)果闷堡，被函數(shù)體內(nèi)的變量 y 接收。因此疑故，這一步的 value 屬性杠览，返回的就是 2（變量 y 的值）。
請(qǐng)簡述原型/原型鏈/（原型）繼承
什么是原型：
??任何對(duì)象實(shí)例都有一個(gè)原型纵势，也叫原型對(duì)象踱阿，這個(gè)原型對(duì)象由對(duì)象的內(nèi)置屬性_proto_指向它的構(gòu)造函數(shù)的 prototype 指向的對(duì)象管钳，即任何對(duì)象都是由一個(gè)構(gòu)造函數(shù)創(chuàng)建的，但是不是每一個(gè)對(duì)象都有 prototype软舌，只有方法才有 prototype才漆。
什么是原型鏈？
??原型鏈基本思想是利用原型讓一個(gè)引用類型繼承另一個(gè)引用類型的屬性和方法葫隙。我們知道，每個(gè)構(gòu)造函數(shù)都有一個(gè)原型對(duì)象躏仇，每個(gè)原型對(duì)象都有一個(gè)指向構(gòu)造函數(shù)的指針恋脚，而實(shí)例又包涵一個(gè)指向原型對(duì)象的內(nèi)部指針。
??原型鏈的核心就是依賴對(duì)象的_proto_的指向焰手，當(dāng)自身不存在的屬性時(shí)糟描，就一層層的扒出創(chuàng)建對(duì)象的構(gòu)造函數(shù)，直至到 Object 時(shí)书妻，就沒有 _proto_指向了船响。 因?yàn)開proto_實(shí)質(zhì)找的是 prototype，所以我們只要找這個(gè)鏈條上的構(gòu)造函數(shù)的 prototype躲履。其中 Object.prototype 是沒有_proto_屬性的见间，它 ==null。
??每個(gè)構(gòu)造函數(shù)都有一個(gè)原型對(duì)象工猜，原型對(duì)象都包含一個(gè)指向構(gòu)造函數(shù)的指針米诉，而實(shí)例都包含指向原型對(duì)象內(nèi)部的指針。我們讓原型對(duì)象（1）等于另一個(gè)原型對(duì)象的實(shí)例（2）, 此時(shí)原型對(duì)象（2）將包含一個(gè)指向原型對(duì)象（1）的指針篷帅， 再讓原型對(duì)象（2）的實(shí)例等于原型對(duì)象（3）史侣，如此層層遞進(jìn)就構(gòu)成了實(shí)例和原型的鏈條，這就是原型鏈的概念魏身。
??每個(gè)構(gòu)造函數(shù)都有一個(gè)原型對(duì)象惊橱，原型對(duì)象都包含一個(gè)指向構(gòu)造函數(shù)想指針(constructor)，而實(shí)例對(duì)象都包含一個(gè)指向原型對(duì)象的內(nèi)部指針 (__proto__)箭昵。如果讓原型對(duì)象等于另一個(gè)原型對(duì)象的實(shí)例税朴，此時(shí)的原型 對(duì)象將包含一個(gè)指向另一個(gè)原型的指針(__proto__)，另一個(gè)原型也包含著一個(gè)指向另一個(gè)構(gòu)造函數(shù)的指針(constructor)家制。假如另一個(gè)原型又是另一個(gè)類型的實(shí)例……這就構(gòu)成了實(shí)例與原型的鏈條掉房。也叫原型鏈
??原型繼承是 js 的一種繼承方式，原型鏈作為實(shí)現(xiàn)繼承的主要方法慰丛，其基本思路是利用原型讓一個(gè)引用類型繼承另一個(gè)引用類型的屬性和方法卓囚，原型繼承：利用原型中的成員可以被和其相關(guān)的對(duì)象共享這一特性，可以實(shí)現(xiàn)繼承诅病，這種實(shí)現(xiàn)繼承的方式哪亿，就叫做原型繼承.
從瀏覽器地址欄輸入U(xiǎn)RL到顯示網(wǎng)頁粥烁，這個(gè)過程是怎么實(shí)現(xiàn)的
??a、進(jìn)行域名解析蝇棉，找出對(duì)應(yīng)的IP地址
??b讨阻、瀏覽器和服務(wù)器進(jìn)行TCP連接，建立三次握手
????客戶端發(fā)起請(qǐng)求到服務(wù)器篡殷，等待服務(wù)器響應(yīng)钝吮，第一次握手；
????服務(wù)器接收到客戶端信息板辽，并發(fā)送結(jié)果至客戶端奇瘦，第二次握手；
????客戶端收到結(jié)果劲弦，并發(fā)送服務(wù)器確認(rèn)耳标，第三次握手
??c、握手成功之后邑跪，瀏覽器會(huì)把請(qǐng)求信息發(fā)送服務(wù)器次坡，服務(wù)器把響應(yīng)資源返回給瀏覽器
??d、瀏覽器加載資源画畅，繼續(xù)請(qǐng)求資源中所需的js砸琅、css、圖片等額外資源轴踱，形成結(jié)構(gòu)樹明棍，渲染樹，計(jì)算布局
??e寇僧、將資源渲染呈現(xiàn)給用戶
為什么會(huì)造成跨域/請(qǐng)簡述同源策略
??出現(xiàn)跨域問題的原因:
????在前后端分離的模式下摊腋，前后端的域名是不一致的，此時(shí)就會(huì)發(fā)生跨域訪問問題嘁傀。在請(qǐng)求的過程中我們獲取數(shù)據(jù)一般都是 post/get 請(qǐng)求兴蒸， 所以..跨域問題出現(xiàn)
??跨域問題來源于 JavaScript 的同源策略，即只有 協(xié)議+主機(jī)名+端口號(hào) (如存在)相同细办，則允許相互訪問橙凳。也就是說 JavaScript 只能訪問和操作自己域下的資源，不能訪問和操作其他域下的資源笑撞。
??同源策略 是由 NetScape 提出的一個(gè)著名的安全策略岛啸。所謂的同源，指的是協(xié)議茴肥，域名坚踩，端口相同。瀏覽器處于安全方面的考慮瓤狐，只允許本域名下的接口交互瞬铸，不同源的客戶端腳本批幌，在沒有明確授權(quán)的情況下，不能讀寫對(duì)方的資源嗓节。
解決跨域的方法
- JSONP
- CORS（Cross-Origin-Resource-Share荧缘，跨域資源共享），由服務(wù)端設(shè)置響應(yīng)頭通過瀏覽器的同源策略限制
??a. Access-Control-Allow-Origin: *;
??b. Access-Control-Allow-Methods: *;
??c. Access-Control-Allow-Headers: *;
??d. Access-Control-Allow-Credentials: true; - nginx代理跨域
- nodejs中間件代理跨域
前端常見跨域解決方案（全）
['1', '2', '3'].map(parseInt) what & why ?
??['1', '2', '3'].map(parseInt) 的輸出結(jié)果為 [1, NaN, NaN]拦宣。
??因?yàn)?parseInt(string, radix) 將一個(gè)字符串 string 轉(zhuǎn)換為 radix 進(jìn)制的整數(shù)截粗， radix 為介于 2-36 之間的數(shù)。
??在數(shù)組的 map 方法的回調(diào)函數(shù)中會(huì)傳入 item（遍歷項(xiàng)） 和 index（遍歷下標(biāo)) 作為前兩個(gè)參數(shù)鸵隧，所以這里的 parseInt 執(zhí)行了對(duì)應(yīng)的三次分別是
????parseInt(1,0)
????parseInt(2, 1)
????parseInt(3, 2)
??因此對(duì)應(yīng)的執(zhí)行結(jié)果分別為 1绸罗、NaN、NaN掰派。
將數(shù)組扁平化并去除其中重復(fù)數(shù)據(jù)从诲，最終得到一個(gè)升序且不重復(fù)的數(shù)組
Array.from(new Set(arr.flat(Infinity))).sort((a,b)=>{ return a-b })
es6之?dāng)?shù)組的flat()左痢，flatMap()
介紹下Set靡羡、Map糠涛、WeakSet 和 WeakMap 的區(qū)別短曾？
??Set
????a. 成員不能重復(fù)；
????b. 只有鍵值盯滚，沒有鍵名定页，有點(diǎn)類似數(shù)組趟薄；
????c. 可以遍歷，方法有add典徊、delete杭煎、has；
??WeakSet
????a. 成員都是對(duì)象（引用）卒落；
????b. 成員都是弱引用羡铲，隨時(shí)可以消失（不計(jì)入垃圾回收機(jī)制）±鼙希可以用來保存 DOM 節(jié)點(diǎn)也切，不容易造成內(nèi)存泄露；
????c. 不能遍歷腰湾，方法有 add雷恃、delete、has费坊；
??Map
????a. 本質(zhì)上是鍵值對(duì)的集合倒槐，類似集合；
????b. 可以遍歷附井，方法很多导犹，可以跟各種數(shù)據(jù)格式轉(zhuǎn)換唱凯；
????Map對(duì)象
??WeakMap
????a. 只接收對(duì)象為鍵名（null 除外），不接受其他類型的值作為鍵名谎痢；
????b. 鍵名指向的對(duì)象磕昼，不計(jì)入垃圾回收機(jī)制；
????c. 不能遍歷节猿，方法同 get票从、set、has滨嘱、delete峰鄙；
數(shù)組去重？
什么是防抖和節(jié)流太雨？有什么區(qū)別吟榴？ 如何實(shí)現(xiàn)？
??防抖：動(dòng)作綁定事件囊扳，動(dòng)作發(fā)生后一定時(shí)間后觸發(fā)事件吩翻，在這段時(shí)間內(nèi)，如果該動(dòng)作又發(fā)生锥咸，則重新等待一定時(shí)間再觸發(fā)事件狭瞎。
function debounce(fn, time) {
let timeout = null; // 創(chuàng)建一個(gè)標(biāo)記用來存放定時(shí)器的返回值
return function () {
clearTimeout(timeout); // 每當(dāng)用戶輸入的時(shí)候吧前一個(gè) setTimeout clear 掉
timeout = setTimeout(() => {
// 然后又創(chuàng)建一個(gè)新的 setTimeout，這樣就能保證輸入字符后的 interval
// 間隔內(nèi)如果還有字符輸入的話搏予，就不會(huì)執(zhí)行 fn 函數(shù)
fn.apply(this, arguments)
}, time);
}
}
??節(jié)流： 動(dòng)作綁定事件熊锭，動(dòng)作發(fā)生后一段時(shí)間后觸發(fā)事件，在這段時(shí)間內(nèi)雪侥，如果動(dòng)作又發(fā)生碗殷，則無視該動(dòng)作，直到事件執(zhí)行完后速缨，才能重新觸發(fā)锌妻。
function throttle(fn, time) {
let canRun = true; // 通過閉包保存一個(gè)標(biāo)記
return function () {
if (!canRun) return; // 在函數(shù)開頭判斷標(biāo)記是否為 true，不為 true 則 return
canRun = false; // 立即設(shè)置為 false
setTimeout(() => { // 將外部傳入的函數(shù)的執(zhí)行放在 setTimeout 中
fn.apply(this, arguments);
// 最后在 setTimeout 執(zhí)行完畢后再把標(biāo)記設(shè)置為 true(關(guān)鍵) 表示可以執(zhí)行下一次循環(huán)了鸟廓。
// 當(dāng)定時(shí)器沒有執(zhí)行的時(shí)候標(biāo)記永遠(yuǎn)是 false从祝，在開頭被 return 掉
canRun = true;
}, time);
}
}
寫 React / Vue 項(xiàng)目時(shí)為什么要在列表組件中寫 key，其作用是什么引谜？
??vue 和 react 都是采用 diff 算法來對(duì)比新舊虛擬節(jié)點(diǎn)牍陌，從而更新節(jié)點(diǎn)。在 vue 的 diff 函數(shù)交叉對(duì)比中员咽，當(dāng)新節(jié)點(diǎn)跟舊節(jié)點(diǎn)頭尾交叉對(duì)比沒有結(jié)果時(shí)毒涧，會(huì)根據(jù)新節(jié)點(diǎn)的 key 去對(duì)比舊節(jié)點(diǎn)數(shù)組中的 key，從而找到相應(yīng)舊節(jié)點(diǎn)（這里對(duì)應(yīng)的是一個(gè) key => index 的 map 映射）贝室。如果沒有找到就認(rèn)為是一個(gè)新增節(jié)點(diǎn)契讲。而如果沒有 key仿吞，那么就會(huì)采用遍歷查找的方式去找到對(duì)應(yīng)的舊節(jié)點(diǎn)。一種一個(gè) map 映射捡偏， 另一種是遍歷查找唤冈。相比而言，map 映射的速度更快银伟。
對(duì)前端工程化的理解
