簡單整理了一下最近遇到的一些面試題-面試進行中
/* 定位 */ position: absolute; top: 50%; left: 50; transform: translate(-50%, 50%); /* flex 佈局 */ display: flex; justify-content: center; align-items: center; 複製程式碼
2、css 盒模型
- box-sizing: content-box; (標準模型)
width = content
- box-sizing: border-box; (IE盒模型)
width = content + padding + border
3、inline 和 inline-block 的區別
- inline 只能設定左右 margin、padding, 不能設定 width 和 height
- inline-block 生成一個塊級別框,但是框的行為跟內聯元素一樣
4、css 中使用過哪些圖片替換方法,如何選擇使用
5、link 跟 @import 的區別
- link 是 HTML 提供的標籤
- link 引用的 css 會同時被載入,而 import 引用的 css 會等到頁面全部被下載完後再載入
- import 老版本瀏覽器不支援
- DOM可控性區別:無法使用 dom 方法插入樣式
JS
1、async/await 跟 promise 的區別
- Promise 程式碼完全都是 Promise 的 API (then、catch 等)
- async/await 是 Generator 函式的語法糖
2、閉包的特性合優缺點
- 什麼是閉包?
閉包就是能夠讀取其他函式內部變數的函式 (來源:blog.csdn.net/yingziziziz… )
- 優點
讀取函式內部的變數 讓區域性變數儲存在記憶體中,實現變數資料共享
- 缺點
- 由於閉包會使得函式中的變數都被儲存在記憶體中,記憶體消耗很大,所以不能濫用閉包,否則會造成網頁的效能問題,在IE中可能導致記憶體洩露。解決方法是,在退出函式之前,將不使用的區域性變數全部刪除
- 閉包會在父函式外部,改變父函式內部變數的值。所以,如果你把父函式當作物件(object)使用,把閉包當作它的公用方法(Public Method),把內部變數當作它的私有屬性(private value),這時一定要小心,不要隨便改變父函式內部變數的值。
- 來源:www.jianshu.com/p/8376170fb…
3、原型、原型鏈,有什麼特點
關於原型其實文章還是蠻多的,看著也有點迷糊segmentfault.com/a/119000000…
4、如何判斷物件型別
typeof、 instanceof 看www.jianshu.com/p/5be700ee6…
5、宿主物件和原生物件的區別
- 原生物件: Object、Function、Array、String、Boolean、Number、Date、RegExp、Error、EvalError、RangeError、ReferenceError、SyntaxError、TypeError、URIError、Global
- 宿主物件: 有宿主提供的物件,在瀏覽器中window物件以及其下邊所有的子物件(如bom、dom等等),在node中是globla及其子物件,也包含自定義的類物件。【何為“宿主物件”?在web中,ECMAScript中的“宿主”當然就是我們網頁的執行環境,即“作業系統”和“瀏覽器”。所有非本地物件都是宿主物件(host object),即由 ECMAScript 實現的宿主環境提供的物件。】
6、call 和 apply 的區別
- .call(this, arg1, arg2, arg3)
- .apply(this, arguments)
7、什麼是閉包
8、解釋 js 的 同源策略, 如何實現跨域訪問
- 同源:
如果兩個頁面擁有 相同 的 協議(protocol),埠(如果指定),和 主機,那麼這兩個頁面就屬於同一個源(origin)。 (協議、域名、埠)
- 跨域
- jsonp
- iframe
- 跨域資源共享(CORS)
- nginx 代理跨域
9、== 和 === 的區別
10、陣列方法 pop, push, unshift, shift
- pop: 刪除陣列最後一個元素,返回刪除的那個元素
- push: 往陣列結尾新增元素
- shift: 刪除陣列第一個元素,返回該元素
- unshift: 往陣列前新增元素
11、事件委託是什麼
事件委託就是利用冒泡的原理,把事件加到父元素或祖先元素上,觸發執行效果。
優點: 提高效能,顯著提高事件處理速度,減少記憶體佔用
var btn6 = document.getElementById("btn6"); document.onclick = function(event){ event = event || window.event; var target = event.target || event.srcElement; if(target == btn6){ alert(btn5.value); } } 複製程式碼
12、split()、join() 的區別
13、例舉 3 種強制型別轉換和 2 種隱式型別轉換
VUE
1、vue 常見報錯
2、父元件通過 props 給子元件傳值,子元件能否修改該值,會有什麼影響
做了個小測試,看:note.youdao.com/noteshare?i…
3、vue 雙向資料繫結原理
4、v-if 和 v-show 指令有什麼相同和不同
v-if 直接從 dom 樹上刪除或重建元素節點, v-show 只是修改 display 的值 v-if 高消耗,不適合做頻繁切換