前端總結

Jenny_Tong 發布于2019-08-23 15:33 / 1028人閱讀

摘要：是一個雙目運算符內部實現機制是通過原型鏈來判斷能自定義行為的東西三類型轉換轉除了其他所有值都轉為包括所有對象對象轉原始類型對象在轉換類型的時候，會調用內置的函數該方法在轉原始類型時調用優先級最高。

JS基礎知識

（一）JS中原始類型
(1)原始值有六種：boolean,null,undefined,number,string,symbol
(2)原始類型存儲的都是值，沒有函數可以調用，能夠函數調用是因為進行了強制類型轉換，轉換成對象類型
(3)number類型為浮點型類型 eg:0.1+0.2!=0.3 string類型是不可變 string類型調用任何方法，不會改變其值
（二）JS對象類型
原始類型和對象類型的區別？

原始類型存儲值，對象類型存儲地址（指針）

（1）函數參數是對象的情況？
函數傳參是傳遞對象指針的副本
（2）typeof vs instanceof
typeof是否能正確判斷類型？instanceof正確判斷對象的原理？

typeof對原始類型除了null都可以判斷出類型對象類型除了function 其他全顯示object typeof是一個一元運算符

function本質上也是一個對象，但是function對象與普通對象相比，其內部有一個[[Call]]方法，用來表示這個對象是可調用的，typeof操作
符在判斷Object時，如果內部實現了[[Call]]方法,就返回function。

instanceof是一個雙目運算符內部實現機制是通過原型鏈來判斷 Symbol.hasInstance能自定義instanceof行為的東西

（三）類型轉換
（1）轉Boolean

除了undefined null false NaN "" 0 -0 其他所有值都轉為true 包括所有對象

（2）對象轉原始類型

對象在轉換類型的時候，會調用內置的 [[ToPrimitive]] 函數 該方法在轉原始類型時調用優先級最高。

 let a = {
     valueOf() {
    return 0
  },
  toString() {
    return "1"
  },
  [Symbol.toPrimitive]() {
    return 2
  }
}
1 + a // => 3

(3)四則運算符
加法運算符的特點：

運算中其中一方為字符串，那么就會把另一方也轉換為字符串（優先轉化成字符串）

如果一方不是字符串或者數字，那么會將它轉換為數字或者字符串（布爾值轉化為數字其他優先字符串）

除了加法運算符，其他運算符只要其中一方是數字，那么另一方就會被轉為數字
比較運算符

如果是對象，就通過toPrimitive轉換為對象

如果是字符串，就通過unicode字符索引來比較

（四）this
如何正確判斷this?箭頭函數的this是什么?
this指向哪里的優先級規則：new>bind>obj.foo()>foo() 箭頭函數一旦被綁定，就不會再被任何方式所改變

（五）== vs ===
== vs === 有什么區別？
==:如果類型不同，會進行類型轉換
判斷一方是boolean會轉化成number 再進行比較可能會繼續類型轉換
判斷一方是object且另一方為string、number、symbol會把object轉為原始類型再進行判斷
（六）閉包
什么是閉包？內部函數可以訪問外部函數的變量
循環中使用閉包解決‘var’定義函數的問題

for (var i = 1; i <= 5; i++) {
  setTimeout(function timer() {
    console.log(i)
  }, i * 1000)
}

setTimeout是個異步函數，會把循環全部執行完畢，i 就是6
解決辦法一

for (var i = 1; i <= 5; i++) {
  (function(j) {
    setTimeout(function timer() {
      console.log(j)
    }, j * 1000)
  })(i)
}

使用了立即執行函數將 i 傳入函數內部，這個時候值就被固定在了參數 j 上面不會改變，當下次執行 timer 這個閉包的時候，就可以使用外部函數的變量 j（執行上下文作用域鏈優先尋找最近的）

解決辦法二

for (var i = 1; i <= 5; i++) {
  setTimeout(
    function timer(j) {
      console.log(j)
    },
    i * 1000,
    i
  )
}

使用 setTimeout 的第三個參數，這個參數會被當成 timer 函數的參數傳入
解決辦法三

for (let i = 1; i <= 5; i++) {
  setTimeout(function timer() {
    console.log(i)
  }, i * 1000)
}

