面試知識點集合

我的遇到的面試知識點：

1.怎麼判斷一個變量是數組仍是對象

 

2.type of和instance of的區別

 instance of的返回值是布爾類型，而type of的返回值能夠有number、boolean、string、function、object、undefined

 

3.字符串有哪些方法

charAt()、 indexOf()、lastIndexOf()、substring()、slice()、substr()、replace()、search()查找str與一個正則表達式是否匹配若是匹配成功則返回正則表達式在字符串中首次匹配項的索引不然返回-一、match()返回一個包含匹配結果的數組、split()返回一個數組、trim()、toLowerCase()、toUpperCase()後邊這三個方法返回str的副本不影響自己

 

4.slice和substring的區別

slice的參數能夠爲負，substring不能夠若傳入負值則視爲0

 

5.類和麪向對象的概念

6.講講單線程和多線程

 

7.nodeJS中的global有哪些方法

  setTimeout、clearTimeout、setInterval、clearInterval、console

 

8.怎麼生成對象

工廠模式、原型繼承、直接定義、字面量

 

9.怎麼把數組清空

array.length=0

 

10.js中有哪些循環？for in和for of的區別

for in循環鍵名key，for of循環值value且for of是es6新添加的特性,for of只能夠循環可迭代對象的可迭代屬性

 

11.瞭解數據結構和軟件工程嗎？

12.二叉樹

 

13.數組的去重方法

Set數據結構，它相似於數組，其成員的值都是惟一的。

利用Array.from將Set結構轉換成數組

function dedupe(array){
 return Array.from(new Set(array));
}
dedupe([1,1,2,3]) //[1,2,3]

拓展運算符(...)內部使用for...of循環

let arr = [1,2,3,3];
let resultarr = [...new Set(arr)]; 
console.log(resultarr); //[1,2,3]

 http://www.jb51.net/article/118657.htm

 

14.call和apply的區別

不一樣點：call的第二個參數能夠接受任意個參數，apply最多隻有兩個參數，第二個數組接收數組或類數組但都會被轉換成類數組傳入func中

相同點：都可以改變方法的執行上下文（執行環境），將一個對象的方法交給另外一個對象來執行，而且是當即執行

https://www.jianshu.com/p/131ce0390cf8 

 

15.get和post的區別

• GET在瀏覽器回退時是無害的，而POST會再次提交請求。

   

• GET產生的URL地址能夠被Bookmark，而POST不能夠。

   

• GET請求會被瀏覽器主動cache，而POST不會，除非手動設置。

   

• GET請求只能進行url編碼，而POST支持多種編碼方式。

   

• GET請求參數會被完整保留在瀏覽器歷史記錄裏，而POST中的參數不會被保留。

   

• GET請求在URL中傳送的參數是有長度限制的，而POST麼有。

   

• 對參數的數據類型，GET只接受ASCII字符，而POST沒有限制。

   

• GET比POST更不安全，由於參數直接暴露在URL上，因此不能用來傳遞敏感信息。

   

• GET參數經過URL傳遞，POST放在Request body中。

GET和POST本質上就是TCP連接，並沒有差異。可是因爲HTTP的規定和瀏覽器/服務器的限制，致使他們在應用過程當中體現出一些不一樣。 

GET和POST還有一個重大區別，簡單的說：

GET產生一個TCP數據包；POST產生兩個TCP數據包。

長的說：

對於GET方式的請求，瀏覽器會把http header和data一併發送出去，服務器響應200（返回數據）；

而對於POST，瀏覽器先發送header，服務器響應100 continue，瀏覽器再發送data，服務器響應200 ok（返回數據）。

 

由於POST須要兩步，時間上消耗的要多一點，看起來GET比POST更有效。所以Yahoo團隊有推薦用GET替換POST來優化網站性能。但這是一個坑！跳入需謹慎。爲何？

1. GET與POST都有本身的語義，不能隨便混用。

2. 據研究，在網絡環境好的狀況下，發一次包的時間和發兩次包的時間差異基本能夠無視。而在網絡環境差的狀況下，兩次包的TCP在驗證數據包完整性上，有很是大的優勢。

3. 並非全部瀏覽器都會在POST中發送兩次包，Firefox就只發送一次。

參考連接：http://mp.weixin.qq.com/s?__biz=MzI3NzIzMzg3Mw==&mid=100000054&idx=1&sn=71f6c214f3833d9ca20b9f7dcd9d33e4#rd 

 

16.css中的三角形怎麼畫

#triangle-up {
    width: 0;
    height: 0;
    border-left: 50px solid transparent;//其他兩邊顏色爲transparent
    border-right: 50px solid transparent;
    border-bottom: 100px solid red;//此時三角形方向向上因此對應的bottom要有高度和顏色，其餘方向的三角形同理
}

 

 

 

17.css中怎麼清除浮動

父級div定義 僞類:after 和 zoom

