前端知識點總結(jié)
基礎(chǔ)類：
? 1、數(shù)據(jù)類型的轉(zhuǎn)換和比較。 （+2）?數(shù)據(jù)類型轉(zhuǎn)換
? +true; //1 ,一元加號會嘗試將?boolean?類型轉(zhuǎn)換為數(shù)字類型。?true?被轉(zhuǎn)換為?1?，?false?被轉(zhuǎn)換為?0?。
? !"Lydia"; //false
1、函數(shù)傳參
對象類型是引用傳遞
function person(per){
? ? ??per.name = 'haha';
? ? ? ?per.age = 3;
? ? ? ?console.log(per)
}
person({name:"www", age: 2})
// {name: "haha", age: 3}
2、Object.is()和==，===的區(qū)別
Object.is方法在===的基礎(chǔ)上增加了NaN和NaN是相等的；+0和-0是不相等的
延伸：==?隱式轉(zhuǎn)換?規(guī)則；?運算符的優(yōu)先級?；?(+1)
+0 === -0 //true
+0 === -'0' //true
+1 === -'1' //false
Object.is(+0, -0) //false
2、閉包題。?https://segmentfault.com/a/11...
3、事件委托。?https://segmentfault.com/a/11...
3、http協(xié)議狀態(tài)碼，301和302的區(qū)別，304緩存類型，強緩存和協(xié)商緩存的區(qū)別。
常見的狀態(tài)碼有200，301,302，304，400,404,401,500,502
其中以2開頭的代表請求成功，
以3開頭的是重定向，其中301是永久重定向，302是臨時重定向，
強緩存和協(xié)商緩存[緩存](https://mp.weixin.qq.com/s/dnEbgNnu7rL9i2V_Zjjnyw)**（+3）**
4、js運行機制。?js運行機制?（+2）
5、es6用過哪些。promise的實現(xiàn)原理(+1)，all方法(+2)。
Promise.all = function(arr){
? ? ? ? ? let result = [], count = 0;
? ? ? ? ? return new Promise(function(resolve, reject){
? ? ? ? ? ? ? ? ?for(let item of arr){
? ? ? ? ? ? ? ? ? ? ?item.then(res=>{
? ? ? ? ? ? ? ? ? ? ? ? ? ? result[count] = res;
? ? ? ? ? ? ? ? ? ? ? ? ? ? count++;
? ? ? ? ? ? ? ? ? ? ? ? ? ? if(count === arr.length){
? ? ? ? ? ? ? ? ? ? ? ? ? ? ? resolve(result);
? ? ? ? ? ? ? ? ? ? ? ? ? }
? ? ? ? ? ? ? ? ? ? ? })
? ? ? ? ? ? ? ? ? };
? ? ? ? ? ? });
};??
let promise1 = new Promise(function(resolve) {
? ?resolve(1);
});
let promise2 = new Promise(function(resolve) {
? ?resolve(2);
});
let promise3 = new Promise(function(resolve) {
? resolve(3);
});
let promiseAll = Promise.all([promise1, promise2, promise3]);
promiseAll.then(function(res) {
? ?console.log(res);?
});?
Promise.all = function(arr){
? ? ? ? let result = [], count = 0;
? ? ? ? return new Promise(function(resolve, reject){
?? ? ? ? ? ? ? ?arr.map(item=>{
? ? ? ? ? ? ? ? ? ? item.then(res=>{
? ? ? ? ? ? ? ? ? ? ? ? ? ?result[count] = res;
? ? ? ? ? ? ? ? ? ? ? ? ? ?count++;
? ? ? ? ? ? ? ? ? ? ? ? ? ?(count === arr.length) && resolve(result);
? ? ? ? ? ? ? ? ? ? ? ?}).catch(err=>{
? ? ? ? ? ? ? ? ? ? ? ? ? ?result[count] = err;
? ? ? ? ? ? ? ? ? ? ? ? ? ?count++;
? ? ? ? ? ? ? ? ? ? ? ? ? (count === arr.length) && resolve(result);
? ? ? ? ? ? ? ? ? ? ? ?});
? ? ? ? ? ? ? ? ? ?});
? ? ? ? ? ?});
};
var p1 = new Promise(function(resolve, reject){reject(1)})
var p2 = new Promise(function(resolve, reject){resolve(2)})
Promise.all([p1, p2]).then(res=>{
? ? ? ? ?console.log(res)
})
let，const，var聲明變量的作用域不同；變量提升；（+1）
? ? ?變量的賦值可以分為三個階段：
1、創(chuàng)建變量，在內(nèi)存中開辟空間
2、初始化變量，將變量初始化為undefined（let和const聲明的初始化時不會分配內(nèi)存，所以會存在暫時性死區(qū)）
3、真正賦值
? let，const，var的區(qū)別?（+1）
作用域概念不同；?變量提升（+1）
es6數(shù)組常用的api?（+1）
set，map，剪頭函數(shù)和普通函數(shù)的區(qū)別?（+1）
map遍歷相對于其他遍歷方式的優(yōu)點?（+1）
class
模板字符串：標簽模板
await和async的使用?（+1）
promise.all的實現(xiàn)?（+2）
6、isNaN和Number.isNaN的?區(qū)別?。
isNaN會有一個轉(zhuǎn)換，能夠轉(zhuǎn)換為數(shù)字類型的都返回false，
Number.isNaN是嚴格判斷是否為NaN
6、數(shù)組的flat扁平化方法。
返回一個新數(shù)組對原數(shù)組沒有影響，默認扁平化一級
6、正則（獲取url參數(shù)等）。
7、純函數(shù) （+1）
7、數(shù)據(jù)類型的判斷?（+1）
7、instanceof的實現(xiàn)原理?（+1）
7、手寫new的實現(xiàn)?（+2）
7、手寫call和apply的實現(xiàn)（+1）
7、defer和async的區(qū)別?（+1）
7、js監(jiān)聽對象屬性的改變具體是怎么實現(xiàn)的，它們各自有什么特點？?（+1）
7、移動端適配；sass，less的優(yōu)點；移動端幾倍圖是根據(jù)什么來定義的?（+1）
7、css布局，flex布局方式?（+1）
7、實現(xiàn)正方形?（+2）
7、五種以上居中方式?居中?（+1）
7、瀏覽器如何解析css選擇器
7、css樣式?jīng)_突的解決方案，scoped的實現(xiàn)原理
7、css選擇器的優(yōu)先級（+1）
框架應用類：
1、?防抖節(jié)流?；?（+3）
防抖可應用于阻止重復發(fā)送請求，一段時間內(nèi)重復觸發(fā)的話則會重新計算時間，只會執(zhí)行最后一次；
節(jié)流是只認第一次的操作，在某一時間段內(nèi)不管觸發(fā)多少次，只執(zhí)行第一次函數(shù)的回調(diào)；
2、vue雙向數(shù)據(jù)綁定的實現(xiàn)。（+2）
defineProperty——>
2、computed和watch的區(qū)別。（+2）
3、vue中key的作用是什么？?（+2）
——>diff算法——>重繪和回流（重排）
重繪回流（+1）
3、vue生命周期?（+1）
3、webpack相關(guān)。
優(yōu)化（配置優(yōu)化，代碼優(yōu)化）?（+2）
webpack熱更新原理?（+1）
chunk和baundle的區(qū)別?（+1）
壓縮插件的弊端?（+1）
4、axios和ajax的區(qū)別，fetch的區(qū)別，優(yōu)勢。
5、?跨域方法?。
思路：說到跨域先了解同源策略——>常見的跨域場景——>解決方案
6、組件化
7、設(shè)計模式；
常用的設(shè)計模式以及解決了什么問題
8、cdn
8、node的了解
9、vue和react的設(shè)計理念，react的簡單了解
9、輸入url到頁面渲染發(fā)生了什么（+1）
9、性能優(yōu)化（+1）
9、性能監(jiān)控（+1）
9、http協(xié)議相關(guān)（+1）
9、export和export default，moudle.export的區(qū)別（+1）
9、內(nèi)存泄露（+1）
算法類：
1、數(shù)組去重，考慮優(yōu)化，盡量用最優(yōu)的算法實現(xiàn)。?數(shù)組去重方法
for(var i = 0, len = arr.length; i < len; i++){
? ? ? for(var j = i+1, lenj = arr.length; j < lenj; j++){
? ? ? ? ? ? ?if(arr[i] == arr[j]){
? ? ? ? ? ? ? ? arr.splice(j, 1);
? ? ? ? ? ? ? ? j--;
? ? ? ? ? ? ? ?lenj--;
? ? ? ? ? ? ? ?i--;
? ? ? ? ? ? ? ?len--;
? ? ? ? ?}
? ??}
}
var obj = {};
for(var i = 0, len = arr.length; i < len; i++){
? ? ? if(!obj[arr[i]]){
? ? ? ? ?obj[arr[i]] = arr[i];
? ? ?}
}
console.log(Object.values(obj))
利用indexOf
2、尋找數(shù)組中第k大值。
2、判斷字符串同構(gòu)。
3、排序，二叉樹遍歷（中序?（+1）?，后序，前序）。
3、微信紅包算法。
想持續(xù)了解更多，不妨點贊和關(guān)注唄。
Web前端技術(shù)交流q群：1137068794，
群里可以一起學習編程，進群能領(lǐng)到學習資料以及源代碼
