preface

The main content includes HTML, CSS, front-end foundation, front-end core, front-end advancement, mobile terminal development, computer foundation, algorithms and data structures, design patterns, projects and so on. (The data in this paper are suitable for 0-2 years)

It includes questions asked by first-tier Internet companies such as Tencent, Bytedance, Xiaomi, Ali, Didi, Meituan, 58, Pindoduo, 360, Sina, Sohu and so on, covering the primary and intermediate front-end technology points.

Listed in the article is mainly the outline part, the details can be obtained at the end of the article!

The first chapter HTML

1. What are the three layers of a browser page?

2. Advantages and disadvantages of HTML5?

3. The Doctype? How to distinguish strict mode from promiscuous mode? What do they mean?

4. What are the new features and elements removed from HTML5?

5. In which browsers have you tested your web pages, and what are their kernels?

6. There is an important thing at the beginning of every HTML file, Doctype.

7. Tell me what you know about HTML5? (What and why)

8. Understanding of WEB standards and W3C?

9. What are HTML5 inline elements, block-level elements, and empty elements?

10. What is WebGL and what are its advantages?

11. Please describe the difference between cookies, sessionStorage and localStorage.

12. Tell me your understanding of HTML semantics.

13. What is the difference between link and @import?

14. Tell me what you understand about SVG.

15. What are HTML global attributes?

16. Describe the value and function of the hyperlink target attribute.

17. Data – What does the attribute do?

18. What is your understanding of browser kernel?

19. What are common browser kernels?

20. What are the disadvantages of iframe?

21. What is the function of Label and how is it used?

22. How to implement communication between multiple tabs in the browser?

23. How to create a circular clickable area on a page?

24. What is the difference between title and H3, B and strong, I and EM?

25. Do not use the border to draw a 1px high line, will be consistent across browsers in standard mode and weird mode?

26. What do HTML5 tags do? (purpose)

27. Describe the difference between SRC and href.

28. What is your understanding of Canvas?

29.WebSocket and Message push?

30. What is the difference between MG title and Alt?

31. What are the basic components of forms and what are the main uses of forms?

32. What is the difference between Get and Post in form submission?

33. What are the new form elements in HTML5?

34. What HTML4 tags did HTML5 scrap?

35. What new apis does the HTML5 standard provide?

36. What is the difference between HTML5 storage types?

37. What is the difference between HTML5 application caching and browser caching?

38. What is the use of the HTML5 Canvas element?

39. Besides audio and video, what other media tags do HTML5 have?

40. How to embed video in HTML5?

41. How to embed audio in HTML5?

42. What are the new HTML5 document types and character sets?

The second chapter CSS

1. Explain the CSS box model?

2. Describe the types of CSS selectors and give some examples of their use.

3. What is special about CSS? (Priority, calculate special value)

4. Want to dynamically change the way content in the layer can be used?

5. Common browser compatibility problems and solutions?

6. List the values of display and say what they do.

7. How do I center a div, a floating element?

8. What is the difference between link and @import in CSS?

9. Please list how many ways (at least two ways) to clear float?

10. Block, inline and inlinke-block details comparison?

11. What is graceful degradation and progressive enhancement?

12. Talk about the problems caused by floating elements and how you solved them

13. What performance optimization methods do you have?

14. Why should CSS styles be initialized?

15. Explain float and how it works? Tips for clearing floats?

16. What types of CSS stylesheets can be classified according to the location of the web page?

17. What do you know about calibration in CSS?

18. Can you tell me the difference between EM and REM?

19. What is the use of box-sizing?

20. What is the difference between browser standard mode and weird mode?

21. What is Quirks mode and how does it differ from standard Standards mode?

22. What is your understanding of margin folding?

23. What is the difference between inline and block-level labels?

24. What are some ways to hide elements?

25. Why do I reset the default browser style? How do I reset the default browser style?

26. What is your understanding of BFC and IFC? (What it is, how it works, what it does)

27. Tell me your understanding of the use of position on a page.

28. How to solve the problem of multiple elements overlapping?

29. What are the layout methods?

30. Overflow: Hidden Does a new block-level formatting context form?

Chapter three front-end foundation

1. Talk about HTTP and HTTPS

2. TCP three-way handshake

3. Differences between TCP and UDP

4. Implementation and application of WebSocket

5.HTTP request mode, HEAD mode

6. How to achieve direct download after a picture URL access?

7. Talk about Web Quality

8. How many practical methods of BOM attribute object?

9. Talk about the HTML5 Drag API

