25 câu hỏi phỏng vấn lập trình viên web cần biết và câu trả lời

Các nhà phát triển web vẫn tiếp tục được săn đón khi Internet tiếp tục phát triển. Tuy nhiên, để có được công việc này, trước tiên bạn phải vượt qua buổi phỏng vấn của nhà tuyển dụng.

Mặc dù các nhóm lớn hơn có xu hướng thuê các nhà phát triển front-end hoặc back-end cụ thể, các nhóm nhỏ hơn và các công ty khởi nghiệp thường sẽ chọn các nhà phát triển full-stack. Vì vậy, việc biết càng nhiều càng tốt sẽ rất hữu ích.

Sau đây là danh sách 25 câu hỏi phỏng vấn lập trình viên web cần biết cùng câu trả lời để giúp bạn chuẩn bị.

1. Vai trò của HTML, JavaScript và CSS trong phát triển web là gì?

HTML là viết tắt của HyperText Markup Language và là ngôn ngữ chuẩn để phát triển tài liệu để xuất bản trên web. JavaScript và CSS là phần bổ sung.

JavaScript ban đầu được thiết kế như một ngôn ngữ lập trình phía máy khách, nó thực thi trong trình duyệt để tạo ra nhiều chức năng hơn trên trang web. CSS là viết tắt của Cascading Style Sheets và được sử dụng để trình bày các thành phần trên màn hình.

2. Thiết kế web đáp ứng là gì

Thiết kế web đáp ứng là phương pháp phát triển web nhằm mục đích tạo ra trải nghiệm tốt nhất cho người dùng bằng cách điều chỉnh giao diện của trang web dựa trên thiết bị hoặc môi trường của người dùng.

Mục tiêu là làm cho trang web trông đẹp trên mọi thiết bị và điều này đòi hỏi những thay đổi linh hoạt, có thể tăng hoặc giảm kích thước hộp và căn chỉnh dựa trên kích thước hoặc hướng màn hình của thiết bị.

3. Lợi ích của việc sử dụng Framework là gì?

Có nhiều lợi ích khi sử dụng một khuôn khổ trong việc phát triển một ứng dụng web. Những lợi ích chính như sau:

1. Quá trình phát triển dễ dàng hơn với các biện pháp tốt nhất.
2. Phát triển nhanh hơn với các dự án khởi đầu giúp tiết kiệm thời gian.
3. Sử dụng mã đã được thử nghiệm và kiểm tra.
4. Thường cung cấp khả năng bảo mật tốt hơn.
5. Tiết kiệm chi phí, đặc biệt là với các dự án lớn.

4. JavaScript Callback là gì?

Một hàm gọi lại JavaScript là một hàm cần được thực thi sau một hàm khác. Tên và đối số của hàm gọi lại có thể được truyền dưới dạng đối số cho hàm đầu tiên, ngoài ra, hàm đầu tiên cũng có thể truyền đối số nội bộ cho hàm gọi lại là kết quả của các phép tính của nó.

Các hàm gọi lại được sử dụng tốt nhất với các hàm bất đồng bộ phải đợi các hàm khác hoàn tất thực thi trước.

5. Giải thích phạm vi cục bộ và phạm vi toàn cục trong JavaScript

Biến được định nghĩa được viết bằng từ và chúng chỉ có ý nghĩa trong đúng ngữ cảnh. Phạm vi cục bộ và toàn cục đề cập đến ngữ cảnh của các biến được định nghĩa này. Biến toàn cục phải được định nghĩa bên ngoài hàm, trong khi biến cục bộ được định nghĩa bên trong hàm.

Do đó, một biến toàn cục có phạm vi toàn cục, nghĩa là nó có thể được truy cập từ bất kỳ đâu trong chương trình. Tuy nhiên, một biến cục bộ có phạm vi cục bộ và điều này có nghĩa là nó chỉ có thể được truy cập từ bên trong hàm.

