寫在前面:還是太年輕,第一次線上筆試有些緊張了。下面是2017阿里巴巴前端實習生線上筆試總結,為大家提供參考。
一、2017題目
我遇到的題目:6個選擇其中3個多選,1個填空,6個大題。客服姐姐說題目是隨機給的(因為給了一個時段考試,而不是統一時間點開考),不過題型應該是固定的。
1.單選:一個數組,兩個引用,相互賦值,問輸出眩暈抗性-30%
2.單選:問一個return匿名函式的函式的執行結果,內部還有apply眩暈抗性再-69%
3.單選:問字串替換結果是什麼,當然,又是套了幾層,繞了幾圈眩暈抗性再-1%,嗯,做完這道給徹底繞暈了
4.多選:移動端,如果A按鈕上覆蓋了一個B按鈕,給B按鈕的touchstart事件處理器中新增什麼處理能讓A觸發click
按鈕被擋住了,要想恢復互動性,隱藏遮擋物就好了,只敢選了visible一個,因為不確定題目是不是要在本次互動中觸發click,不清楚display:none和從DOM中刪除會不會影響冒泡,沒敢選經過測試,發現本題根本不存在冒泡(好吧,當時可能沒睡醒),順便再測試了一下有冒泡的情況,發現不影響冒泡,即便remove掉了,還是會冒泡
測試程式碼如下:
5.多選:前端優化,下列哪一個可以減少HTTP請求數最近正在翻譯Yahoo!的30幾條前端優化原則,壓力不大
6.多選:題目忘記了記得除了前端優化的,其它兩道都沒有絕對把握
7.填空:個人部落格地址想了下填了cnblogs,因為個人網站做得還不完善,拿不出手
8.大題:生成10個10-100之間的隨機數,並降序排列隱約記得書上說om返回(0, 1]值
查證之後發現JS高程中文版135頁說(0, 1),而網上的普遍說法是[0, 1),後一種就和C裡面的一樣。以前看書記得js的隨機數和C的不一樣。經過測試發現書上是錯的,確實含0不含1。總結如下:
1.獲取[a, b]:d(om()*(b-a)+a)//四捨五入
2.獲取(a, b]:(om()*(b-a)+a)//向上取整(天花板)
3.獲取[a, b):r(om()*(b-a)+a)//向下取整(地板
4.獲取(a, b):好奇怪的需求,不如直接用第一種吧
測試random範圍的程式碼如下:
var x = parseInt((om()*90+10 + '')t('.')[0]);//取整數部分
9.大題:實現IOS風格的switch按鈕,要求用多種方式實現花了太多時間,“實現”是要用嘴實現還是用程式碼?用程式碼寫了個小實現,七八分鐘就過去了,划不來
10.大題:給String新增原型方法,實現簡單的模版替換考原型和正則表示式,不會在原型方法中獲取字串的值,書中說一般不要給原型加自定義屬性,會汙染環境,就沒太在意這方面,只注重了去理解原型,建構函式,作用域鏈的本質及其關係,結果。。
查了一下,發現this就是原字串的值,阿席巴思密達~~~程式碼如下:
function strcat(str){
return this + str;
}
at = strcat;
alert('xi'at(' ba'));
11.大題:如何在畫布上畫出任意多個邊界不相交的圓,考慮時間和空間的平衡後半句感覺是要寫程式碼,前半句又不像,最後沒時間了,就賣了個萌——“最簡單的方法是畫同心圓”,好吧,希望能讓改卷的大大心情愉快
12.大題:實現loadScript(url, callback)非同步載入指令碼,完成之後執行回撥函式,要求支援IE非要支援IE嗎,時間不夠了,只好寫出步驟註釋
整理的程式碼庫裡收藏了xhr,如下:
/*獲取HttpRequest物件,可以相容各個瀏覽器 包括IE5.5+*/
function getHttpObject(){
if(typeof XMLHttpRequest == "undefined"){//如果該物件未定義,則自定義該物件
XMLHttpRequest = function(){
try{
return new ActiveXObject("TTP.6.0");
}catch(e){}
try{
return new ActiveXObject("TTP.3.0");
}catch(e){}
try{
return new ActiveXObject("TTP");
}catch(e){}
try{//老版本的 Internet Explorer (IE5 和 IE6)
return new ActiveXObject("TTP");
}catch(e){}
return false;
}
}
return new XMLHttpRequest();
}
var xhr = getHttpObject();
adystatechange = function(){
if(yState === 4){
if(us >= 200 && us < 300 || us === 304){
//執行callback
}
else{
//請求失敗
}
}
}
('get', url, true);//準備非同步請求,get是為了響應速度
(null);//傳送請求,null是為了相容性
線上筆試讓人寫這種東西真的好嗎?
根據園友@李明夕和@老樓在評論中的分析,我應該是理解錯題意了,不過沒關係,程式碼如下:
白色變紅色
用script標籤動態載入(並執行)指令碼需要注意以下幾點問題:
8-支援readystatechange和async;Chrome和FF不支援readystatechange,支援load,支援async;IE9/10、Opera同時支援readystatechange,load和async
2.雖然readystatechange是HTML5事件,不過FF和Chrome至今都沒有實現它
3.詭異的是IE6先ok再向下執行再ok再ERROR,IE7/8先ERROR再向下執行再ok,IE9+未知。而FF和Chrome正常,先向下執行,再ok。
4.需要注意IE9/10和Opera兩者都支援的,所以不要用類似於ad=adystatechange=handler;的程式碼,因為在IE9/10和Opera中會觸發多次,本來onload裡面並沒有各個狀態值(都是undefined),不會觸發多次,但IE的實現很詭異,所以,有風險
5.為了避免IE中多次觸發回撥函式,應該在ok之後移除onreadystatechange事件處理器,保證只觸發一次
13.大題:實現JQuery中的html方法看時間緊迫,過於緊張了,看到題目的時候眼睛羅圈了,理解成了實現JQuery中把字串轉HTML元素的方法,過於複雜,簡單的寫了思路。交了卷才發現看錯題了。。。
JQuery中還有比html方法更容易實現的嗎?程式碼如下:
function html(elem){
return rHTML;
}
//此處沒有完全實現,因為JQ的html方法有三種形式:html(), html(str), html(fun),分別用來獲取/設定/用函式設定innerHTML
查看了JQuery內部,發現差不多就是這樣實現的,效果一樣,測試程式碼如下:
var $div = $('#div');
alert($());
alert($div[0]rHTML);
//在IE中標籤都是大寫的,其它瀏覽器中是小寫
二.是好是壞,都是一場旅行
被KO是因為自己積累不夠,比如,如果讀過JQuery原始碼,Ajax就能輕鬆拿下;如果心態平和,認真讀題,最後一題也能瞬間搞定。。。
線上筆試最大的特點是很難集中精力,網頁很容易分散你的注意力,稍微發會兒呆,幾分鐘就沒了
總結一下這次筆試的`失敗點:
1.時間安排不合理。中間的小題浪費了太多時間
2.心裡素質不夠。過於緊張,好吧,可能是因為大學聯考過去很久了,和考試不熟了
3.基本功不夠紮實。比如原型,學習的時候太偏重理論了,忽略了這樣簡單實際的問題
4.答題順序不對。先給程式碼執行結果的題目繞暈了,這種東西絕對不能先答
5.沒洗臉就開始答題了。昨晚和朋友聊到很晚才睡,自作孽。。
阿里走遠了,那我的收穫呢?
1.參加了生平第一次線上筆試
2.發現了自身知識網路的漏洞(對理論爛熟,卻不知道this就是字串的值)
3.更清楚地認識了自我,套用前輩的一句話:雖然自認為比身邊的人要強一點,但離阿里需要的實習生還是有一段距離的。。
題目難嗎?
說實話不難,除了畫圓和xhr的題目,其它的應該沒什麼難點。做的這麼差的原因有很多,不單單是沒有經驗這一條可以搪塞過去的,一句話:底子還是太薄。
後話
計劃3,4月份找實習,結束之後繼續潛心積攢經驗。考完鬱悶一會會兒就好了,怪不了別人。沒關係,Tencent我正在來~