Trong series này, mình sẽ liệt kê các câu hỏi về VueJs mà mình hay gặp khi đi phỏng vấn. Một phần củng cố kiến thức, giúp cho các bạn tự tin hơn khi đi phỏng vấn. Nào bắt đầu thôi !!!
Tóm Tắt
Vue JS là gì ?
VueJs là một framework dùng để xây dựng giao diện. Nó rất nhẹ, dễ học và dễ dàng tạo một ứng dụng đơn giản một cách nhanh chóng.
Directive trong vue là gì?
Directive là đoạn lệnh hay đoạn xử lý sự kiện có thể chèn vào các thẻ trong phần template của vue, có thể custom riêng hoặc sử dụng các directive có sẵn như v-if, v-show, v-modal …
Sự khác nhau giữa v-if và v-show và khi nào dùng nên dùng chúng ?
v-if: các thẻ sẽ render theo giá trị của điều kiện là true
v-show: các thẻ vẫn render dù có là true hay false đi chẳng nữa. Nhưng khác với v-if là nếu giá trị của điều kiện là false thì nó sẽ dùng css để ẩn các thẻ đó đi, cụ thể là dùng display: none để ẩn nếu v-show là false.
Nếu điều kiện thay đổi thường xuyên thì hãy sử dụng v-show, còn không thì sử dụng v-if.
Sự khác nhau giữa computed và methods ?
Computed: biết các giá trị được sử dụng trong hàm có thay đổi không, để chúng không cần phải chạy mọi lúc để kiểm tra. Tức là nếu trong hàm có bất gì giá trị nào thay đổi thì cả cái hàm đó sẽ chạy để tính toán lại. Và đặc biệt là khi sử dụng các hàm trong computed thì sẽ không có dấu ngoặc như cách dùng hàm của methods.
Methods: không thể biết các giá trị trong hàm có thay đổi hay không nên hàm sẽ không chạy lại nếu các giá trị trong hàm đó thay đổi.
Sự khác nhau giữa created và mounted ?
Created được chạy khi data, event đã thiết lập thành công nhưng các thẻ trong template và DOM ảo vẫn chưa được render ra. Nếu bạn cố gắng truy cập vào các phần tử DOM trong hàm này thì nó sẽ báo lỗi.
Nên trong created thường được sử dụng để gọi API và gán kết với các giá trị trong data.
Mounted giai đoạn này, mounted hook sẽ cho phép chúng ta có thể truy cập vào phần tử trong DOM. Tức là khi này, DOM đã được gắn kết.
Lifecycle của một component là gì và gồm những giai đoạn nào ?
Lifecycle là những phương thức được thực thi trong mỗi giai đoạn trong vòng đời của Vue.
Những giai đoạn của lifecycle bao gồm:
- Giai đoạn khởi tạo: beforeCreate(), created()
- Giai đoạn gắn kết vào DOM: beforeMounte(), mounted()
- Giai đoạn cập nhật DOM khi dữ liệu thay đổi: beforeUpdate(), updated()
- Giai đoạn hủy instance hay kết thúc vòng đời của component: beforeDestroy(), destroyed()
Sơ đồ vòng đời của một component
Đây là những câu hỏi hay gặp và trong phần tiếp theo mình sẽ đi đến các câu hỏi cụ thể hơn và đi sâu hơn để bạn có thể tự tin hơn với các trường hợp cụ thể. Chúc bạn đọc bài vui vẻ !!
