摘要：以上是面試中筆試涉及到的知識(shí)點(diǎn)或者后面被問到的只是點(diǎn)。也許是根據(jù)薪資和面試的等級(jí)來(lái)出題的。我剛面試完回家，吃了一個(gè)泡面，回憶下面試題。同時(shí)作為傳遞到構(gòu)造函數(shù)，執(zhí)行了一次讓構(gòu)造函數(shù)里面的屬性和方法賦值了一份給。

如何水平垂直居中，請(qǐng)盡量多說(shuō)幾種方法？很尷尬，我多次面試都被問到這個(gè)問題，fuck
定位（回答了）、table-cell布局、flex布局、translate+relative定位

w3c和ie盒模型區(qū)別 我回答反了 尷尬

jquery中如何只實(shí)現(xiàn)一次事件綁定 $("dom").one 這個(gè)方法我居然一次也沒用過(guò)，也沒見過(guò)

事件委托的原理 貌似回答錯(cuò)了，事件冒泡和事件捕獲，不同瀏覽器機(jī)制不同，我兩者居然結(jié)合在一起了，說(shuō)先冒泡再捕獲，打臉哦

jsonp原理 勉強(qiáng)回答出來(lái)了，算正確吧

原型鏈繼承

閉包、作用域

this以及如何改變this執(zhí)行

vue如何實(shí)現(xiàn)原理 object.defineproperty 數(shù)據(jù)劫持，只回答出這么一個(gè)知識(shí)點(diǎn)。

說(shuō)出v-for是如何實(shí)現(xiàn)的 懵逼的

webpack實(shí)現(xiàn)原理 剛學(xué)webpack還看錯(cuò)，1年過(guò)去了，早忘記了

import 和export用法 面試題這個(gè)也做錯(cuò)了。緊張。

以上是面試中筆試涉及到的知識(shí)點(diǎn)或者后面被問到的只是點(diǎn)。
以下是筆試題，貌似有2套，但我拿到的是另外一套。也許是根據(jù)薪資和面試的等級(jí)來(lái)出題的。我剛面試完回家，吃了一個(gè)泡面，回憶下面試題。

. 考察原型鏈繼承的問題

function A() {
  this.name = "a"
  this.color = ["green", "yellow"]
}
function B() {
  
}
B.prototype = new A()
var b1 = new B()
var b2 = new B()
b1.name = "change"
b1.color.push("black")
問：
console.log(b1.name) // change
console.log(b2.name) // a
console.log(b1.color) // ["green", "yellow", "black"]
console.log(b2.color) // ["green", "yellow", "black"]

解析為何：
B.prototype = new A() 實(shí)現(xiàn)了繼承，需要一個(gè)中間變量來(lái)理解原型繼承更好理解。

var f = new A()
B.prototype = f

var f = new A()后，f.__proto__ 指向了A的原型（A.prototype），構(gòu)造函數(shù)A執(zhí)行的時(shí)候，this傳遞的是f，所以此時(shí)在f在有了構(gòu)造函數(shù)A里面的屬性和方法。B.prototype = f,可以理解B的原型和f指向了同一個(gè)Object,(因?yàn)?f = new A（)實(shí)際返回的是一個(gè)Object對(duì)象，而這個(gè)對(duì)象的__proto__ 執(zhí)行了A的原型)所以連等后，當(dāng)b1 = new B(),所以當(dāng)執(zhí)行b1.name的時(shí)候會(huì)去原有的實(shí)例對(duì)象去找，如果找不到，就會(huì)向想沿著__proto__原型鏈找到B.prototype這個(gè)原型對(duì)象。而這個(gè)對(duì)象又指向了new A()

B.prototype指向new A()怎么理解呢？
就是B.prototype.__proto__ ==== A.prototype。同時(shí)B.prototype作為this傳遞到A構(gòu)造函數(shù)，執(zhí)行了一次A().讓A構(gòu)造函數(shù)里面的屬性和方法賦值了一份給B.prototype。從而達(dá)到了繼承了A構(gòu)造函數(shù)和原型上的屬性和方法。

