··寫在前面：記錄一下最近自己面試的面試題以及答案，用作自己看，如有不對，后續指正更改。（兩年經驗，主要技術棧react ，小白程序媛👧🏻）··
Q1.介紹一下js的數據類型
- 7 種原始數據類型： Null Undefined String Number Boolean BigInt Symbol
- 引用類型：object，Array，function
如何區分：
- typeof(a) 用於返回值的類型，typeof一元運算符，用來返回操作數類型的字符串。有 "number"、"string"、"boolean"、"null"、"function" 和 "undefined"、"symble"、"object"
typeof(null) //object
typeof(1) //number
typeof(undefiend) //undefiend
------------------------
typeof([]) //object
typeof({}) //object
- instanceof 運算符是用來測試一個對象是否在其原型鏈原型構造函數的屬性。
instanceof 其語法是object instanceof constructor返回布爾值類型
var arr = [1,2,3]; //創建一個數組對象
arr.prototype.constructor = Array; //這一句是系統默認加上的
arr instanceof Array //true
var a={b:"1"}
a instanceof Object //true
let a = function(){}
a instanceof Function //true
Symbol介紹一下：“Symbol” 值表示唯一的標識符。Symbol 保證是唯一的。即使我們創建了許多具有相同描述的 Symbol，它們的值也是不同。描述只是一個標簽，不影響任何東西。
Symbol("id")允許創建隱藏屬性，不參與for。。。in循環
let id = Symbol("id");
let user = {
name: "John",
age: 30,
[id]: 123
};
for (let key in user) alert(key); // name, age (no symbols)
// 使用 Symbol 任務直接訪問
alert( "Direct: " + user[id] );//Direct:123
Object.keys(user) 也會忽略它們。
相反，Object.assign 會同時復制字符串和 symbol 屬性：
let id = Symbol("id");
let user = {
[id]: 123
};
let clone = Object.assign({}, user);
alert( clone[id] ); // 123
這里並不矛盾，就是這樣設計的。這里的想法是當我們克隆或者合並一個 object 時，通常希望 所有 屬性被復制（包括像 id 這樣的 Symbol）。
詳情可見現代JavaScript教程 https://zh.javascript.info/symbol
Q2: 介紹一下原型和原型鏈
- js分為函數對象和普通對象，每個對象都有__proto__屬性，但是只有函數對象才有prototype屬性
- Object、Function都是js內置的函數, 類似的還有我們常用到的Array、RegExp、Date、Boolean、Number、String
- 屬性__proto__是一個對象，它有兩個屬性，constructor和__proto__；
- 原型對象prototype有一個默認的constructor屬性，用於記錄實例是由哪個構造函數創建；
- Person.prototype.constructor == Person // 准則1：原型對象（即Person.prototype）的constructor指向構造函數本身
- person01.proto == Person.prototype // 准則2：實例（即person01）的__proto__和原型對象指向同一個地方
通過 proto 這個屬性，而由這個屬性組成的鏈，就叫做原型鏈。
原型鏈的最頂端是 null ，往下是 Object 對象，而且只要是對象或函數類型都會有 proto 這個屬性，
原型對象的作用，是用來存放實例中共有的那部份屬性、方法，可以大大減少內存消耗。
原型鏈的作用：
- 實現繼承：如果沒有原型鏈，每個對象就都是孤立的，對象間就沒有關聯，所以原型鏈就像一顆樹干，從而可以實現面對對象中的繼承
- 屬性查找：首先在當前實例對象上查找，要是沒找到，那么沿着 proto 往上查找
- 實例類型判斷：判斷這個實例是否屬於某類對象
Q3：基本數據類型和引用數據類型有什么區別
- 基本類型：存儲在棧內存中，因為基本類型的大小是固定，在棧內可以快速查找。
- 引用類型：存儲在堆內存中，因為引用類型的大小是不固定的，所以存儲在堆內存中，然后棧內存中僅存儲堆中的內存地址。
-
基本數據類型：包括：null、undefined、number、string、boolean、symbol(es6)
存放位置：內存中的棧區域中
比較：值的比較，判斷是否相等，如果值相等，就相等。一般使用=====進行比較
拷貝：賦值（通過（=）賦值操作符 賦值），賦值完成后，兩個變量之間就沒有任何關系了，改變其中一個變量的值對另一個沒有任何影響 -
引用數據類型：
包括：數組、對象、函數
存放位置：內存的棧區域中存放變量和指針，堆區域存儲實際的對象
比較：是引用的比較（就是地址的比較，變量在棧內存中對應的指針地址相等就指向同一個對象）判斷是否為同一個對象，示例如下 - 淺拷貝：重新在堆內存中開辟一個空間，拷貝后新對象獲得一個獨立的基本數據類型數據，和原對象共用一個原對象內的引用類型數據，改變基本類型數據，兩個對象互不影響，改變其中一個對象內的引用類型數據，另一個對象會受到影響
- 深拷貝：不論是對象內的基本類型還是引用類型都被完全拷貝,拷貝后兩個對象互不影響（JSON.parse(JSON.stringify(obj))
Q3:undefined和null的區別
唉，當時面試心情，
:"空值，未定義"
:"還有呢？"
......
:"沒有了"😦
看一下正經答案吧：
null==undefiend///true
null====undefiend//false
null:null類型，代表空值，typeof null 是一個object，可以看作是一個特殊的對象值
undefined：undefined類型，當聲明一個變量沒有初始化的時候得到的是undefined
null表示"沒有對象"，即該處不應該有值。典型用法是：
（1） 作為函數的參數，表示該函數的參數不是對象。
（2） 作為對象原型鏈的終點。
undefined表示"缺少值"，就是此處應該有一個值，但是還沒有定義。典型用法是：
（1）變量被聲明了，但沒有賦值時，就等於undefined。
（2) 調用函數時，應該提供的參數沒有提供，該參數等於undefined。
（3）對象沒有賦值的屬性，該屬性的值為undefined。
（4）函數沒有返回值時，默認返回undefined。
參考阮一峰老師鏈接https://www.ruanyifeng.com/blog/2014/03/undefined-vs-null.html
Q4:介紹一下this：
Q5：介紹一個箭頭函數
Q6：介紹一下promise（！！！！！重要）
Q7:setTimout
Q8:宏任務和微任務
Q9:js事件機制
Q10：閉包（！！！！重要）
Q11:跨域，怎么解決
Q12:JSONP怎么實現
Q13:項目優化
Q14:CDN用過嗎？說一下
Q15:react：生命周期
Q16:react hooks生命周期
Q17:State是同步還是異步，為啥
Q18:介紹一下redux工作流程
Q19：react 優化性能：SCU，PurComponent，Memo
Q20:hoc高階組件（--問的時候我都想死，笑死，根本沒用過）
Q21:flex布局介紹一下
Q22: if。。else和switch。。case 對比，哪個性能高
Q23：map和forEach區別
Q24:普通函數和箭頭函數的區別
Q25:變量提升
Q26：flex布局介紹下
Q27:如何實現垂直居中
Q28:如何實現左右排列
Q29:css實現元素垂直居中。
Q30:React。新舊生命周期對比，分別說出每個生命周期做了什么：
舊版: 掛載:
constructor():完成了React數據的初始化以及實現一些this的綁定。
componentWillMount()：
render():渲染組件頁面渲染執行的邏輯，render函數把jsx編譯為函數並生成虛擬dom，然后通過其diff算法比較更新前后的新舊DOM樹，並渲染更改后的節點。
componentDidMount()：組件第一次渲染完成時執行的邏輯，此時DOM節點已經生成了。
更新：
componentWillReceiveProps(nextProps)：接收父組件新的props時，重新渲染組件執行的邏輯。
shouldComponentUpdate(nextProps,nextState)：在setState以后，state發生變化，組件會進入重新渲染的流程時執行的邏輯。在這個生命周期中return false可以阻止組件的更新，主要用於性能優化。
componentWillUpdate (nextProps,nextState)：shouldComponentUpdate返回true以后，組件進入重新渲染的流程時執行的邏輯。
render()：頁面重新渲染
componentDidUpdate(prevProps,prevState)：重新渲染后執行的邏輯。
卸載：
componentWillUnmount()：組件的卸載前執行的邏輯，比如進行“清除組件中所有的setTimeout、setInterval等計時器”或“移除所有組件中的監聽器removeEventListener”等操作。
新版：
掛載：
constructor()
更新：
getDerivedStateFromProps(nextProps, prevState):新的 props 更新到相應的 state 上去。在這個過程中我們實際上是可以訪問到當前props的，這樣我們可能會對this.props做一些奇奇怪怪的操作，很可能會破壞 state 數據的單一數據源，導致組件狀態變得不可預測。
schouldComponetUpdate():
render()
getSnapShotBeforeUpdate()
componentDidUpdata()
卸載：
componentWillUmount（）
新舊對比：
使用getDerivedStateFromProps代替了舊的componentWillReceiveProps及componentWillMount。使用getSnapshotBeforeUpdate代替了舊的componentWillUpdate。
Q31:React hooks。生命周期:
useState， useEffect() 和 useLayoutEffect()
Q32:for in 和for of 區別：
for in 取 key；
for of 取 value；
for of 只能用於數組遍歷，for in還可以用於對象屬性的遍歷