在過(guò)去的一年很多人不滿于公司沒(méi)有福利、人際關(guān)系不好相處、沒(méi)有發(fā)展前途的境遇等等，想著在開(kāi)年來(lái)?yè)Q一份工作來(lái)重新開(kāi)始自己，那么 你 準(zhǔn)備好了嗎？

下面是本人整理的一份面試材料，本想自己用的，但是新年第一天 公司突然給了我個(gè)驚喜，漲工資了?。?！

1、 viewport

延伸 提問(wèn)

怎樣處理 移動(dòng)端 1px 被 渲染成 2px 問(wèn)題

2、跨域的幾種方式

首先了解下瀏覽器的同源策略

同源策略/SOP（Same origin policy）是一種約定，由Netscape公司1995年引入瀏覽器，它是瀏覽器最核心也最基本的安全功能，如果缺少了同源策略，瀏覽器很容易受到XSS、CSRF等攻擊。所謂同源是指"協(xié)議+域名+端口"三者相同，即便兩個(gè)不同的域名指向同一個(gè)ip地址，也非同源。

那么怎樣解決跨域問(wèn)題的呢？

3、 渲染優(yōu)化

4、事件的各個(gè)階段

5、let var const

6、箭頭函數(shù)

語(yǔ)法比函數(shù)表達(dá)式更短，并且不綁定自己的this，arguments，super或 new.target。這些函數(shù)表達(dá)式最適合用于非方法函數(shù)，并且它們不能用作構(gòu)造函數(shù)。

分享之后我還是要推薦下我自己的前端學(xué)習(xí)群：657137906，不管你是小白還是大牛，小編我都挺歡迎，不定期分享干貨，包括我自己整理的一份2017最新的前端資料和零基礎(chǔ)入門(mén)教程，送給大家，歡迎初學(xué)和進(jìn)階中的小伙伴。

7、快速的讓一個(gè)數(shù)組亂序

此處解釋：（語(yǔ)言組織能力不足，請(qǐng)勿吐槽）

首先： 當(dāng)return 的值 小于 0 ，那么 a 會(huì)被排列到 b 之前； 等于 0 ， a 和 b 的相對(duì)位置不變； 大于 0 ， b 會(huì)被排列到 a 之前；這里你會(huì) 發(fā)現(xiàn)起始 的時(shí)候數(shù)組是正序排列，每當(dāng)進(jìn)行一次排列的時(shí)候， 都會(huì)先隨機(jī)一個(gè)隨機(jī)數(shù)（注意這里的每一次排列 指 每一個(gè)紅框指一次排列， 共9次排列 ， 一次排列中可能存在多次比較）；當(dāng)一次排列的 隨機(jī)數(shù)大于0.5 時(shí) 將會(huì)進(jìn)行第二次比較， 當(dāng)?shù)诙坞S機(jī)數(shù) 仍然大于0.5 時(shí) ， 將會(huì)再 進(jìn)行一次比較， 直到 隨機(jī)數(shù)大于0.5 或者排列到第一位；當(dāng)一次排列的 隨機(jī)數(shù) 小于0.5時(shí) 當(dāng)前比較的兩項(xiàng) 索引將不會(huì)改變 ，繼續(xù)下一次 的排列；

8、字體font-family

9、可能用到的meta標(biāo)簽

10、消除transition閃屏

11、android 4.x bug

1.三星 Galaxy S4中自帶瀏覽器不支持border-radius縮寫(xiě)2.同時(shí)設(shè)置border-radius和背景色的時(shí)候，背景色會(huì)溢出到圓角以外部分3.部分手機(jī)(如三星)，a鏈接支持鼠標(biāo):visited事件，也就是說(shuō)鏈接訪問(wèn)后文字變?yōu)樽仙?.android無(wú)法同時(shí)播放多音頻audio5.oppo 的border-radius 會(huì)失效

12、JS 判斷設(shè)備來(lái)源

13、audio元素和video元素在ios和andriod中無(wú)法自動(dòng)播放

14、css實(shí)現(xiàn)單行文本溢出顯示 ...

直接上效果：相對(duì)于多行文本溢出做處理， 單行要簡(jiǎn)單多，且更容易理解。

實(shí)現(xiàn)方法

overflow: hidden;

text-overflow:ellipsis;

white-space: nowrap;

當(dāng)然還需要加寬度width屬來(lái)兼容部分瀏覽。

今天就介紹這14條，有什么不對(duì)的地方還請(qǐng)多多指出來(lái)，有什么不懂的可以私信給我。下一期再見(jiàn)哦！如有需要請(qǐng)留言或者私信