使用 let 定義 i 了來解決問題了
（七）深淺拷貝
什么是淺拷貝？如何實現淺拷貝？什么是深拷貝？如何實現深拷貝？
Object.assign淺拷貝只會拷貝所有的屬性值到新的對象中，如果屬性值是對象，拷貝的是地址
通過展開運算符...同樣實現淺拷貝
淺拷貝只解決第一層的問題
深拷貝：通過JSON.parse(JSON.stringify(object))
局限性：會忽略undefined,symbol,不能序列化函數，不能解決循環引用的對象
lodash實現深拷貝
（八）原型
如何理解原型？如何理解原型鏈？

GPU云服務器云服務器年終總結網絡總結方法總結函數總結

文章版權歸作者所有，未經允許請勿轉載,若此文章存在違規行為，您可以聯系管理員刪除。

轉載請注明本文地址：http://specialneedsforspecialkids.com/yun/102238.html

前端最強面經匯總

摘要：獲取的對象范圍方法獲取的是最終應用在元素上的所有屬性對象即使沒有代碼，也會把默認的祖宗八代都顯示出來而只能獲取元素屬性中的樣式。因此對于一個光禿禿的元素，方法返回對象中屬性值如果有就是據我測試不同環境結果可能有差異而就是。花了很長時間整理的前端面試資源，喜歡請大家不要吝嗇star~ 別只收藏，點個贊，點個star再走哈~ 持續更新中……，可以關注下github 項目地址 https:...

wangjuntytl 2019-08-26 10:41 評論0 收藏0
2016年總結 - 收藏集 - 掘金

摘要：然而這次的文章，就像賀師俊所說的這篇文章是從程序員這個老年度總結前端掘金年對我來說，是重要的一年。博客導讀總結個人感悟掘金此文著筆之時，已經在眼前了。今天，我就來整理一篇，我個人認為的年對開發有年終總結掘金又到 2016 Top 10 Android Library - 掘金過去的 2016 年，開源社區異?；钴S，很多個人與公司爭相開源自己的項目，讓人眼花繚亂，然而有些項目只是曇花一...

DataPipeline 2019-08-20 16:04 評論0 收藏0
個人分享--web前端學習資源分享

摘要：前言月份開始出沒社區，現在差不多月了，按照工作的說法，就是差不多過了三個月的試用期，準備轉正了一般來說，差不多到了轉正的時候，會進行總結或者分享會議那么今天我就把看過的一些學習資源主要是博客，博文推薦分享給大家。 1.前言 6月份開始出沒社區，現在差不多9月了，按照工作的說法，就是差不多過了三個月的試用期，準備轉正了！一般來說，差不多到了轉正的時候，會進行總結或者分享會議！那么今天我就...

sherlock221 2019-08-20 18:59 評論0 收藏0
學習前端近一年的反思與總結

摘要：引剛開始大學生活不久后，我邂逅了前端，它闖入我的生活是那么迅速猛烈，在不知不覺中也已一年。此文僅對于自己做出反思與總結，若為向往前端的小白君提供了燃料，不勝榮幸。我正式進入了前端疲勞。引：剛開始大學生活不久后，我邂逅了前端，它闖入我的生活是那么迅速、猛烈，在不知不覺中也已一年。此文僅對于自己做出反思與總結，若為向往前端的小白君提供了燃料，不勝榮幸。初試在剛剛接觸到前端時，是對于...

Brenner 2019-08-01 16:45 評論0 收藏0
參加第二屆前端開發者年度大會總結

摘要：代表公司去參加今年的第二屆前端開發者年度大會，散會的時候，技術老大問我，今天感覺怎么樣，有什么收獲，當時就零零碎碎的回答了一些，不算完美趁著還記得點什么，在這里做個自我回顧總結，謹代表個人見解，有不當之處，或若涉及圖片隱私或者其它問題，煩請代表公司去參加今年的第二屆前端開發者年度大會，散會的時候，Team 技術老大問我，今天感覺怎么樣，有什么收獲，當時就零零碎碎的回答了一些，不算完...

solocoder 2019-08-19 17:55 評論0 收藏0