面試問答
從兩隻 API 取得資料後加總印出
// 題目
con...
整個面試流程可以分成以下環節,大蓋2.5hr完成式
1. 採Pair Interview(部門主管+Team me
mber)
2. 上機考:主要考 JS 及 React 的熟悉程度
3. 針對經歷提問:主考官會按照經歷內容提問
4. 面試反饋:Team member 對剛剛的上幾考題出回饋
5. 面試者提問
面試問答
從兩隻 API 取得資料後加總印出
// 題目
const API_1 = '/api/1'; // will return { quantity: 2 }
const API_2 = '/api/2'; // will return { quantity: 3 }
// 回答
const getQuantitySum = async (urls) => {
const resultList = [API_1, API_2].map((url, index) => {
const result = await fetch(url)
return result.json()
})
const sum = resultList.reduce((a, b) => a.quantity + b.quantity, 0);
return sum
}
console.log(getQuantitySum([API_1, API_2]))
React 的 ref 和 state 的程式初始值及畫面顯示
// 1 . wallectA, wallectB, wallectC 的初始值為多少
// 2 . wallectA, wallectB, wallectC 在畫面上顯示值為何
// 點擊 button 執行 handleClick
// 1. wallectA, wallectB, wallectC 的程式值為多少
// 2. wallectA, wallectB, wallectC 在畫面上顯示值為何
import { useRef, useState } from "react"
const Test = () => {
const [wallectA, setWalletA] = useState(1);
const wallectB = useRef(0);
const wallectC = useRef(0);
const handleClick = () => {
setWalletA(prev => prev + 1);
wallectB.current + 1;
wallectC.current + 1;
}
return (
<div>
<p>wallectA:{ wallectA }</p>
<p>wallectB:{ wallectB.current }</p>
<p>wallectC:{ wallectC.current }</p>
<button onClick={handleClick}>count ++</button>
</div>
)
}
刻表單(要求使用原生)
要點 1 : 表單UX需要注意, 例如是否使用 lable 標籤
要點 2 : 表單是否需要 event.preventDefault()
面試建議
因產品需要嵌入在第三方的網站,對效能及資源有一定要求,所以見識面試者對原生Js的熟悉程度有較高掌握。