10. Say something about HTTP2.0

11. Add the 400 and 401 and 403 status codes

12. The reason why fetch sent two requests

13.Cookie, sessionStorage, localStorage

14. Talk about Web workers

15. Understanding of HTML semantic tags

16. What is iframe? What are the disadvantages?

17. A Doctype? How to distinguish strict mode from promiscuous mode? What do they mean?

18. How does Cookie defend against XSS attacks

19. The difference between cookies and sessions

20. In a sentence

21. Talk about viewPort and mobile layout

22. Click has 300ms delay on ios, why and how to solve it?

23. The addEventListener parameters

24. Cookie sessionStorage localStorage difference

25. The cookie session

26. This section describes the status codes returned by HTTP

27. HTTP common request headers

28. Strong, negotiated cache

29.HTTP status codes say what you know

30. About 304

31. When to use strong cache or negotiated cache

32. Front-end optimization

33. Difference between GET and POST

34.301 and 302

35. How to draw a triangle

36. Status codes 304 and 200

37. Talk about browser caching

38. New elements for HTML5

39. Type a URL into the address bar, and what happens when the page displays?

40. Cookie and session, localStorage and sessionStorage

41. Common HTTP headers

42. HTTP2.0 features

43. What are the values of cache-control

44. Which two trees do browsers generate when they generate a page?

45. CSRF and XSS network attack and defense

46. What do you think of the performance of your website

47. Introduction to HTTP protocol (Features)

48. Talk about the cognition of cookies and Session. What are the limitations of cookies?

49. Describe XSS and CRSF attacks? Defense methods?

50. Do you know 304? When do I use 304?

51. Which request headers are specific to caching

52. The difference between cookies and sessions

53. What fields can be set in the cookie

54. What are the encoding methods of cookies?

Since you have seen the diagram HTTP, please answer the difference between 200 and 304

56. In addition to cookies, what other storage methods? Tell me the difference between cookie and localStorage

57. Browser input url to page rendering process

58. Are you using HTML5 and CSS3 a lot? Are you aware of their new properties? Have you ever used it in a project?

59. HTTP common request methods

60. Difference between GET and POST

61. Say the status code 302,301,304

62. Web performance optimization

63. Browser caching mechanism

64. Post is different from GET

65. Talk about the CSS box model

66. Draw a 0.5px line

67. Difference between link tag and import tag

68. Difference between Transition and animation

69. The Flex layout

70.BFC (block-level formatting context for clear float, preventing margin overlap, etc.)

71. Vertical centralization

72. The difference between JS animation and CSS3 animation

73. Talk about block elements and row elements

74. Ellipsis of text for multi-line elements

75. The visibility = hidden, opacity = 0, display: none

76. Double margin overlap problem (margin folding)

77. The position attribute

78. Float clearance

79. A range of new features

80. What are the CSS selectors and their priorities

81. How do you make an element disappear

83. How to implement CSS animation

84. How to center an image in a container?

85. How to achieve vertical centering of elements

86. Overflow handling in CSS3

87. What is the display element of float

88. A method to hide an element on a page

89. The implementation of the three-column layout, write as much as possible, floating layout, the generation order of the three divs does not affect

90. What is BFC

91. The calc properties

92. I have a Width300, a Height300, how do I center it vertically and horizontally on the screen

Display: What is the difference between table and table itself

94. What are the values of the position property and their differences

95. Positioning method of Z-index

96. The CSS box model

97. What if you want to change the font color of a DOM element without operating on it itself?

98. Are you familiar with the new properties of CSS?

99. What is the most used CSS attribute?

100. The difference between line-height and height

101. Set the background color of an element. What areas will the background color fill?

102. Do you know the priority of an attribute selector and a pseudo-class selector

103. The difference between inline-block, inline and block; Why img is inline and can set width and height

Create a coin rotation effect with CSS

105. Do you know about redraw and reorder, how to reduce redraw and reorder, and what are the ways to get documents out of the document stream

106. Draw cubes and triangles in CSS

107. The principle of overflow

108. Method of clearing float

109. The grammar and basic uses of box-sizing

110. What are some ways to make an element disappear?

111. Both nested divs and positions are absolute. The child div sets the top attribute relative to the parent element

112. Talk about the box model

113.display

114. How do I hide an element

115. Difference between display: None and Visibilty: Hidden

116. Relative and Absolute layout, position: Relative and Obsolute

117. The flex layout

118. Difference between block, inline, inline-block

119. Common selectors for CSS

120. The CSS layout

121. The CSS positioning

