文 / 西打藍 Siddharam
面試者反應與表現
應 AppWorks School 恩師之邀，來當一日的模擬前端面試官，我負責面試其中四位，每人有半小時時間，其中二十分鐘模擬面試，十分鐘回饋。
總體感覺，只有一位充滿自信，其他三位或多或少，都流露出焦慮與不自信。
某些題目，我故意出的很難，就是為了看到「不知道」答案時，他們會如何面對。是苦笑？積極？還是僵在現場？建議面試者要準備好回答不出來時的說詞。
此外，面試者還分成兩派，一派是熟悉 CSS，但 JS 不熟；另一派則反。而共通點是網路問題都不熟。
在介紹作品時，有位面試者描述的很有自信，也重點介紹作品「特點」，這讓我眼睛一亮。因為有些功能或套件，是連我也沒用過，這會讓我對專案印象深刻。
另外，我有出一則 async 考題，只有一位回答讓我滿意，因為他不是直接告訴我答案，而是正確地描述思路，讓我知道他不是猜對的。
雖然說了不少待改進的點，但大家的實力，其實都足以進入職場。進入職場後，在一點一滴把各種名詞弄懂就好。至少在我待的職場中，其疲憊程度仍低於學校，請各位放心。
面試考題
CSS：
1. 請排列以下選擇器權重：「!important」、「class」、「id」、「*」、「深度選擇器」
2. position 有哪些用法？relative、absolute 怎麼用？
3. 手機、平板、電腦的尺寸？
4. margin、padding、border 差異？
5. 偽元素和偽類有哪些？
6. 有用過 SCSS 什麼功能？
7. >>> 和 /deep/ 差別？
JS：
1. splice、slice 用法差別？還有用過哪些高階函式？
下列分別印出什麼？
const months = ['Jan', 'March', 'April', 'June']
months.splice(2, 1, 'May')
console.log(months)
const animals = ['ant', 'bison', 'camel', 'duck', 'elephant']
console.log(animals.slice(2))
2. 說明 promise 用法？好處是什麼？還有哪些 ES6 語法？
3. 知道 Async Await 嗎？
以下印出什麼？
function resolveAfter(x) {
return new Promise(resolve => {
setTimeout(() => {
resolve(x);
}, 2000);
});
}
async function add1(x) {
const a = await resolveAfter(20);
const b = await resolveAfter(30);
return x + a + b;
}
add1(10).then(v => {
console.log(v); // 幾秒後印出? v?
});
4. 有用過 WebSocket 嗎？前端使用 WebSockot，需傳給後端唯一 token 時，要怎麼做？
5. 有用過三元運算子嗎？
6. 有用過位元運算子嗎？
以下印出什麼？
console.log(9 << 2)
console.log(9 >> 2)
7. 說明一下如何使用閉包、閉包的好處？
以下印出什麼？
function buyItem() {
var myMoney = 1000;
return function (price) {
myMoney = myMoney - price;
return myMoney;
}
}
var balance = buyItem();
balance(100); // ?
balance(100); // ?
balance(100); // ?
8. 以下印出什麼？為何如此？如何解決？
console.log(0.1+0.2===0.3)
網路相關：
1. TCP / IP 是什麼？三項交握的目的是什麼？解釋一下三項交握？為什麼是三次而不是兩次、四次？當代的 SPA、非 SPA 網站，每次傳輸檔案都要建立一次 TCP / IP 連線嗎？
2. 說明 HTTP 做了什麼？
3. 知道 MVC 嗎？前端 MVC 和後端 MVC 差別？SPA 是什麼？好處與壞處？
4. 如何優化網站？請解釋 CDN。
個人：
1. 請自我介紹？
2. 介紹一下你的作品。
3. 寫程式有遇過什麼困難嗎？如何克服？
閱讀量次
聯絡與合作
訂閱電子報，領「我當前 10+ 以上收入源有哪些」一文。
有文字採訪、網站開發，或是諮詢需求，皆可至個人網站參考作品，並聯繫 IG。
或是想分享心情、聊聊天、交朋友，可以來秘密通道找我唷。
Email: frank@siddharam.com