Hanging on the front side again? Learn from experience and don’t let the interview stop!


Hanging on the front side again? Why does it always fail to examine the side of basic knowledge? Let’s sum up!

Front side (cool)

Byte side

① CSS related

  • Right fixed width 100px, left adaptive
  • CSS box model
  • Talk about absolute positioning
  • Unit em, REM, REM applicable scenario
  • Clear float
  • Realize double wing layout and Holy Grail layout

② JavaScript related

  • Asynchronous task
  • event loop
  • Script blocking, defer, async attributes;
  • data type
  • Prototype and prototype chain
  • New operator
  • Stack and heap
  • Cross domain
  • closure
  • Macro task and micro task
  • Differences and usage scenarios of anti shake throttling
  • The difference between local cache, cookie and session
  • JS floating point error
  • This point

③ Computer network related

  • Process and thread definition, thread communication mode
  • The process of entering the URL into the page display by the browser
  • DNS resolution
  • TCP connection
  • HTTP request
  • Seven layer agreement
  • HTTP status code
  • How to set forced negotiation cache and no cache?

④ Framework (Vue, react)

  • React communication
  • Vue bidirectional binding

⑤ Algorithm correlation

  • What are the sorting algorithms?
  • Handwritten quick typesetting
  • Middle order traversal
  • Version number sorting
  • Delete the ‘B’ element in a string and duplicate ‘a’ and ‘C’ elements
  • Merge ordered arrays

Baidu side

① CSS related

  • What is the difference between the three attributes of display, visibility and opacity
  • Why clear float
  • Horizontal vertical center
  • flex
  • Selector, pseudo class, pseudo element
  • BFC
  • Three column layout
  • CSS box model

② JavaScript related

  • Talk about this point
  • There are several ways to declare variables. What’s the difference
  • New is the process of creating an object
  • Why is there the difference between promise and callback
  • Principle and application of async await
  • Event capture, event bubbling, event delegation
  • Handwriting anti shake and throttling
  • Method of judging object type
  • regular expression
  • Talk about cross domain

③ Computer network related

  • Browser garbage collection mechanism
  • Browser event loop
  • Browser storage
  • CDN back to source strategy
  • Common HTTP methods
  • HTTP one-time request process
  • Browser rendering process
  • HTTP cache
  • The difference between get and post

④ Vue framework related

  • Differences between vue2 and vue3
  • Difference between Vue and react
  • Vue communication component
  • Hook function of Vue
  • Responsive principle

Jingdong side

① HTML / CSS related

  • What are the advantages of HTML tags and what are the benefits of semantics
  • Flex realizes left 200 and right adaptation
  • How to trigger BFC?
  • Element centered vertically
  • Realize three column layout
  • CSS selector type and weight

② JavaScript related

  • The difference between macro task and micro task
  • Deep copy method?
  • Asynchronous requests are encapsulated with promise
  • Homologous strategy
  • Cross domain
  • The difference between let const var
  • closure
  • Ajax synchronous or asynchronous?

③ ES6

  • Characteristics of arrow function
  • The direction of this
  • New features of ES6
  • promise
  • async await

④ Computer network related

  • Browser cache
  • What are the browser processes?
  • The difference between HTTP and HTTPS
  • HTTP status code

⑤ Vue framework related

  • Do you know vue3 and webpack
  • Vue2 data binding
  • Vue component value transmission
  • What does vuex include
  • The hook of Vue router is used to write the code
  • Component communication in Vue?
  • What is the difference between vue2 and vue3?
  • Vue lifecycle

⑥ Algorithm

  • Quick row
  • Let’s talk about diff algorithm

Reasons for interview failure

1. There is more water in the resume

There is a lot of water in the resume. It is not advisable to exaggerate the corresponding experience and ability, make up some experiences and make up facts. Experienced HR can confirm the details of your experience through multiple consecutive questions. If the candidate is asked to “make up”, the interview will be out. What should you pay attention to in your resume?

Prepare resume
Resume need not be very complicated. It is a simple resume. Its function is to enable the reader to quickly and accurately capture useful information. You can refer to the following points to modify your resume:

  • Resume layout is concise, and the number of pages should be controlled within 2 pages.
  • Resume content matches recruitment requirements
  • There must be three elements of personal information: name, telephone and email. These information is the way HR and the interviewer can contact you. If you lose the interview opportunity because you can’t get in touch with the telephone and email, it’s really a loss.
  • When writing the project experience, just introduce the key projects. You don’t need to list all the projects you have done.
  • Consider the words of understanding, familiarity and mastery. Don’t dig a hole for yourself. Finally, make sure that you can say something about each technical point you write. Don’t appear. The interviewer can only answer a technical point when he asks you.
  • It is better to use PDF for resume format to avoid format errors.

