上周參加了幾家面試粱挡，總結(jié)了一些遇到值得記錄和分享的一些面試題层坠。
阿里:
跑馬燈最后一張滾回到第一張，怎樣優(yōu)化“視覺倒退”买猖？
實現(xiàn)思想：無論是幾張改橘，是否跳躍，就當做兩張切換（css:left,js:dom節(jié)點修改）多行末尾的省略號怎樣實現(xiàn)玉控？
單行實現(xiàn)方式：
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
webkit內(nèi)核實現(xiàn)方式：
overflow : hidden;
text-overflow: ellipsis;
display: -webkit-box;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
或者飞主，限制高度，超出的隱藏高诺，在末尾加上一個內(nèi)容為省略號的元素：
<div>阿斯頓快來發(fā)發(fā)發(fā)發(fā)發(fā)發(fā)發(fā)發(fā)發(fā)發(fā)發(fā)發(fā)發(fā)發(fā)發(fā)發(fā)發(fā)發(fā)發(fā)發(fā)發(fā)發(fā)發(fā)發(fā)發(fā)發(fā)</div>
<style type="text/css">
div{
width: 200px;
overflow: hidden;
text-overflow:ellipsis;
height: 36px;
line-height: 18px;
position: relative;
z-index: 11;
}
div:after{
content: "...";
display: inline-block;
position: absolute;
bottom: 0;
right: 0;
text-align: right;
z-index: 12;
background: #fff;
}
</style>
ps:阿里真是不一樣碌识，一位很有(不)個(順)性(眼)的開發(fā)直接用電腦讓我展示線上的項目相應(yīng)的問問題。
人人網(wǎng)：
display:none,visibility:hidden在渲染上的區(qū)別虱而？
1.空間占據(jù)：visibility:hidden占位不顯示筏餐；
2.回流與渲染：visibility渲染效率高；
3.繼承性:display：none會跟著父級一起消失牡拇。原生ajax都分幾步魁瞪？
1.創(chuàng)建XMLHttpRequest對象；
2.判斷是否為IE內(nèi)核惠呼；
3.發(fā)送請求导俘；
4.實行onreadystatechange()方法
5.獲得數(shù)據(jù)JQuery的ajax方法？
$.ajax(){
url:'/heihei.com/get',
data:data,
async:true,
type:"post",
dataType:'json',
success:funciton(){},
error:function(){}
}
- jQuery的事件代具體理怎么寫剔蹋？
$(selector).on("events", "dom", handler(){})
- 銀行卡號每四個加中杠旅薄？
var number = '1234567890ab';
var newNumber = number.substring(0,4) + '-' + number.substring(4,8) + '-' + number.substring(8,12);
console.log(newNumber);
- 問以下代碼的輸出結(jié)果
var tt = '你好';
function a(){
alert(tt);
var tt = '再見';
alert(tt)
}
a();
奇虎360：
- 問以下代碼的輸出結(jié)果
a();
b();
function a(){console.log('a')}
var b = function(){console.log('b')}
賦值，賦址的區(qū)別滩租？
答案隨后補充css3 新的布局方案赋秀？
column:分欄利朵；
Flex：display:flexbox;
詳細介紹，隨后將單獨開貼分享猎莲。css3 新選擇器
nth-child等transform的基準點怎么控制绍弟？比如要以div左下角為基準旋轉(zhuǎn)
transform-origin圓型怎么做？相關(guān)的兼容問題
寬高相等的塊級元素著洼，border-raidus：50%樟遣；
京東
DocmentType的作用
<!DOCTYPE html>定義文檔的類型，使得瀏覽器將其當做對應(yīng)的文檔模式解析身笤，避免怪異模式豹悬。requireJS和seajs區(qū)別璧诵？
都是用來處理js模塊加載路捧，采用的定義規(guī)范不同痛倚，requireJS采用的是AMD凸主，seajs采用的是CMD.
ps:詳細介紹可以參考另外一篇文章《淺析JS模塊規(guī)范：AMD枷莉，CMD泞莉，CommonJS》客戶端保存密碼登錄牧氮？
答案隨后補充去团，提示：sessionID問以下代碼的輸出結(jié)果
var t = true;
setTimeout(function(){ t = false; }, 1000);
while(t){ }
alert('end');
- 問以下代碼的輸出結(jié)果
var a = 10;
var ob = {
a:2,
fn:function(){
console.log(a);
console.log(this.a);
}
}
ob.fn();
var f = ob.fn;
f();
58趕集
兼容IE6轉(zhuǎn)盤（指針旋轉(zhuǎn)效果）
實現(xiàn)方法一：使用背景透明的指針圖片按時循環(huán)樣式文搂，每個樣式用background-position控制相應(yīng)的角度适刀。中獎名單的“無縫”滾動
*答案隨后補充less和Sass的區(qū)別
都是css的預(yù)編譯器。
-sass基于ruby煤蹭；
-sass用'$'定義變量笔喉，less用'@';
-性能(略)
-核心實現(xiàn)編譯的方式(略)css3 animation, jQuery animate(), css3 transition之間的區(qū)別？
*答案隨后補充浮動硝皂，相對定位常挚，絕對定位，在多個元素的文檔流中怎樣渲染吧彪，之間的影響待侵？
*答案隨后補充作用域鏈的理解
*答案隨后補充拖拽功能的實現(xiàn)思路
*答案隨后補充
其他：
- callee求斐波那契數(shù)列（兔子數(shù)列）
function power(num){
if(num < 2) {
return 1;
} else{
return power(n-1) + power(n-2);
}
}
- 問以下代碼的輸出結(jié)果
typeof true; //"boolean"
typeof Boolean(true); // ?
typeof new Boolean(true); // ?
typeof (new Boolean(true)).valueOf(); // ?
- 問以下代碼的輸出結(jié)果
var fun = function(){
var sub = function(){
return (new Boolean(true)).valueOf();
}
return sub;
}
typeof fun();
- 問渲染的樣式
<style>
.classA{ color:blue;}
.classB{ color:red;}
</style>
<body>
<p class='classB classA'> 123 </p>
</body>
</br></br>
推薦閱讀:
- 前端開發(fā)面試經(jīng), 從面試官角度分析前端面試。
- 前端開發(fā)面試題總結(jié)