6. Giải thích Z-Index trong CSS

Chỉ số z là thuộc tính của phần tử được sử dụng để xác định thứ tự ngăn xếp của phần tử. Thứ tự ngăn xếp đề cập đến khả năng của một phần tử ở phía sau hoặc phía trước các phần tử khác giống như một chồng thẻ.

Các phần tử có thứ tự xếp chồng cao hơn sẽ xuất hiện trước các phần tử có thứ tự xếp chồng thấp hơn. Trong ngữ cảnh này, việc cung cấp cho một phần tử thứ tự xếp chồng là 2 hoặc 100 đảm bảo rằng nó sẽ hiển thị ở trên cùng của tất cả các phần tử khác trên một trang. Tương tự như vậy, một trang không có thứ tự xếp chồng được chỉ định sẽ xếp các phần tử dưới cùng từ nguồn cao hơn các phần tử trên cùng.

7. Marquee trong HTML là gì?

Marque là một thẻ chứa trong HTML, được sử dụng để hiển thị văn bản cuộn. Nó cho phép bạn kiểm soát hướng cuộn cũng như tốc độ. Tuy nhiên, Marquee đã không còn được sử dụng trong HTML5 và bạn nên sử dụng CSS thay thế.

Ví dụ về cuộn bằng marquee:

Văn bản cuộn marquee

8. Liệt kê các cách chính để giảm thời gian tải trang

Có nhiều bước mà nhà phát triển có thể thực hiện để cải thiện thời gian tải trang, những bước chính là:

• Tối ưu hóa hình ảnh và giảm kích thước của chúng
• Loại bỏ các tiện ích không cần thiết
• Giảm thiểu việc tra cứu xuống mức tối thiểu
• Lưu trữ trang web trên một máy chủ tốt
• Sử dụng Accelerated Mobile Pages hoặc các trang web tĩnh
• Tải hình ảnh lười biếng
• Thu nhỏ mã của bạn

9. Sự khác biệt giữa Canvas và SVG là gì?

SVG là viết tắt của Scalable Vector Graphics và thẻ là phần tử chứa để tạo đồ họa, chẳng hạn như hình tròn, hình hộp, hình elip, v.v. Bạn có thể sửa đổi SVG bằng CSS hoặc JavaScript và khả năng mở rộng có nghĩa là nó hoạt động tốt cho đầu ra có độ phân giải cao.

Các Mặt khác, container dựa trên raster và không thể mở rộng. Nó cũng được sử dụng để tạo đồ họa nhưng chỉ có thể sửa đổi bằng JavaScript. Tuy nhiên, nó hiệu quả hơn khi xử lý số lượng đối tượng lớn hơn.

10. Làm thế nào Null Khác biệt với Không xác định?

Null là một biểu diễn không có giá trị. Nó thường được sử dụng như một trình giữ chỗ để khởi tạo một biến được xác định chưa được gán một giá trị thực. Ngược lại, Undefined đề cập đến một biến được xác định chưa được khởi tạo.

Trong JavaScript:

biến varA;

biến varB = null;

alert(biếnA); //hiển thị không xác định

alert(biếnB); //hiển thị null

11. ID khác với Class như thế nào?

ID và class là hai phương pháp xác định và xử lý các phần tử trong một tài liệu HTML. Tuy nhiên, sự khác biệt chính giữa hai phương pháp này là ID phải là duy nhất. Nói cách khác, hai phần tử không thể chia sẻ cùng một ID, nhưng hai hoặc nhiều phần tử có thể chia sẻ cùng một class.

ID được sử dụng để xử lý các phần tử cụ thể, trong khi lớp được sử dụng để xử lý một nhóm các phần tử có chung một hoặc nhiều đặc điểm.

12. Làm thế nào để cải thiện tính năng bảo mật của trang web?

Một số bước bạn có thể thực hiện để cải thiện tính bảo mật của trang web bao gồm:

