
การจัดการ state ด้วย Context
Context API, createContext, useContext, Provider pattern, context composition, performance
1Context API ใน React คืออะไร?
Context API ใน React คืออะไร?
คำตอบ
Context API เป็นกลไกที่ฝังอยู่ใน React ซึ่งอนุญาตให้แชร์ข้อมูลระหว่างคอมโพเนนต์โดยไม่ต้องส่ง props อย่างชัดเจนผ่านทุกระดับ แก้ปัญหา prop drilling โดยการสร้าง state ทั่วโลกที่คอมโพเนนต์ลูกหลานทั้งหมดสามารถเข้าถึงได้ Context เหมาะสำหรับข้อมูลที่เปลี่ยนแปลงไม่บ่อย เช่น theme, ภาษา หรือข้อมูลผู้ใช้ที่ตรวจสอบสิทธิ์แล้ว
2ฟังก์ชันใดใช้สร้าง Context ใหม่?
ฟังก์ชันใดใช้สร้าง Context ใหม่?
คำตอบ
ฟังก์ชัน createContext เป็นวิธีการดั้งเดิมของ React สำหรับเริ่มต้น context ใหม่ รับค่าเริ่มต้นที่เป็นทางเลือก ซึ่งจะถูกใช้หากคอมโพเนนต์ใช้ Context โดยไม่มี Provider ต้น ฟังก์ชันนี้คืนค่าออบเจกต์ที่มี Provider และ Consumer แม้ว่า Consumer จะไม่ค่อยถูกใช้กับ hooks สมัยใหม่
3hook ใดที่ใช้สำหรับการใช้ค่าของ Context?
hook ใดที่ใช้สำหรับการใช้ค่าของ Context?
คำตอบ
hook useContext อนุญาตให้คอมโพเนนต์ลูกอ่านค่าที่ Provider ที่ใกล้ที่สุดในต้นไม้คอมโพเนนต์ให้มา แทนที่ Consumer API เก่าและเสนอไวยากรณ์ที่กระชับและอ่านง่ายกว่า คอมโพเนนต์จะสมัครรับการเปลี่ยนแปลง Context อีกครั้งโดยอัตโนมัติและอัปเดตตามนั้น
คอมโพเนนต์ใดที่ใช้สำหรับจัดเตรียมค่าให้กับ Context?
จะเกิดอะไรขึ้นถ้าคอมโพเนนต์ใช้ useContext โดยไม่มี Provider ต้น?
+15 คำถามสัมภาษณ์
หัวข้อสัมภาษณ์ React / Next.js อื่นๆ
พื้นฐาน JavaScript
พื้นฐาน React
React Hooks
วงจรชีวิตของ component
React Router
ฟอร์มและ 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 และตัวจำลองสัมภาษณ์
เริ่มใช้ฟรี