.clearfloat:after{display:block;clear:both;content:"";visibility:hidden;height:0} 
.clearfloat{zoom:1} 

原理：IE8以上和非IE瀏覽器才支持:after，原理和方法2有點相似，zoom(IE轉有屬性)可解決ie6,ie7浮動問題

優勢：瀏覽器支持好、不容易出現怪問題（目前：大型網站都有使用，如：騰迅，網易，新浪等等）

缺點：代碼多、很多初學者不理解原理，要兩句代碼結合使用才能讓主流瀏覽器都支持。

建議：推薦使用，建議定義公共類，以減小CSS代碼。

http://www.jb51.net/css/173023.html

 

18.ES6新增了哪些東西，let和const定義的值能夠改變嗎？

let 聲明變量，變量不會被提高

for 循環中 使用let 定義變量，只在for的循環週期內可使用。

 

const 除了不能改變物理指針的特性，其餘特性和 let 同樣。

當聲明普通數據類型的時候，那麼一但聲明瞭，就不能夠再改變。

當聲明覆雜數據類型的時候，物理指針不能夠改變，可是能夠改變數據內的屬性值，以及能夠給數據添加新屬性等操做

https://www.cnblogs.com/copperhaze/p/6145302.html 

 

19.基本類型和引用類型的區別？

基本類型：存放在棧中

引用類型：存放在堆中

 

20.display:inline-flex

 

21.drop-shadow

 drop-shadow和box-shadow參數同樣，但box-shadow的陰影距離更小，色值要更深

box-shadow支持inset內陰影但drop-shadow沒有

 drop-shadow不能陰影疊加

drop-shadow不只能夠穿透代碼構建的元素的透明部分，PNG圖片的透明部分也是能夠穿透的,可是box-shadow是盒陰影

 drop-shadow的實際應用：實現尖角帶陰影的提示面板效果

 

 22.websocket

主要被服務器主動向客戶端傳輸數據，由於通常狀況下，只有客戶端向服務器請求時，服務器纔會傳數據

 

23.div如何在body中垂直左右居中？

用position:absolute相對定位

 

24.ajax怎麼跨域？

代理（須要後臺設置）、jsonp、xhr2

 

25.jquery對象怎麼轉換爲dom對象？

（1）jQuery 對象是一個數據對象，能夠經過 [index] 的方法，來獲得相應的 DOM 對象

var $v = $("#v"); //jQuery 對象
var v = $v[0]; //DOM 對象
alert(v.checked); //檢測這個checkbox是否被選中

 

（2）jQuery 自己提供，經過.get(index) 方法獲得相應的 DOM 對象

var $v = $("#v"); //jQuery 對象
var v = $v.get(0); //DOM對象 ( $v.get()[0] 也能夠 )
alert(v.checked); //檢測這個 checkbox 是否被選中  HTML DOM checked 屬性

 如下寫法都正確：

$("#div").html();

$("#div")[0].innerHTML;

$("#div").eq(0)[0].innerHTML;

$("#div").get(0).innerHTML;

$(document.getElementById("div")).html();

 

26.eq的用法？

eq() 方法將匹配元素集縮減值指定 index 上的一個。

若是給定表示 DOM 元素集合的 jQuery 對象，.eq() 方法會用集合中的一個元素構造一個新的 jQuery 對象。所使用的 index 參數標示集合中元素的位置。 

 

27.webworker

web worker 是運行在後臺的 JavaScript，不會影響頁面的性能。

當在 HTML 頁面中執行腳本時，頁面的狀態是不可響應的，直到腳本已完成。

web worker 是運行在後臺的 JavaScript，獨立於其餘腳本，不會影響頁面的性能。您能夠繼續作任何願意作的事情：點擊、選取內容等等，而此時 web worker 在後臺運行。

 

因爲 web worker 位於外部文件中，它們沒法訪問下例 JavaScript 對象：

• window 對象
• document 對象
• parent 對象

 

28.restful

 

29.vw和百分比的區別

和rem與em之間的區別有點相似，rem是針對於根節點的，而em是針對於父級的。vw就相似於rem也是針對於總體的父元素，而百分比就是和最近的父元素比較，若是層級多了就很亂。

 

30.僞類和僞元素

 

 

31.觀察者模式中的類和對象

 

32.用遞歸的方法找出一個樹結構中數據相同的節點有幾個？

 

33.jquery中的defer（用到了then）

 

34.當即執行函數中的閉包爲何要傳進去一些參數值進去呢？

可能某個情境下，包裹着當即函數的函數做用域內定義的有對象屬性和方法，而閉包內用到了外邊對象的屬性，這時可能這個屬性有不少值，而當即函數若是不傳參數就會取呢個屬性的最後一個值。這種狀況是不行的，傳參就是爲了要讓總體上下文運行時都能取到當前的值。

 

35.css中有一個針對ios中頁面滾動的屬性

 

36.白屏的優化

 

37.flex的好處

 

 

 

 

 

 

3.web安全：xss、csrf