1. Áp dụng chính sách mật khẩu mạnh. Điều này có nghĩa là kiểm tra xem mật khẩu đã chọn có hơn 8 ký tự và chứa số, ký tự đặc biệt, ký tự viết hoa và viết thường hay không.
2. Sử dụng captcha hoặc bất kỳ biện pháp chống bot nào.
3. Sử dụng các phương pháp xác thực 2 yếu tố hoặc đa yếu tố như OTP (Mật khẩu một lần) và thiết bị phần cứng nếu cần.
4. Sử dụng máy chủ có tính năng bảo vệ DDoS và sao lưu tự động.

13. Sự khác biệt giữa localStorage và sessionStorage là gì?

Cả hệ thống localStorage và sessionStorage đều cho phép nhà phát triển lưu trữ dữ liệu trong trình duyệt web. Tuy nhiên, localStorage là liên tục, trong khi sessionStorage thì không. Nói cách khác, dữ liệu được lưu trữ trong localStorage sẽ có sẵn trên trình duyệt qua nhiều phiên, trong khi dữ liệu được lưu trữ trong sessionStorage sẽ bị xóa sau khi tab trình duyệt đóng.

14. Liệt kê những cải tiến của HTTP2.0 so với HTTP 1.1

Giao thức HTTP/2 được công bố vào năm 2015 và mang lại những cải tiến đáng kể, chẳng hạn như:

1. Bảo mật tốt hơn khi sử dụng nhị phân thay vì văn bản.
2. Hiệu suất tốt hơn.
3. Độ trễ thấp hơn.
4. Xử lý lỗi tốt hơn.
5. Giảm chi phí chung.

15. Sự khác biệt giữa Git Pull và Git Merge là gì?

Lệnh git pull cho phép bạn tải xuống nội dung từ kho lưu trữ từ xa, sau đó cập nhật kho lưu trữ cục bộ của bạn bằng nội dung đã tải xuống.

Mặt khác, lệnh git merge cho phép bạn kết hợp hai nhánh được phát triển riêng biệt của cùng một dự án. Lệnh merge phải được thực hiện từ nhánh bạn muốn hợp nhất vào và đây thường là nhánh chính.

16. Sự khác nhau giữa GET, POST và PUT là gì?

Phương thức GET của HTML được trình duyệt sử dụng để yêu cầu thông tin từ máy chủ, trong khi phương thức POST và PUT được sử dụng để gửi thông tin từ trình duyệt đến máy chủ.

Nhưng trong khi yêu cầu POST chỉ có thể thêm dữ liệu vào tài nguyên máy chủ thì yêu cầu PUT được sử dụng để thay thế toàn bộ tài nguyên bằng cách sử dụng dữ liệu của yêu cầu.

17. Liệt kê các định dạng trao đổi dữ liệu phổ biến nhất

Sau đây là các định dạng trao đổi dữ liệu phổ biến nhất hiện nay:

1. XML
2. YAML
3. CSV
4. JSON
5. HTTP
6. SQL

18. Liệt kê 3 loại hộp Popup

Hộp bật lên trong JavaScript được sử dụng để hiển thị thông báo cho người dùng, yêu cầu nhập liệu và đôi khi thực hiện cả hai. Sau đây là 3 loại cửa sổ bật lên JavaScript:

1. Hộp cảnh báo – Hiển thị tin nhắn của bạn cùng với nút 'OK'.
2. Hộp xác nhận – Hộp thoại này bao gồm cả nút 'OK' và 'Hủy' có thể ảnh hưởng đến mã.
3. Hộp nhắc nhở – Hộp này bao gồm hộp nhập văn bản để thu thập thông tin từ người dùng.

19. Nêu tên các cách khác nhau để đưa mã CSS vào

Có 3 cách để đưa CSS vào tài liệu HTML. Đó là:

1. CSS bên ngoài – Bạn bao gồm một tài liệu .css bằng cách sử dụng bên trong tài liệu thẻ.
2. CSS nhúng – Bạn bao gồm mã CSS bên trong thẻ ở bất kỳ đâu trong tài liệu.
3. CSS nội tuyến – Bạn sử dụng cặp style="CSS-property: value" bên trong thẻ HTML của mình, ví dụ: Quảng trường PS!

20. Làm thế nào cửa sổ.onload Khác với document.onload?

Window.onload được sử dụng để thực thi mã JavaScript sau khi trình duyệt đã tải cây DOM của trang và các thành phần cơ bản khác, bao gồm hình ảnh, mã CSS và tập lệnh.

Trong khi document.onload được thực thi ngay sau khi DOM sẵn sàng, điều này thậm chí có thể thực thi trước khi hình ảnh và thư viện bên ngoài được tải.

21. Làm thế nào để ẩn một phần tử bằng CSS?

Bạn có thể ẩn một phần tử HTML bằng 3 phương pháp CSS, đó là:

1. Hiển thị: không có; – Phần tử không được hiển thị hoặc kết xuất.
2. Hiển thị: ẩn; – Phần tử được hiển thị nhưng không hiển thị.
3. Vị trí: Tuyệt đối; – Phần tử được hiển thị và hiển thị, nhưng được đặt bên ngoài vùng hiển thị.

22. Ajax được sử dụng tốt nhất vào mục đích gì?

Ajax là phương pháp tải dữ liệu từ máy chủ ở chế độ nền bằng JavaScript. Nó có nhiều công dụng, chẳng hạn như xác thực dữ liệu, ứng dụng trò chuyện, bình luận, lọc dữ liệu, chỉnh sửa trực quan, thăm dò ý kiến, v.v.

23. Liệt kê một số tính năng mới của CSS3

CSS3 bao gồm nhiều tính năng hiện đại và hữu ích hơn CSS2, chẳng hạn như:

1. Các góc bo tròn cho hộp và hình ảnh.
2. Hoạt hình của các đối tượng.
3. Biến và hàm để khai báo.
4. Grid & Flexbox cho thiết kế đáp ứng.
5. Chuyển màu cho màu nền.
6. Kiểm soát độ mờ đục bằng rgba.
7. Hiệu ứng đổ bóng cho hộp và văn bản.
8. Chuyển tiếp khi di chuột và tập trung vào các thành phần.

24. Những kiểu nhập liệu mới nào được giới thiệu trong HTML5?

Kiểu đầu vào là giá trị bạn cung cấp cho phần tử đầu vào trong tài liệu HTML.

Một ví dụ là:

or

Các kiểu đầu vào HTML5 mới bao gồm:

1. Ngày
2. Màu sắc
3. Email
4. Tìm kiếm
5. Điện thoại
6. tháng
7. Dãy số
8. tháng
9. URL
10. Ngày giờ cục bộ

25. Mô tả các thành phần phương tiện HTML5

HTML5 bao gồm nhiều thẻ phần tử hơn để xử lý các loại phương tiện và nguồn. Chúng là:

• – dành cho video MP4, WebM và Ogg.
• – để xác định nhiều nguồn ở các định dạng khác nhau.
• – dành cho âm thanh MP3, Ogg và WAV.
• – một thùng chứa để đưa vào các tài nguyên bên ngoài từ hình ảnh đến video và trang web.
• – để chỉ định phụ đề cho video.

Kết luận

Khi xem hết danh sách 25 câu hỏi phỏng vấn lập trình viên web cần biết, bạn có thể thấy rằng cần phải kết hợp nhiều công nghệ để trở thành một lập trình viên toàn diện.

Mặc dù đây là hướng dẫn đề cập đến các khía cạnh khác nhau của công việc, nhưng không có nghĩa là đầy đủ. Vì vậy, bạn phải xác định những lĩnh vực mà bạn không rõ và sau đó học hỏi.