. 考察閉包，作用域的問題

// 經(jīng)典考題
for(var i = 0 ; i < 5; i ++) {
  setTimeout(function() {
    console.log(i) // 5, 5, 5, 5, 5
  },1000)
}
// 如何打印出1，2，3，4，5
// 我答案是說(shuō)出來(lái)了，用let 產(chǎn)生塊級(jí)作用域，以及采用一個(gè)函數(shù)自執(zhí)行的方式。但為什么卡主了

.考察this指向問題，以及如何改變this指向

var obj = {
  name: "zj",
  getName: function() {
     console.log(this.name)
  }
}
var fn = obj.getName
console.log(fn()) // undefined
// 如何讓fn() 打印出‘zj’ 利用call或apply或bind改變this指向
console.log(obj.getName()) // "zj"

.es6模塊的問題，那套題我做錯(cuò)了，其實(shí)很簡(jiǎn)單，當(dāng)時(shí)太緊張了。就不寫出來(lái)了，而且代碼很長(zhǎng)，主要考察import 和 export 和變量的問題。
最后附錄以下公司的環(huán)境，反正也掛了。
其實(shí)面試題，我懂原理的比較少，就是你做出來(lái)了，但讓我說(shuō)出為何時(shí)這個(gè)答案挺困難的，特別是原型鏈（不過(guò)這個(gè)原型鏈雖然很基礎(chǔ)，但原型鏈的問題我很久沒研究過(guò)了，也可能是學(xué)得比較死吧，記住的那種學(xué)習(xí)，所以完全是懵逼的。）閉包讓我說(shuō)為什么真挺困難的，雖然自己曾經(jīng)也寫了博客的

回憶下我從去年年底，到今年年初收到的面試經(jīng)歷吧，然后談?wù)劶记伞?/p>

有贊 （電面5分鐘就pass,主要考算法，比如排序有幾種方式，復(fù)雜度等）

阿里體育（電面30分鐘）

支付寶（電面30分鐘，主要問基礎(chǔ)，最后被卡住的問題是jquery源碼和深拷貝，原諒我當(dāng)初深拷貝用得真的很少?。?/p>

51公積金

二維火（面試官人特別好，回答不上的會(huì)給你講解，主要問vue）

淘粉吧（當(dāng)天下午面試了4輪，不過(guò)1面最重要，當(dāng)時(shí)以為沒問題，最后一面卡在了canvers和css3特效上，以及當(dāng)初他們要招聘做有開發(fā)小程序經(jīng)驗(yàn)的人，）

順網(wǎng)科技

總結(jié)下他們面試的基本套路

. css

一定有水平垂直居中，盒模型，塊級(jí)和行內(nèi)元素。
flex布局

. 原生js

原型鏈，閉包，作用域，this，變量和函數(shù)提升
這我就不舉例了考察的問題很多，網(wǎng)上有
. jq
document.ready()方法 不寫這個(gè)方法會(huì)有什么后果？
常見的一些api
jq的源碼（支付寶考察）
. 其他
webpack 比如原理，或者說(shuō)之前沒有webpack的時(shí)候，如何友好的解決，說(shuō)白了就是為何用webpack
這里會(huì)延伸到require.js和sea.js，雖然現(xiàn)在用的公司已經(jīng)很少了
http/tcp 和https
輸入url到底發(fā)生了什么（涉及最后的瀏覽器渲染原理）
跨域解決方案最容易問到j(luò)sonp原理，nginx轉(zhuǎn)發(fā)等
es6語(yǔ)法，比如let和const與var區(qū)別
箭頭函數(shù)和一般函數(shù)區(qū)別

. mvvm框架（vue：因?yàn)槲矣玫氖莢ue）
首先當(dāng)然是原理?。ㄟ@里很容易卡主哦）
鉤子函數(shù)，分別說(shuō)能在里面實(shí)現(xiàn)什么
解釋vuex是什么？vuex為何是一個(gè)單項(xiàng)流過(guò)程
mututations為何只能是同步不能異步