2. Lack of presentation skills or interview skills

Lack of expression skills or interview skills, and can’t show their abilities to the interviewer through communication. You should know that the interview is to let a person quickly understand and trust you in a short time. What do you trust? Just trust you to be competent for your new job. Besides being able to do, you should also be able to speak, so you should learn to communicate skillfully.

3. Basic knowledge is not solid

The lack of solid basic knowledge should be the reason why most people hang up. Therefore, we should be fully prepared before the interview, review the front-end knowledge points, lay a solid foundation, and check for omissions and fill vacancies; Summarize and review previous interview experience and draw lessons; Organize and review the front-end high-frequency interview questions.

Front end basic knowledge note sharing

The outline of basic notes includes:HTML (5), CSS (3), JavaScript, regular expression, object-oriented, JS design pattern, function, BOM, DOM, event, jQuery, AJAX, HTTP, VueWait, knowledge points.

  • Hanging on the front side again? Learn from experience and don't let the interview stop!


On the one hand, they are more basic. They can do most of the topics. Even if they can’t, they are familiar and can say a few words. But why some people can pass and others can’t, this is to check whether your basic knowledge is comprehensive and solid. Yes, but your answer must be detailed, and some questions need to give multiple answers. This requires your usual accumulation.

Finally, I would like to share with you a wave of front-end interview questions:281 page PDF document of interview Manual of front-end large factory (including answer analysis), free accessLike + private letter “interview manual”, you can also get it at the end of the text!


  • Semantic HTML
  • Canvas related
  • What is the difference between SVG and canvas?
  • What are the new features of HTML5?
  • How to deal with the browser compatibility of HTML5 new tags?
  • Talk about the title and ALT attributes
  • What are the HTML global attributes
  • ……


  • How many schemes are there to center an element horizontally and vertically?
  • Advantages of floating layout? What are the disadvantages? What are the ways to clear floating?
  • What are the problems with using display: inline block? resolvent?
  • Layout problem: div is vertically centered, left and right 10px, and the height is always half the width
  • Box model
  • How to make character layout in CSS
  • How CSS layout the Holy Grail
  • How can CSS realize the layout of double wings?
  • What is BFC?
  • Trigger condition
  • BFC rendering rules
  • ……

    Hanging on the front side again? Learn from experience and don't let the interview stop!


  • What are the JS raw data types? What are the reference data types?
  • Is null an object? Why?
  • ‘1’. Why can tostring() be called?
  • Why is 0.1 + 0.2 not equal to 0.3?
  • What is bigint? Why do you need bigint?
  • How do I create and use bigint?
  • Can typeof correctly judge the type?
  • Can instanceof judge the basic data type?
  • Can you manually implement the function of instanceof?
  • Object. What is the difference between is and = =?
  • [] == ! [] what is the result? Why?
  • What are the types of type conversion in JS?
  • ==What’s the difference between = = = and = =?
  • What process is used to convert an object to its original type?
  • How to make the if (a = = 1 & & A = = 2) condition hold?
  • What is a closure?
  • Why closures occur?
  • What are the manifestations of closures?
  • How to solve the following loop output problem?
  • What is the relationship between prototype object and constructor?
  • Can you describe the prototype chain?
  • How does JS implement inheritance?
  • Why is the arguments of the function not an array? How to convert to array?
  • Does return work in foreach? How do I break a foreach loop?
  • JS determines whether the array contains a value
  • Flat — array flattening in JS
  • What is a higher order function
  • ……

    Hanging on the front side again? Learn from experience and don't let the interview stop!

