Collect the front-end interview questions, and slowly add the answers

 

1. For example, the following similarities and differences.

line-height:15px;
line-height:150%;
line-height:1.5;
line-height:1.5em;

2, css box model

3. How to optimize page loading

4. The entire process of url->page loading is completed

5. Graceful degradation and progressive enhancement

6. What is xhtml

7. Advantages and disadvantages of ajax

8. js components

9. Explain variable declaration hoisting

10. How to access cross-domain

11. How does js judge an array

12. Explain js strict mode

13. Do you understand load balancing? explain

14. Are you familiar with the linux environment? Say some commands you've used

15. Do you understand webpack? What functions have you used

16. Do you know something about the CSS precompiler?

17. Complete overview of a project you feel is the best you’ve ever done

18. You used express in this project, can you talk about the characteristics of express?

19. Have you considered how to optimize the project? Where to start?

20. What did you learn yesterday/this week?

21. What aspects of writing code excite or interest you?

22. What technical challenges have you encountered recently? How did you solve it?

23. In the process of making a web application or website, how do you consider its UI, security, high performance, SEO, maintainability and technical factors?

24. Please talk about your preferred development environment.

25. Which version control system are you most familiar with?

26. Can you describe the workflow when you make a web page?

27. If you have 5 different stylesheets, what is the best way to integrate them into your website?

28. Can you describe the difference between progressive enhancement and graceful degradation?

29. How do you optimize the files and resources of the website?

30. How many resources can a browser download from a domain name at the same time?

31. Are there any exceptions?

32. Name three ways to reduce page load time. (Load time refers to perceived time or actual load time)

33. If you were involved in a project and found that they used Tab to indent code, but you like spaces, what would you do?

34. Please write a simple slide effect page.

35. If you were going to master a new technology this year, what would it be?

36. Please talk about your understanding of web standards and the importance of standard-setting bodies.

37. What is FOUC (flicker without style content)? How do you avoid FOUC?

38. Please explain what ARIA and screen readers are and how to make a website accessible.

39. Please explain the advantages and disadvantages of CSS animation and JavaScript animation.

40. What is Cross-Origin Resource Sharing (CORS)? What problem is it used to solve?

41、doctypeWhat is the role of (document type)?

42. What is the difference between browser standards mode, almost standards mode and quirks mode?

43. What is the difference between HTML and XHTML?

44. Is there any problem if the page uses 'application/xhtml+xml'?

45. If the web content needs to support multiple languages, what will you do?

46. ​​What issues do you have to consider when designing and developing a multilingual website?

47.  data- What are the benefits of using attributes?

48. If HTML5 is regarded as an open platform, what are its building blocks?

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

50. Please explain   the difference between <script>, <script async> and  .<script defer>

51. Why is it usually recommended to place CSS   in  <link> between  <head></head> and JS   before? Do you know what exceptions are there?<script></body>

52. What is progressive rendering?

53. What different HTML template languages ​​have you used?

54. The difference between classes and IDs in CSS.

55. What is the difference between "resetting" and "normalizing" CSS? How would you choose and why?

56. Please explain Floats and how they work.

57. z-indexHow descriptions and overlay contexts are formed.

58. Please describe BFC (Block Formatting Context) and how it works.

59. List different techniques for clearing floats and point out where they are applicable.

60. Please explain CSS sprites and how you want to implement them in your page or website.

61. What is your favorite picture replacement method and how do you choose to use it.

62. How would you address styling issues for specific browsers?

63. How to provide web pages for browsers with limited functions?

64. What technologies and processing methods will you use?

65. What are the ways to hide content (if at the same time make sure the screen reader is available)?

66. Have you used grid system? If you have used it, which one do you like best?

67. Have you used media queries, or layout/CSS for mobile?

68. Are you familiar with SVG style writing?

69. How to optimize the printing style of web pages?

70. What issues need to be considered when writing efficient CSS?

71. What are the advantages and disadvantages of using CSS preprocessors?

72. Please describe the pros and cons of CSS preprocessors you have used.

73. If a non-standard font is used in the design, how do you implement it?

74. Please explain how the browser determines whether an element matches a CSS selector?

75. Please describe pseudo-elements and their uses.

76. Please explain your understanding of the box model and how to tell the browser in CSS to use a different box model to render your layout.

77. Please explain  * { box-sizing: border-box; } the function and what are the benefits of using it?

78. Please list all the values ​​​​of the display property that you know

79. Please explain the difference between inline and inline-block?

80. Please explain the difference between relative, fixed, absolute and static elements

81. The letter 'C' in CSS means Cascading. How is the priority determined in the process of determining the style (please give an example)? How to use this system effectively?

82. What CSS frameworks have you used in development or production? How do you think they should be improved?

83. Have you tried CSS Flexbox or Grid standard specification?

84. Why is responsive design different from adaptive design?

85. Do you have the experience of compatible retina screen? If so, what technologies are used and where?

86. Why should you use  absolute positioning translate() instead  of absolute positioning , or vice versa? Why?

87. Please explain event delegation.

this 88. Please explain how it works in JavaScript  .

89. Please explain the principle of prototypal inheritance.

