面試知識點記錄

最近在學校參加校招，正在瘋狂吸入各類面試題，學習的同時，也須要鞏固知識，畢竟我是個記憶力不咋地的小菜雞... 話很少說，開始今天的學習分享吧！

1.px rem em 的區別

他們都是計量單位，用來表示尺寸的。

px: 像素（Pixel）,相對長度單位，是針對顯示器屏幕的分辨率而言的

優勢：利用px設置字體大小和寬高等比較精準

缺點：px不能適應瀏覽器縮放帶來的變化，不適用於響應式網站

em: 表示相對尺寸，其至關於對象內文本的font-size,參考父元素文本里的font-size

優勢：能夠很好的適應設備屏幕的變化，但必定要記得設置父元素的font-size

rem: 也表示相對尺寸，它的參考對象爲根元素的font-size

2.position有哪幾個屬性，具體效果分別是什麼

1. static 默認值，無定位
2. relative 生成相對定位元素，通常在子元素設置成position:absolute的時候，給父元素的position設置成relative
3. absolute 生成絕對定位元素，相對於static定位以外的第一個父元素進行定位
4. fixed 生成絕對定位元素，可是相較於瀏覽器窗口進行定位，常見於各類網站廣告
5. inherit 從父元素繼承position的值

3.absolute元素不設置left和top時會在哪一個位置（父元素頂部，可是包括static的父元素）

會在原來的文檔流位置，可是因爲margin的摺疊效應會向下偏移一點與後面的元素重疊在一塊兒

4.concat()

用於鏈接兩個或多個數組，不會改變現有數組，僅僅返回一個被鏈接的副本

a.concat(b,c,d,e....)

a,b,c,d,e均爲數組

5. Web Storage 分類

• sessionStorage 用於本地存儲一個會話（session）中的數據，會話結束數據隨之消失，只有在同一個會話的時候才能夠訪問。所以，session Storage 不是一種持久化的本地存儲，僅僅爲會話級存儲
• localStorage 用於持久化的本地存儲，除非主動刪除數據，不然永不過時

6.如何用CSS畫一個三角形

width：0；
height: 0;
border: 100px solid #000;
border-left: 50px solid transparent;
border-left: 50px solid transparent;
複製代碼

7.CSS 優先級

!important > 行內樣式 > ID選擇器 > 類選擇器 > 標籤 > 通配符 > 繼承 > 默認

同一級別後寫的會覆蓋先寫的

8. 執行順序問題

console.log(1);
let a = setTimeout(() => {console.log(2)}, 0);
console.log(3);
Promise.resolve(4).then(b => {
console.log(b);
clearTimeout(a);
});
console.log(5);
複製代碼

問：代碼在控制檯的輸出順序是（C）

A. 1,2,3,4,5
B. 1,3,4,5
C. 1,3,5,4
D. 1,3,5,4,2
複製代碼

很明顯先執行同步任務，輸出1,3,5，排除A，B 再執行異步任務，其中異步任務分爲宏任務和微任務， 微任務的優先級高於宏任務，因此先執行Promise.resolve（4）， clearTimeout又把宏任務setTimeout清除了，因此選擇C

9.變量值

在ECMAScript中，變量能夠存放兩種值，原始值和引用值

原始值有五種基本數據類型： Null,Boolean,String,underfined,number

10.

(function() {
  var a = b = 5;
})();   
console.log(b);
console.log(a);
複製代碼

輸出結果是：（D）

A. 5    5
B.Undefined Undefined
C.5     Undefined
D.5 Uncaught ReferenceError: a is not defined
複製代碼

首先，第一個考點在於，var a = b = 5,實際上它是var a = b; b = 5; 能夠看見在變量b的前面沒有var來聲明，所以它是一個全局變量，實際上至關於在全局聲明瞭b這個變量。因此b的輸出結果爲5，排除B選項。

第二個考點，a是一個局部變量，在聲明完以後就銷燬了，固然找不到報錯了...因此D纔是正確答案