Essential Frontend Interview Questions to Ace Your Next Job

Foreword

Here are a lot of front‑end interview questions—are you sure you don’t want to take a look?

Since you’re here, let’s dive into the collection of interview questions I have gathered from various companies.

Frontend Interview Questions

2.1 First Set of Questions

What is the output of the following code?

What is the output of the following code?

Given a string variable var content = "...大量文字" that may contain sensitive words such as ["习近平","周永康","中共","6.4"], how would you detect these words in the article and highlight them in red or change the font color?

Implement the core of jQuery’s $fn.extend function.

Design an event‑binding mechanism based on the Observer pattern.

2.2 Second Set of Questions

List possible values of display and explain their effects.

Explain the differences between relative and absolute positioning, including usage notes and origin points.

What CSS selectors exist? Which properties are inheritable? How is specificity calculated? List new pseudo‑classes introduced in CSS3.

What new features does CSS3 provide?

What does the new operator actually do?

What are the outputs of the three lines labeled a, b, c?

2.3 Third Set of Questions

Find all duplicate elements in an array (e.g., [1,2,4,4,3,3,1,5,3]) and output [1,3,4]; provide multiple methods with their time/space complexities.

Given a set of documents and a set of words, find all documents that contain every word.

2.4 Fourth Set of Questions

Local server: 172.16.2.30:8080/test/index.html; remote server: 172.16.3.30:8088/get/data. Using a GET request with empty data, what is the successful response?

Write a JavaScript snippet to fetch data from the remote server.

2.5 Fifth Set of Questions

Given an unsorted array A with no duplicates, select N numbers whose sum equals M. Provide the algorithm and its time/space complexity.

2.6 Sixth Set of Questions

Write CSS to style hyperlinks: default without underline, underline on hover.

How to solve the double‑margin bug in IE6 when float and margin are used together?

Why can’t a container be defined with a height of about 1 px?

How to center elements in Firefox?

How to comment in XHTML and CSS?

Write a shorthand CSS rule for a 1 px gray line with no top border.

2.7 Seventh Set of Questions

What will the following code output?

Implement a log method that proxies console.log.

Briefly compare Sass and Less.

Create an array of length 100 where each element equals its index, without using loops.

When a module fails, how do you locate the error and which testing tools do you use?

How to embed audio in HTML5?

What storage types does HTML5 provide and how do they differ?

List new pseudo‑classes added in CSS3.

iOS automatically treats numbers as phone numbers, breaking styles—how to prevent this?

2.8 Eighth Set of Questions

Differences between HTML and XHTML.

Which elements are inline and which are block‑level?

Explain the CSS box model.

List several CSS3 properties.

Which tags were added or removed in HTML5?

What positioning methods exist?

Implement tab switching using at least three different approaches.

When an element inside a page is clicked, alert its tag name (consider compatibility).

Find all palindromic numbers between 1 and 10 000.

2.9 Ninth Set of Questions

Differences between compiled languages and interpreted (script) languages; give two examples of each.

List at least five application‑layer network protocols.

Explain the meaning and use of a UNIX timestamp; provide code to obtain the current timestamp.

What is the purpose of version‑control tools? List the ones you know.

Differences between HTTP GET and POST, their suitable scenarios; also discuss HTTPS, SSL and their relationship.

2.10 Tenth Set of Questions

Describe two compatibility problems you have encountered in development and how you solved them.

List five methods of the JavaScript Array object.

Briefly introduce front‑end engineering.

2.11 Eleventh Set of Questions

Why is typeof bar === "object" unreliable for detecting objects, and how to avoid the issue?

What is the output of the following code snippets?

2.12 Twelfth Set of Questions

How many data types exist in JavaScript?

Which values are truthy and which are falsy in JavaScript?

Calculate the result of the given expression.

Explain the following regular expressions:

/^(0[1-9]\d\d?)?[1-9]\d{6}\d?$/

/^(1[89]|[2-9]\d|100)$/i

/^[\w-]+@[a-z0-9-]+(\.[a-z]{2,6}){1,2}$/i

Write a function to shuffle an array.

Implement getElementsByClassName (author: 李鹏).

2.13 Thirteenth Set of Questions

Describe the difference between JSON and JSONP.

When source and target resources are on the same domain, is jQuery JSONP asynchronous? What about cross‑domain?

List at least five front‑end frameworks you are proficient with.

Enumerate at least seven IE and Firefox script compatibility issues.

Provide five new HTML5 tags, explain their semantics and use cases.

What new form input types does HTML5 introduce? List at least five with usage scenarios.

What text effects were added in CSS3? Mention common properties.

How to achieve outerHTML in Firefox?

Convert CSS properties like border-left-color, margin-left, -moz-viewport to JavaScript style notation.

2.14 Fourteenth Set of Questions

Write the output of the following code snippets:

Final note: "Past memories are insufficient; the future need not be forced."

Wishing everyone a successful job transition during this peak hiring season.