前端面試總結

####第一家(將臺--sanliuling)javascript

//vue雙向綁定的原理

//es6
//var 和let的區別
https://www.cnblogs.com/lml-lml/p/9585749.html(這個博客解釋了這倆的區別)
//前端數據可視化
//柵格化
//vueX的原理,狀態管理器,怎麼存值,怎麼取值,怎麼改變值
//佈局
//前端防止攻擊(XSS和CSRF)
xss攻擊是經過用戶輸入植入腳本,應該對用戶的每一條輸入都用正則驗證

//跨域
https://www.cnblogs.com/lml-lml/p/9579903.html
//echarts圖表
//call和apply的區別
功能相同,可是傳入參數的形式不一樣
apply(A,[] )
call(A,num1,num1)
均可以用來代替另外一個對象調用一個方法,將一個函數的對象上下文從初始改成新指定的
//attr和prop的區別
當你勾選一個input的時候,attr返回的是checked而prop返回的是true
attr自定義Dom屬性,prop是元素自己自帶的固有屬性
//CMD和AMD的區別
//js的引入方式
內嵌式  外部引用 內部引用
//數據類型
//強制轉換和隱士轉換
//webpack打包

####第二家(宣武門--yangguanggongcai)css

//跨域

####第三家(中關村--haoweilai)html

//iframe,怎麼往出送數據
//跨域
https://www.cnblogs.com/lml-lml/p/9579903.html
//父盒子套子盒子水平居中,垂直居中
//深拷貝和淺拷貝
//閉包的優勢和缺點
//jsonp跨域
https://www.cnblogs.com/lml-lml/p/9579903.html
//cors跨域
//css的權重
//原生動態建立一個元素
//追加到別的元素上
//對象之間的指針問題
//做用域
//javascript的繼承
//link和import的區別
1.從屬關係區別
@import是css提供的語法規則,只有導入樣式表的做用,
link是HTML提供的標籤,不只能夠加載css文件,還能夠定義RSS.  rel鏈接屬性等
2.加載順序區別
加載頁面的時候,link引入的css被同時加載,@import引入的css將在頁面加載完畢後被加載。
3.兼容性區別
import是css2纔有的語法,故可在IE5才能識別;link標籤做爲HTML元素,不存在任何的兼容性的問題
4.DOM可控制區別
能夠經過js操作DOM,插入link標籤來改變樣式,因爲DOM方法 是基於文檔的,沒法使用@import的方式插入樣式
5.權重區別
link引入的樣式權重大於@import引入的樣式
//vue的父子通訊,
//vue的兄弟組建通訊
//你怎麼驗證一個數據是數組
1.經過判斷變量的類型,而且變量的length屬性,
var arr =[2,3,4];
var obj={"name":"xiaoming"};

console.log(typeof arr)  //object
console.log(typeof obj)   //object
console.log(arr.length)   //3
console.log(obj.length)   //undefined
2.經過isArrray來判斷
console.log(Array.isArray(arr));
3.使用contact方法
返回一個新數組,證實是數組,不是的會報錯
4.使用isPrototypeOf()函數
檢測一個對象是否是Array的原型(若是處於原型鏈中,不但能夠檢測直接父對象,還能夠檢測整個原型鏈上的全部父對象)
使用方法:parent.isPrototypeOf(child)來檢測parent是否爲child的原型
 var arr=[2,3,4,"haa"];
    var object={"name":"maomao","age":20};
    console.log(Array.prototype.isPrototypeOf(arr));    //true
    console.log(Array.prototype.isPrototypeOf(object)); //false
5.instanceof指出對象是不是特定類的一個實例
:instanceof 檢測一個對象A是否是另外一個對象B的實例的原理是:查看對象B的prototype指向的對象是否在對象A的[[prototype]]鏈上。若是在,則返回true,若是不在則返回false。不過有一個特殊的狀況,當對象B的prototype爲null將會報錯(相似於空指針異常)。
 var arr=[2,3,4,"haa"];
        var obj={"name":"maomao","age":20};
        console.log(arr instanceof Array);  //true
        console.log(obj instanceof Object);  //true

        console.log(arr instanceof Object);  //true
        ---這裏跟網上的不一樣,不知道是什麼緣由
        console.log(obj instanceof Array);  //false