HTTP protocol

  • What is the HTTP message structure?
  • What are the HTTP request methods?
  • What’s the difference between get and post?
  • How to understand URIs?
  • How to understand HTTP status code?
  • Briefly summarize the characteristics of HTTP? What are the disadvantages of HTTP?
  • What do you know about the accept series fields?
  • How is HTTP transmitted for fixed and variable length data?
  • How does HTTP handle the transmission of large files?
  • How to handle the submission of form data in HTTP?
  • HTTP1. 1. How to solve the queue head blocking problem of HTTP?
  • What do you know about cookies?
  • How to understand HTTP proxy?
  • How to understand HTTP caching and caching proxy?
  • Why proxy caching?
  • Cache control of source server
  • Cache control of client
  • What is cross domain? How do browsers intercept responses? How to solve it?
  • Traditional RSA handshake
  • Difference between RSA and ecdhe handshake process
  • ……

    Hanging on the front side again? Learn from experience and don't let the interview stop!

TCP protocol

  • Can you tell us the difference between TCP and UDP?
  • Talk about the process of TCP three handshakes?
  • Why three times instead of two or four?
  • Can I carry data during the three handshakes?
  • Talk about the process of TCP’s four waves
  • Why four waves instead of three?
  • Talk about the relationship between semi connected queue and SYN Flood attack
  • How to deal with SYN Flood attack?
  • Introduce the fields of TCP message header
  • Talk about the principle of TCP fast opening (TFO)
  • Can you talk about the function of time stamp in TCP message?
  • How is the timeout retransmission time of TCP calculated?
  • Can you talk about TCP flow control?
  • ……


  • Talk about browser caching?
  • What about the browser’s local storage? What are their advantages and disadvantages?
  • Tell me what happened from the input URL to the page rendering? (Network)
  • Talk about your understanding of redrawing and reflow
  • Can you talk about XSS attack?
  • Why does HTTPS make data transmission more secure?
  • ……

    Hanging on the front side again? Learn from experience and don't let the interview stop!

Vue framework

  • What is MVVM?
  • What is the difference between MVVM and MVC? What is the difference between it and other frameworks (jQuery)? Which scenes are suitable?
  • Value transfer between components?
  • Vue bidirectional binding principle
  • Describe Vue the process of initializing page – modifying data – refreshing page UI?
  • Implementation principle of virtual DOM
  • What is the role of key value in Vue?
  • Life cycle of Vue
  • What are the ways of communication between Vue components?
  • How to reset data in Vue?
  • What is the function of writing the name option in the component?
  • What hook functions does Vue router have?
  • What is the difference between route and router?
  • Talk about the understanding of Vue and react and make a simple comparison
  • What is the principle of Vue’s nexttick?
  • What are the properties of vuex?
  • Vue first screen loading optimization
  • vuex
  • ……

    Hanging on the front side again? Learn from experience and don't let the interview stop!

React framework

  • Distinguish between real Dom and virtual DOM
  • What is react?
  • What is the function of react?
  • List some of the main benefits of react
  • What are the limitations of react?
  • What is JSX?
  • What do you know about virtual DOM? Explain its work
  • How is react’s ES6 syntax different from Es5?
  • How is react different from angular?
  • Explain the purpose of render() in react
  • How to embed two or more components into one component?
  • What are properties?
  • What is the status of react and how to use it?
  • Distinguish between status and props
  • How do I update the status of a component?
  • What is the arrow function in react? How to use?
  • Distinguish between stateful and stateless components
  • What are the different stages in the life cycle of react components?
  • Explain the life cycle method of react components in detail
  • What are the events in react?
  • How to create an event in react?
  • What do you know about the references in react?
  • How to modularize code in react?
  • How to create a form in react?
  • What do you know about controlled and uncontrolled components?
  • What is high order component (HOC)?
  • ……

    Hanging on the front side again? Learn from experience and don't let the interview stop!

Data structure and algorithm
(1) Linked list

  • Simple reverse linked list
  • Interval inversion
  • Flip the linked list in groups of two
  • Turn over the linked list in groups of K
  • How to detect link formation in linked list?
  • ……

(2) Stack and queue

  • Valid parentheses
  • Multidimensional array flatten
  • Ordinary hierarchical traversal
  • Zigzag hierarchical traversal of binary tree
  • Right view of binary tree
  • Complete square
  • ……

(3) Binary tree

  • Preorder traversal / inorder traversal / postorder traversal
  • Maximum depth / minimum depth
  • Symmetric binary tree
  • Nearest common ancestor of binary tree
  • Diameter of binary tree
  • ……

    Hanging on the front side again? Learn from experience and don't let the interview stop!

Front end basic knowledge notes, 281 pages of PDF document of front end big factory interview manual (including answer analysis), add Q skirt: [624369675] get it for free!