122. Relative positioning rules

123. Vertical center

124. What’s in the CSS preprocessor

Error in the length of get request parameters

126. Add cache differences between GET and POST requests

127. Talk about closures

128. Talk about class creation and inheritance

129. How to solve asynchronous callback hell

130. Talk about the flow of events in the front end

131. How do I bubble events first and then catch them

132. Talk about event delegation

133. Talk about lazy loading and preloading of images

134. Difference between mouseover and MouseEnter

What does the new operator of 135.js do

136. change the pointer to this inside a function (bind, apply, call)

137. The various location of js, such as clientHeight scrollHeight, offsetHeight, as well as the scrollTop, offsetTop, what is the difference between clientTop?

138.js drag function implementation

139. Asynchronous loading of JS methods

140.Ajax solves browser caching problems

141. Js throttling and anti-shake

142. Garbage collection mechanism in JS

143. What does Eval do

144. How to understand front-end modularity

145. Talk about Commonjs, AMD and CMD

146. Simple implementation of object deep cloning

147. Implement a once function, passing function arguments only once

148. Wrap native Ajax as a promise

149.js listens for object property changes

150. How do I implement a private variable that can be accessed using getName but not directly

151. The difference between == and ===, and Object.is

152. Differences between setTimeout, setInterval, and requestAnimationFrame

153. Implement a two-column contour layout

154. Implement a bind function yourself

155. Implement setInterval with setTimeout

156. Order of code execution

157. How to achieve sleep (ES5 or ES6)

158. Simply fulfill a promise

159. What is Function. Proto (getPrototypeOf)?

160. Implement deep clone of all objects in JS (wrapper object, Date object, re object)

161. Simply implement the Events module of Node

162 This in the arrow function points to an example

163. Js Determines the type

164. Array common methods

165. Array deduplication

166. What are closures for

167. Practical application of the event broker in the capture phase

168. Remove Spaces at the beginning and end of strings

169. Performance optimization

170. Can you talk about the language features of JS

171. How to determine an array

172. When you say typeof, can you add a constraint condition to reach the judgment condition

173.js implementation across domains

Js basic data type

175.js deep copy an implementation of an element

176. ES6set can be array deduplicated

177. Cross-domain principle

178. What are the rules for comparing values of different data types and how they are converted

179. Null == undefined

180. What does this point to

181. Suspended dead zone

184. There is a game called Flappy Bird, which is a Bird flying in front of endless desert, with steel pipes constantly growing up and down, and you have to avoid them. Then, Xiao Ming always gets stuck or even crashes when playing this game. Tell the reasons (3-5) and the solutions (3-5).

185. Write code that meets the following criteria:

186. What is load on Demand

187. What is the Virtual DOM

188. What is webpack for

189. Advantages and disadvantages of Ant-Design

Several ways to implement inheritance in 190.js

191. Write a function that prints 1 in the first second and 2 in the second

192. The lifecycle of a VUE

193. A brief introduction to symbol

194. What is event listening

195. Introduce promise and its underlying implementation

196. Bootstrap method for clearing floats

197. Tell us the difference between C++,Java, and JavaScript

198. Js Prototype Chain, what’s at the top of the prototype chain? What is the prototype of Object? What is the prototype of Object? The method of deleting duplicate data in array prototype chain is realized

199. What is a JS closure? What does it do, write a singleton with a closure

The use of 200. Promise + Generator + Async

201. Event delegation and bubbling principle

202. Write a function that converts an underscore name to a camel name

203. Difference and implementation of shallow copy

204. The difference between string startWith and indexof

205.js String to number method

What is block-level scope? How to implement block-level scope using ES5 method (execute function immediately)

207. Features of ES6 arrow functions

208. Execution order of setTimeout and Promise

209. Have you learned about the event model? What is the difference between DOM0 level and DOM2 level

210. How to debug JS at ordinary times

211.JS basic datatype, the difference between basic datatype and reference datatype, NaN is the abbreviation of what, JS scope type, undefined==null return result is what, undefined and null is the difference between what, write a function to determine the type of variable

212.setTimeout(fn,100); How does 100 milliseconds weigh

213.JS garbage collection mechanism

214. Write a newBind function to complete the bind function

215. How to obtain an attribute on an Object: for example, through object.key ()

216. A quick word on some of the new ES6 features

217. What do call and apply do?

218. Know about event agents and what are the benefits of doing so

219. Given the following code, what is the output? The reason?

220. Given two constructors A and B, how can A inherit from B?

