
React Hooks
useState, useEffect, useContext, useRef, useCallback, useMemo, custom hooks
1useState hook ใน React คืออะไร?
useState hook ใน React คืออะไร?
คำตอบ
useState คือ React hook ที่จัดการ state ภายในของ functional component ต่างจากตัวแปร JavaScript ทั่วไปที่ถูกรีเซ็ตในทุกการ render useState จะรักษาค่า state ไว้ระหว่างการ render ที่ต่อเนื่องกัน hook นี้คืนค่าเป็น array ที่ประกอบด้วยค่า state ปัจจุบันและฟังก์ชันสำหรับอัปเดต โดยจะทริกเกอร์การ render component ใหม่โดยอัตโนมัติเมื่อ state เปลี่ยนแปลง
2syntax ที่ถูกต้องในการประกาศ state ด้วย useState คืออะไร?
syntax ที่ถูกต้องในการประกาศ state ด้วย useState คืออะไร?
คำตอบ
syntax ที่ถูกต้องใช้ array destructuring เพื่อแยกค่า state และฟังก์ชันอัปเดต ตามแบบแผน ฟังก์ชันอัปเดตจะมีคำนำหน้า 'set' ตามด้วยชื่อตัวแปร state ในรูปแบบ camelCase แบบแผนนี้ช่วยปรับปรุงความอ่านง่ายของโค้ดและได้รับการยอมรับอย่างแพร่หลายในชุมชน React ลำดับขององค์ประกอบในอาร์เรย์ที่ useState คืนค่ามาจะเหมือนกันเสมอ: ค่าปัจจุบันก่อน ฟังก์ชันอัปเดตที่สอง
3จะเกิดอะไรขึ้นเมื่อเรียกฟังก์ชันอัปเดต state?
จะเกิดอะไรขึ้นเมื่อเรียกฟังก์ชันอัปเดต state?
คำตอบ
เมื่อฟังก์ชันอัปเดต state ถูกเรียก React จะจัดกำหนดการ render component ใหม่ด้วยค่า state ใหม่ การอัปเดตไม่ได้เกิดขึ้นทันทีแต่เป็นแบบ asynchronous ซึ่งหมายความว่าค่า state จะไม่ถูกเปลี่ยนแปลงทันทีหลังจากการเรียก React จะรวมการอัปเดต state หลายรายการเพื่อเพิ่มประสิทธิภาพและหลีกเลี่ยงการ render ที่ไม่จำเป็น กลยุทธ์ batching นี้ช่วยปรับปรุงประสิทธิภาพของแอปพลิเคชันอย่างมีนัยสำคัญ
จะอัปเดต state โดยอิงจากค่าก่อนหน้าได้อย่างไร?
สามารถใช้หลาย useState ในคอมโพเนนต์เดียวกันได้ไหม?
+19 คำถามสัมภาษณ์
หัวข้อสัมภาษณ์ React / Next.js อื่นๆ
พื้นฐาน JavaScript
พื้นฐาน React
วงจรชีวิตของ component
React Router
การจัดการ state ด้วย Context
ฟอร์มและ Controlled Components
การดึงข้อมูลและ API
React Query (TanStack Query)
Styling & CSS-in-JS
พื้นฐาน Next.js
TypeScript กับ React
การดึงข้อมูล Next.js
Server Actions ของ Next.js
การกำหนดเส้นทางและการนำทางใน Next.js
API Routes ใน Next.js
Metadata & SEO ใน Next.js
Middleware และ Auth ใน Next.js
การทดสอบ React
Zustand State Management
การเพิ่มประสิทธิภาพ React
Error Boundaries & การจัดการข้อผิดพลาด
Advanced React Patterns
ฟีเจอร์ขั้นสูงของ Next.js
การ Deploy & Production ของ Next.js
Architecture & Design Patterns
React Server Components
การแปลภาษา Next.js
React ความปลอดภัย & แนวปฏิบัติที่ดีที่สุด
เชี่ยวชาญ React / Next.js สำหรับการสัมภาษณ์ครั้งถัดไป
เข้าถึงคำถามทั้งหมด flashcards แบบทดสอบเทคนิค แบบฝึกหัด code review และตัวจำลองสัมภาษณ์
เริ่มใช้ฟรี