90. What do you think of AMD vs. CommonJS?

91. Please explain why the following code is not an IIFE (immediately called function expression): function foo(){ }();.

92. What changes should be made to make it an IIFE?

93. Describe the difference between the following variables: null, undefined or  undeclared?

94. How to detect them?

95. What is a closure, how to use it, and why should it be used?

96. Please give a typical use case of an anonymous function?

97. How do you organize your code? Should I use the module pattern, or the approach of classical inheritance?

98. Please point out the difference between JavaScript host objects and native objects?

99. Please point out the difference between the following codes: function Person(){}, var person = Person(), var person = new Person()?

100. What is the difference between .call and  .apply ?

101. Please explain  Function.prototype.bind?

102. When will you use it  document.write()?

103. Please point out the difference between browser feature detection, feature inference and browser UA string sniffing?

104. Please explain the working principle of Ajax in as much detail as possible.

105. What are the advantages and disadvantages of using Ajax?

106. Please explain how JSONP works and why it is not really Ajax.

107. Have you used the JavaScript template system?

108. If you have used it, please talk about which libraries you have used?

109. Please explain variable declaration hoisting.

110. Please describe the event bubbling mechanism.

111. What is the difference between "attribute" and "property"?

112. Why is it not a good practice to extend JavaScript built-in objects?

113. Please point out the difference between document load and document DOMContentLoaded. 114, == and  === what is the difference?

114. Please explain JavaScript's same-origin policy.

115. How to implement the following code:

[1,2,3,4,5].duplicator(); // [1,2,3,4,5,1,2,3,4,5]

116. What is a ternary expression? What does "Ternary" mean?

117. What is  "use strict"; it? What are the advantages and disadvantages of using it?

118. Please implement a  100 for loop loop that  traverses to 3 , output "fizz" when  5 divisible, output "buzz" when  divisible, and  output "fizzbuzz" when divisible 3and  divisible at the same time.5

119. Why is it usually considered that it is a better choice to keep the existing global scope of the website and not change it?

120. Why do you use  load events like this? Are there any downsides to this event? Do you know of other alternatives and why use them?

121. Please explain what a single page app is and how to make it SEO-friendly.

122. Have you used Promises and their polyfills? Please write the basic usage of Promises (ES6).

123. What are the advantages and disadvantages of using Promises instead of callbacks?

124. What are the advantages and disadvantages of using a language that can be compiled into JavaScript to write JavaScript code?

125. What tools and techniques do you use to debug JavaScript code?

126. What language constructs would you use to traverse object properties and array contents?

127. Please explain the difference between mutable and immutable objects.

128. Please give an example of an immutable object in JavaScript?

129. What are the advantages and disadvantages of immutability?

130. How to implement immutability with your own code?

131. Please explain the difference between synchronous and asynchronous functions.

132. What is an event loop?

133. What is the difference between call stack and task queue?

134. The difference between interpretation  function foo() {} and  var foo = function() {} usage

135. What are the advantages and disadvantages of testing the code?

136. What tools would you use to test your code functionality?

137. What is the difference between unit testing and functional/integration testing?

138. What is the role of the code style linting tool?

139. What tool would you use to find performance issues in your code?

140. What method would you use to enhance the page scrolling performance of your website?

141. Please explain the difference between layout, painting and compositing.

142. Why is it more effective to use multiple domain names to provide website resources traditionally?

143. Please describe as completely as possible the entire process from entering the URL to when the entire web page is loaded and displayed on the screen.

144. What is the difference between Long-Polling, Websockets and Server-Sent Event?

145. Please describe the following request and response headers:

  • Diff. between Expires, Date, Age and If-Modified-...
  • Do Not Track
  • Cache-Control
  • Transfer-Encoding
  • ETag
  • X-Frame-Options

146. What is HTTP method? Please list all the HTTP methods you know and explain.

147. Please explain the difference between HTTP status 301 and 302?

148. Question: fooWhat is the value of ?

var foo = 10 + '20 ';

149. Question: How to implement the following functions?

add(2, 5); // 7 add(2)(5); // 7

150. Question: What is the return value of the following statement?

"i'm a lasagna hog".split("").reverse().join("");

151. Question: window.fooWhat is the value of ?

( window.foo || ( window.foo = "bar" ) );

152. Question: What is the result of the following two alerts?

var foo = "Hello"; (function() { var bar = " World"; alert(foo + bar); })(); alert(foo + bar);

153. Question: foo.lengthWhat is the value of ?

var foo = [];
foo.push(1); foo.push(2);

154. Question: foo.xWhat is the value of ?

var foo = n : 1}; var bar = foo; foo. x = foo = n : 2};

155. Question: What is the output of the following code?

console.log('one'); setTimeout(function() { console.log('two'); }, 0); console.log('three');

156. What cool projects have you written about recently?

157. In the development tools you use, which aspects do you like the most?

158. Who made you step into the field of front-end development?

159. Do you have any side projects? Which type is it?

160. What is your favorite IE feature?

161. Do you have any preference for coffee?

Guess you like

Origin http://43.154.161.224:23101/article/api/json?id=325908381&siteId=291194637