//css盒子模型
分爲標準和模型和ie盒模型(以下圖)

####第四家(立水橋--lingdingyingyu)前端

//pop shift unshift push的區別
shift用於把數組的第一個元素刪除,並返回第一個元素的值,
unshift向數組的。開頭增長一個或者多個元素。返回的仍是原來的數組
pop刪除數組的最後一個元素,並把數組的長度減一,而且返回他刪除的元素的值,若是數組已經爲空,那麼不改變數組,返回undefined
push像數組的末尾增長一個或者多個元素,並返回新的長度
//面向對象的三大特徵
封裝 繼承 多態
//typeof返回的數據類型有哪些
string nunber object function undefined  boolean
//vue的生命週期

//跨域
//promises的優勢和缺點是什麼
//vue-router跳轉頁面有幾種方式,分別是什麼?怎麼獲取路由傳遞過來的參數
//一個new幹了哪些步驟
一、開闢內存建立一個新對象,並把this指向指過去
二、將構造函數的做用域賦值給新對象
三、添加屬性
四、返回一個新對象
//項目部署

####第五家(三元橋--tongyikeji)vue

//css實現居中的方式有哪些?
https://www.cnblogs.com/lml-lml/p/9579730.html  (單獨一個博客)
//settimeout輸出方式,實例化promise的輸出
//box-sizing有幾種屬性
//鏈接數組的方法
//去重
//vue的雙向數據綁定的原理
//vue-router有什麼屬性
//vue的生命週期
//vuex狀態管理器

####第六家(蘇州街--qihang)java

//ssr渲染方式
//前端vue項目使用jenkins自動化部署
//手機適配
//你遇到過哪些兼容性的問題

####第七家(蘇州街--zhiliankeji)jquery

//vue路由的分離跳轉
vue是一套構建用戶界面的漸進式框架。有能力採用單文件組件來開發更爲複雜的單頁應用。其實 頁面是始終不變的,就至關於一個容器,變得只是容器裏面的內容。即跳轉的只是組件,
//路由跳轉的方式
1.使用<router-link>映射路由
2.使用編程式導航this.$router.push(location)來修改

####第八家(豐臺科技園--wantaizhonglian)webpack

//跨域。。。爲何會形成跨域?跨域能形成什麼問題?怎麼解決跨域
https://www.cnblogs.com/lml-lml/p/9579903.html
//函數聲明和函數表達式的區別
//h5的新特性
//一個真正的http請求作了些什麼
    分爲4個步驟:
    (1),當發送一個URL請求時,無論這個URL是Web頁面的URL仍是Web頁面上每一個資源的URL,瀏覽器都會開啓一個線程來處理這個請求,同時在遠程DNS服務器上啓動一個DNS查詢。這能使瀏覽器得到請求對應的IP地址。
    (2), 瀏覽器與遠程`Web`服務器經過`TCP`三次握手協商來創建一個`TCP/IP`鏈接。該握手包括一個同步報文,一個同步-應答報文和一個應答報文,這三個報文在 瀏覽器和服務器之間傳遞。該握手首先由客戶端嘗試創建起通訊,然後服務器應答並接受客戶端的請求,最後由客戶端發出該請求已經被接受的報文。
    (3),一旦`TCP/IP`鏈接創建,瀏覽器會經過該鏈接向遠程服務器發送`HTTP`的`GET`請求。遠程服務器找到資源並使用HTTP響應返回該資源,值爲200的HTTP響應狀態表示一個正確的響應。
    (4),此時,`Web`服務器提供資源服務,客戶端開始下載資源。

請求返回後,便進入了咱們關注的前端模塊
簡單來講,瀏覽器會解析`HTML`生成`DOM Tree`,其次會根據CSS生成CSS Rule Tree,而`javascript`又能夠根據`DOM API`操做`DOM`

//路由的跳轉
上面已解釋
//導航鉤子函數
//jquery源碼有什麼好處?
相關文章
相關標籤/搜索