221. What if you already have three promises, A, B, and C, that you want to implement sequentially?

Do you know private and public

223. Basic JS

224. How to use async and await?

225. Know the grammar of ES6 and ES7

226. Relation between promise and await/async

The data type of 227.js

228. Js loading process is blocked

229. Js object types, base object types, and reference object types

230. The implementation principle of JavaScript rotation? If you have two rounds on one page, how do you do that?

231. How to implement a calculation of how many weeks there are in a year?

232. Object-oriented inheritance

233. Objects with common reference types

234. The es6 commonly used

235.class

236. What is the difference between call and apply

237. Common es6 features

238. What is the difference between arrow functions and functions

The principle of the new operator

240.bind,apply,call

241. What is the difference between bind and apply

242. Promise

243. Deep copy of assign

244. Say promise, what if there is no promise

245.arguments

246. Arrow function gets arguments

247.Promise

248. Event broker

249.Eventloop

Space is limited, need more detailed content can beClick here toObtain the full PDF document

Chapter four front-end core

1. The disadvantage of the json

2. Cross domain (JSONP, Ajax)

3. How to achieve cross-domain

4. What is dom?

5. What are the APIS for dom

6. State returned by Ajax

7. Implement an Ajax

8. How do I implement Ajax requests? Suppose I have multiple requests and I need to execute them all at once in some order? How do I handle Ajax across domains

9. How to implement an Ajax request? What do I need to do if I want to issue two ajax in sequence?

10. What are the advantages and disadvantages of Fetch over Ajax?

11. The relationship between mobile applications and Web applications

12. Do you know PWA

13. Have you ever made a mobile terminal

14. Do you know the Touch event

Chapter 5 Advanced front end

1. Front-end testing

2. Formulation of interface documents

3. Webpack vs. GulP (modularity vs. stream)

4. The story

5. Common methods in redux

6. AngularJs differs from React

7. Vue bidirectional binding principle

Vue React AngularJS jquery

9. Node’s event methods

10. What scenarios are suitable for node features

11. You use Express. Talk about Express

12. Promise states have those

13. What are the methods for removing the first element of an array?

Chapter 6 Mobile terminal development

1. React

React Single data flow

React life cycle Indicates the life cycle of the React function and the React component

React and Vue react and Vue react

5. Component communication of reactJs

React virtual DOM 6. How does the React virtual DOM compare

7. React is used in the project. Why do you choose React and what are its benefits

8. How do I get the real DOM

9. React

React lifecycle functions

11. The process after setState

React High-order components know?

13.React lifecycle

14. Tell me what you understand about React

15. What does the React component use to determine whether to refresh

Chapter 7 Computer fundamentals

1. Three-way handshake for TCP connection establishment

2. The principle of CDN

3. What the HTTP header contains. Common request methods (options, head, connect)

4. Request method head feature

5. What is the difference between the HTTP status code 301 and 302, 200 and 304

6.OSI seven-layer model

7. The difference between TCP and UDP, why three times shake hands and four times wave

8.HTTP caching mechanism

9. What is the difference between Websocket and Ajax? What are the application scenarios of Websocket

10.TCP/IP network model

11. Do you know what cross-domain mode is, what is the specific process of JSONP, how to achieve native JSONP encapsulation and optimization, and how to judge whether CORS should cross domain

12. How to generate tokens and how to pass them

13. Differences between operating system processes and threads

14. What is process thread

15. Those resources of the thread are shared and those resources are not shared

16. The difference between process and thread in operating system

17.Linux process query command, query port, kill process

18. What are the communication methods between processes?

19. Redis and mysql

Space is limited, need more detailed content can beClick here toObtain the full PDF document

Chapter 8 Algorithms and data structures

1. Binary tree sequence traversal

2. The characteristics of B tree and the difference between B tree and B+ tree

3. The tail recursion

4. How to write a large factorial? What’s wrong with the recursive approach?

5. A way to turn a multidimensional array into a one-dimensional array

6. Know the sorting algorithm to say the principle of bubbling fast platoon

7. How does Heap sort work? Complexity?

8. Several common sorting algorithms, handwritten

9. Array deduplication, write as many methods as possible

10. If I have a large array of integers, how do I find the largest 10 digits

11. Know the common data structures in data structures

12. Find out how many occurrences of the KTH largest array in the array, such as array [1,2, 4, 4, 3, 5] the second largest number is 4, which occurs twice, so return 2

Merge two ordered arrays

14. Given a number, find the bit of that number in an sorted array (by quick lookup, binary lookup)……