W17_直播檢討


Posted by Christy on 2022-02-02

Q1: 關於理解 this 的小撇步:「把所有的 function call,都轉成利用 cal l的形式來看」。,文章的留言講到這單純是一種記憶方式,如果面試被問為什麼可以這樣轉換的話,應該怎麼回答比較好呢?或是其實底層確實是這樣轉換的嗎?謝謝老師

A1: 記憶方式或是底層這兩個說法都說得通,用規格面的方式理解,分成四種:

a. hello() => 非嚴格模式 global(window),嚴格模式 undefined

b. obj.test.hello() => obj.test

c. call, apply, bind

d. arrow function

如果覺得面試有問題的話,可以不要回答「這是一種記憶方式」,如果被問為什麼,就回答「這是規格上寫的,裡面的 this 就是這樣定義的。」

Q2: 如果想研究別人放在 github 的專案,老師會怎麼做,有什麼步驟嗎?會 clone 下來跑跑看嗎?例如 express session 的套件:https://github.com/expressjs/session (edited)

A2: 不會 clone 下來,會看一下基本用法 -> 看範例 -> 看 package.json -> 看 index.js

要帶有目的性地去看,這樣會比較簡單,不然會迷路,比較少「想要整個看懂的情況」

Q3: 這個 repo 的註解 / @params / 是自動產生 API 文件的套件的語法嗎?還是只是某種大家公定的格式?因為不是第一次看到別人這樣寫了,有點好奇。 (edited)

A3: 用這樣的寫法,加上 jsdoc @use JSDoc 可以自動產生一份 API 文件,大家都用同一套,是一種約定俗成的寫法。

Q4: https://codesandbox.io/s/mm6ww11lk8?file=/src/index.js ,老師這個結果正常應該 Dan, Yuzhi, Dominic,可是我測試有時是 Dan, Dominic, Yuzhi,不知道為什麼是否跟瀏覽器有關係??我是用 safari 的

A4: 老師找了一下「safari setTimeOut bug」,看來應該是一個 bug,有時候會發生,有時候不會;不過老師還沒找到為什麼。

Q5: const db = require("./models") const blog = db.blog -> 為什麼 Sequelize 必須這樣引入 model,用 const blogDb = require("./models/blog") 這樣引入卻不行?

A5: 思考方向是「為什麼覺得第二種是可以的」

第一個是:
在 models/index.js 拿到一個物件
用了物件裡面的 blog

第二個是:
從 models/blog.js 拿到了某個東西

寫成這樣是可以的:

const blogDb = require("./models").blog

Q6: 請問這次部署到 heroku 上面,不用做 webpack 打包以及不用把 node_modules 這個資料夾 push 到遠端,前者是因為 express 這個框架已經幫我們做好 webpack 了? 後者是因為 heroku 會自己幫我們安裝套件,所以不用把 node_modules 一起推上去?

A6: 前者:為什麼要做 webpack 打包,沒有什麼必要打包,不是要部署就要用 webpack 打包喔,跟 webpack 沒有什麼關係~

後者:對,沒錯,Heroku 會自己幫我們安裝套件。

Q7: 看大家都額外引入 body-parser 來解析資料,不過 express 也有內建 express.json() 等等 API,想問老師這兩者差別在哪

A7: 早期的時候是合在一起,後來分開的,現在又合併回來,感覺好像是分分合合的功能。底層還是 body-parser 實作,如果想知道,可以看 source code,在新版的 body-parser 有自動幫你寫好,所以用 express.json() 其實就是在用 body-parser,因此新版來說,就用 express.json() 就好。

比較舊的版本沒有提供。

Q8: 老師 vercel 或 netlify 這類的程式跟 heroku 差在哪裡,都同樣可以部署網站也同樣簡單快速

A8: heroku 推的是 server side 的扣,真的可以幫你跑一個 server 出來,後端就要用 Heroku;netlify 最後出來的東西是靜態檔案,比較像 GitHub Page,是給前端用的,不能部署 node.js 的那些扣,不過可以連接資料庫;vercel 應該是兩個都可以

Q9: 想問 W18,一般會同時使用 apache2 / nginx 在同一台虛擬主機嗎? 甚麼情況才會這樣做? (edited)

A9: 一般兩者擇一,有可能會因為歷史包袱這樣做,以前已經有一台機器了,後來再加一台新的,就不用改舊的扣,不過一般來說不太會。

Q10: 老師知道 POPCAT 嗎?今天想試試看在迴圈裡面跑 document.querySelector('#app').click(); ,用 JS 自動點擊畫面,但是卻沒辦法成功,是因為網站有做什麼防作弊機制嗎?https://popcat.click/

A10: 可以去看 source code,看他有寫什麼東西

Q11: 想問老師,arrow function 的好處是什麼,相對於一般宣告方式。this 是好處還是壞處?如果看到 const AA = () => {} 當中沒有用到 this ,因為看的不是很習慣,可以自己通通改成原始的 function AA() {} 的形式嗎?

A11: 簡潔很多,一目瞭然,跟 this 沒有相對關係。如果看不習慣可以用原來的。

Q12: 什麼時候會 clone or fork?

A12: clone 是想要在本地跑跑看會 clone,fork 是拿來做備份,或者要送 PR 才會 fork。

Q13: 想問老師在多人協作或是自己作業中程式碼的註解撰寫有什麼需要特別注意的嗎?註解應該怎麼寫才算是對於程式碼有加分作用的呢?

A13: 老師近期的想法是「解釋程式碼看不到的部分」。在老師新手時期,會寫「把程式碼翻成中文」,但有些人會覺得這樣不好,因為看程式碼就看得出來。自己的專案怎麼寫都可以,跟別人合作只要討論後統一風格就可以。

寫「為什麼要這樣做」,會是一個比較好的解釋。

Q14: 老師請問 104 面試徵資深前端工程師但是不要求經歷,請問這種職缺可以去面嗎?

A14: 建議是不要啦。

Q15: 請問後端作業跟得比較吃力會影響之後面試嗎...

A15: 基本上不會,後端做得好,對面試有加分,沒有做不扣分。

Q16: 看之前學長姐面試有被問到演算法,但演算法好像只有出現在挑戰題裡面,需要自己找時間研究嗎?

A16: 應該是一些很基本,需要內化的基礎,不太像是演算法啦,純粹就是在考你抽象思考的能力。除非是要學過才寫得出來的演算法,例如泡泡排序這種。

也有可能去看演算法跟資料結構,再回頭來看基本題目,也許都會懂了,也有可能。

Q17: 去哪裡找技術文章?

A17: 臉書社團,或訂閱星巴哥技術週刊。


再次強調,W17、W18 不是必要的,但是建議 W17 可以看一下,知道這些蠻不錯的,W18 需要花很多時間,如果時間不夠可以跳過。

想走後端的話,W21 以後都可以不用學,比之前的挑戰題弄的更熟,然後來去找老師,會告訴你要學哪些東西。


老師說了一個笑話 [耍冷] 荒島求生... 但是我聽不懂,估狗居然找的到那個笑話,然後還是看不懂...嗚嗚。

不過搜尋「吃蘿蔔乾 意思」,就有解釋了,恩...










Related Posts

覺得 JavaScript function 很有趣的我是不是很奇怪

覺得 JavaScript function 很有趣的我是不是很奇怪

從實際案例看 class 與 function component 的差異

從實際案例看 class 與 function component 的差異

響應式RWD實作練習

響應式RWD實作練習


Comments