阿里前端筆試總結

幾天前，去參加了阿里遊戲的前端實習生筆試。由於基礎不太紮實加上第一次沒有經驗，因此成績確定也不理想！無論怎樣都好，都已通過去了，想多了也沒用，生活，老是要向前看的嘛！因此，就花點時間把此次的題目總結一下，算是對本身的一個提升吧。 由於那天沒有用手機把筆試題目拍照下來，這些題都是憑藉印象記下來的，因此，有些題目記得可能不太準確，題目的序號可能也不同！

好吧。說了一大坨的廢話，該進入正題了：「

1.有一個長度未知的數組a，若是它的長度爲0就把數字1添加到數組裏面，不然按照先進先出的隊列規則讓第一個元素出隊。

分析：這道題主要是考覈了數組的隊列方法和棧方法。另外，原題還有字數限制的，只有在字數小於30而且結果正確時才能夠滿分。因此，咱們可使用三目運算符（： ？）來減小字數。代碼以下：

a.length === 0 ? a.push(1) : a.shift();

我當時忘記了出隊是shift仍是unshift，結果居然誤用了unshift，暈死了！

 

2.下面代碼會輸出什麼：

var test = (function(a) {
    this.a = a;
    return function(b) {
        return this.a + b;
    }
} (function(a, b) {
    return a;
}(1, 2))); 

console.log(test(4)); //輸出什麼？？？？

分析：這道題考了與函數有關的的兩個很是重要的概念：自執行函數和閉包。可是不難，答案應該是5。

 

3.請把<ul><li>第1行</li><li>第2行</li>...</ul>（ul之間有10個li元素）插入body裏面，注意：須要考慮到性能問題。

分析：這題主要考察了dom操做。插入節點操做的可使用insertBefore和appendChild方法，隨便用一個都行。可是，題目要求要考慮性能問題，這纔是關鍵，由於，JavaScript操做dom的開銷是很大的！提升性能就要減小dom操做。所以，我當時使用了下面的方法，只操做一次dom就夠的了：

var lis = "",
ul = document.createElement("ul");
 
//把li以字符串形式生成
for(var i = 1; i <= 10; i++) {
    lis += "<li>第" + i + "行</li>";
}
 
// 最後經過innerHTML插入ul裏面
ul.innerHTML = lis;
 
//這裏才操做dom，把ul插入到body
document.body.appendChild(ul);

 

4.不使用loop循環，建立一個長度爲100的數組，而且每一個元素的值等於它的下標。

分析：當時看到題目要求不使用loop循環時，「聰明過頭」的我立刻就想到了使用間歇性定時器setInterval，代碼以下：

var a = [],
    i = 0;
var interval = setInterval(function() {
    i < 100 ? a.push(i++) : clearInterval(interval);
}, 0);

確實沒有使用loop循環，我當時還對本身的聰明感到欣欣自喜呢！可是後來，跟朋友討論了一下，才知道這道題的目的是在考察咱們對數組的熟練程度，而不是考察定時器！何況用這種方法來建立數組性能也不見得有多高！他的作法是先建立一個長度爲100的數組，而後再使用數組的實例方法Array.prototype.map來從新賦值，代碼以下：

var a = new Array(100);
 
a = a.map(function(item, index) {
    return index;
});

使用了map方法真是高端大氣上檔期啊！一開始，我也覺得他的答案是正確的了，可是，後來我在控制檯打印了一下，卻發現也是不對的啊，由於，最終打出來的數組是一個長度爲100的空的數組，以下：

好奇怪！這麼好用的方法居然輸出的結果也不正確，心好累啊！

後來，查了API，才知道， JavaScript數組是稀疏數組，好比，經過new Array(100)建立一個新的數組的，雖然他的長度是100，可是實際上他是一個空數組，也就是說沒有真實存在的元素。因此使用map方法，根本不會去遍歷這個數組100次的。後來，它知乎上問了一下，才學到了一個新的可行的方法，以下：

var a = Array(100).join(",").split(",").map(function(item, index) {
　　return index;
});

這個解法充滿了曲折啊！先是建立一個數組，而後，經過join方法把它轉成字符串，而後，再經過split方法把字符串轉成數組，這時候，它就擁有100個值爲空的元素了，而後，再經過map函數，改變這些元素的值便可。

 

5.實現對數組進行亂序

這道題考察了數組的sort方法，由於是亂序，因此，還須要用到Math.random()產生隨機數，打亂排序規律！代碼以下：

var a = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10],
    sign = 1; 
a.sort(function(a, b) {
    //由於Math.random產生的數在0-1之間
    //因此0.5兩邊的機率是相等的
    //大於0.5時爲升序，小於0.5時爲降序
    sign = (Math.random() > 0.5) ? 1 : -1;
    return (a - b) * sign;
 
});

 

6.有一個長度爲100的數組，請以優雅的方式求出該數組的前10個元素之和

分析：其實，對於數組求和有不少種方法，也很簡單。可是，這題有兩個限制條件： 優雅的方式、前10個元素。對於「前10個元素」這個限制條件可使用Array.prototype.slice()方法來截取，對於"優雅的方式"，個人理解是應該儘量使用數組自帶的方法，最好可使用高階函數！因此我以爲應該是Array.prototype.reduce()方法。代碼以下：

var a = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15],
sum = 0;
 
sum = a.slice(0, 10).reduce(function(pre, current) {
　　return pre + current;
});
 
console.log(sum); //55

這樣看起開會比使用for循環優雅了很多哈！

 

 

後面的都是主觀題，答案不惟一，因此，我也不寫解答過程啦。

 

7.JavaScript實現繼承的經常使用方法有哪些？你推薦的是哪種？

提示：能夠看看《JavaScript高級程序設計》的第六章。裏面詳細的介紹了各類繼承方法。其中，值得推薦的是組合方式。ES5的Object.create()就是使用了該方式實現繼承的！

 

8.在項目開發完成以後，根據雅虎性能優化規則，須要對html，JS，CSS，圖片須要作出怎樣的處理？是否能夠藉助構建工具實現自動化？

提示：從減小http請求、減小帶寬、提升加載速度等方面進行答題便可。對於自動化，可使用gulp構建工具！

 

9.當項目的某個模塊發生問題了，你是怎麼定位錯誤的？你經常使用的調試工具是什麼？

提示：這題在考察debug的能力。能夠說說本身平時的debug方法，好比斷點調試等。調試工具，有chrome的控制檯，firebug等。

 

10.咱們在跟後端進行異步請求時，很容易陷入嵌套太深的陷阱？

提示：這道題，我不會作，後來問了傑斌，他說可使用promise,能夠參考一下什麼是promise。

http://www.javashuo.com/article/p-segzrulw-a.html

 

11.請寫個正則表達式匹配全部二級域名是9game.cn和其目錄下的網址， 好比：http://abc.9game.cn/sname/view/

若是這個很是重要的話，怎麼保護他呢？

 

12.項目測試沒問題，可是放到線上就有問題了，你是怎麼解決的？？