2018-2020 web front-end interview questions are organized into PDF documents , a total of 83 pages, the content mainly includes html, css, JavaScript, DOM, HTTP, Vue, etc.
2018 interview questions:
Html
1. Semantic HTML
2. Meta viewport related
3. Canvas related
CSS
1. Box model
1.1. The ie box model includes border, padding and itself (not including margin), and the standard only includes the CSS setting method of the size of its own form
1.2, several ways to obtain width and height
1.3, expand various ways to obtain width and height
1.4, the margin overlap solution (BFC) BFC principle
2. What is the difference between css reset and normalize.css
3. Centering method
3.1, in the horizontal direction
3.2, vertically centered
3.3, vertical and horizontal centering according to the above combination
4. CSS priority determination
5. How to clear float
6. Adaptive layout
7, drawing triangle
8, link @import import css
9，animation
10. Aspect ratio scheme
11, display related
JavaScript
1， [“1”, “2”, “3”].map(parseInt)
2， [[3,2,1].reduce(Math.pow), [].reduce(Math.pow)]
4， [typeof null, null instanceof Object]
5. js data type
6. Promise usage
7，es6 promise ajax
8. Closure
9. What is an immediate execution function? What is the purpose of using the immediate execution function?
10, async/await syntax
11. Dark and shallow copy
12. Array de-duplication
13. Regular implementation of trim() function
14, JS prototype
15，es6 class
16. How JS implements inheritance
17, handwritten jquery plugin
18. Array merge to remove reordering
19，call apply
20，for 中setTimeOut
21, sort function
22，navigator
23, jquery binding method
24. Event flow
25, native operation class
JUDGMENT
1, the dom event model,
2. Mobile touch events
3. Event delegation
HTTP
1. Common status codes
2. Cache
3. The difference between Cache-Control and Etag
4，Cookie sessionStorage localStorage
5. The difference between GET and POST,
6. Detailed explanation of request line, request header and request body
7. Cross-domain, JSONP, CORS, postMessage
8, osi model
9，http2.0 http1
View
1. Life cycle sequence
2. Component communication
3，Vuex
4 ， VueRouter,
5. Vue two-way binding
6，computed watch methods
algorithm
1. Various sorting implementations
2. Binary search
3. Binary tree related
Cybersecurity related
1，XSS CSRF
webpack related
1. Packing volume optimization ideas
2，Loader
3，plugins
2019 interview questions
HTTP, browser
1. What are the storage methods of the browser?
2. Can you talk about the front-end and back-end cross-domain? How to solve cross-domain?
3. Recognition of browser cookie and session.
4. What happens when you enter the URL?
5. The steps of browser rendering
6, page rendering optimization
7. Forced cache and negotiated cache
8. The difference between GET and POST requests
9. HTTP1.0 / 1.1 / 2.0 and HTTPS
10. Introduce the 304 process
11. HTTP status code
12. Web performance optimization
CSS
1. Box model
2. How to achieve the largest square
3. One line is centered horizontally, and multiple lines are left
4. Horizontal and vertical centering
5. Two-column layout, fixed on the left, adaptive on the right, without overlapping left and right
6. How to achieve the left and right equal height layout
7, drawing triangle
8, link @import import css
9, BFC understanding
JS
1. The way to determine the type of js
2. ES5 and ES6 declare variables in several ways
3. The concept of closure? Pros and cons?
4. Shallow copy and deep copy
5. Array de-duplication method
6. What are the stages of DOM events? Talk about the understanding of event agency
7, js execution mechanism, event loop
8. Introduce promise.all
9，async 和 await,
10. The difference between ES6 class and constructor
11. What are the attributes of transform, translate, and transition? The commonly used way of implementing animation in CSS,
12. Introduce rAF (requestAnimationFrame)
13, talk about the garbage collection mechanism of javascript,
14. What do you know about front-end performance optimization? Which aspects are generally optimized through?
View
1. Vue two-way binding principle,
2. Describe the process of vue from initializing the page-modifying data-refreshing the UI of the page? ,
3. How do you understand Vue's responsive system?,
4. The principle of virtual DOM implementation,
5. Since Vue can accurately detect data changes through data hijacking, why do we need a virtual DOM for diff detection differences?,
6. What does the key value do in Vue?
7. The life cycle of Vue,
8. What are the ways to communicate between Vue components?,
9. What is the difference between watch, methods and computed?
10. How to reset data in vue?,
11. What is the function of the name option in the component?
12. What hook functions does vue-router have?
13. What is the difference between route and router?
14. Talk about the understanding of Vue and React, and make a simple comparison
(1) Different implementation principles of monitoring data changes
(2) The difference in data flow
(3) The different ways of template rendering
15. What is the principle of Vue's nextTick?
(1) Why do you need nextTick
(2) Preparation before understanding the principle
(3) Understand nextTick
16. What kinds of attributes does Vuex have?
17, Vue first screen loading optimization
18. Have you learned about Vue 3.0?
19. What does vue-cli do for us?
2020 interview questions
HTML
1. What are the new features of html5?
2. Which elements have been removed in html5?
3. How to deal with the browser compatibility issue of HTML5 new tags?
4. How to distinguish between HTML and HTML5?
CSS
1. What are the CSS selectors?
2. Which properties of CSS can be inherited?
3. How to calculate the priority algorithm?
4. What are the new pseudo-classes in CSS3?
5. What are the new features of CSS3?
6. Explain the method of calculating the width and height of the box model, the collapse of the boundary, the effect of negative values, and the concept of box-sizing?
7. What is BFC (Block Formatting Context)? application?
8. How to realize the communication between multiple tabs in the browser?
9. Briefly talk about the element classification of CSS
10. Explain the floating and its working principle, the method to clear the floating?
11. Several ways to hide elements in CSS (name at least three)
12. How to center a box horizontally and vertically?
JS
1. What is the difference and usage of cookie, localStorage, and sessionStorage?
2. How to realize the communication between browser multi-tab pages?
3. What are the return types of JavaScript's typeof?
4. Type conversion
5. Array method
6. What is the difference between get and post in ajax request?
7. How to interpret the json data in an ajax request?
8. What is the difference between call and apply?
9. What is the common status code of http?
10. What performance optimization methods do you have?
11. Deep copy and shallow copy
View
1. What is MVVM?
2. What is the difference between mvvm and mvc? What is the difference between it and other frameworks (jquery)? Which scenarios are suitable?
3. What are the advantages of vue?
4. Passing value between components?
5. Jump between routes
6. How to use custom components in vue.cli? Have you encountered any problems?
7. How does vue implement on-demand loading with webpack settings
8，vuex
(1) What is vuex? how to use? Which functional scenarios use it?
(2) What kinds of attributes does vuex have?
(3) What problems will be caused by not using Vuex?
9. The similarities and differences between v-show and v-if instructions
10. How to make CSS only work in the current component
11. <keep-alive></keep-alive>What is the role?
12. What are the steps to introduce components in Vue?
13. What is the function of the command v-el?,
14. Steps to use plugins in Vue
15. Please list 3 commonly used life cycle hook functions in Vue
16. Which component attribute is active-class?
17. How to define the dynamic routing of vue-router and how to get the passed dynamic parameters?
18. What kinds of navigation hooks does vue-router have?
19. Life cycle
(1) What is the vue life cycle
(2) What is the role of vue life cycle
(3) There are several stages in the vue life cycle
(4) Which hooks will be triggered on the first page load
(5) In which cycle DOM rendering has been completed
(6) Briefly describe which scenarios each cycle is suitable for
20. Tell me at least 4 commands in vue and their usage? ,
21. What is vue-loader? What are the purposes of using it?
22. What is scss? What are the installation and use steps in vue.cli? What are the major features? ,
23. Why use key?
24. Why avoid using v-if and v-for together,
25. What is VNode? What is virtual DOM?
End: Friends who want to learn the front-end web and friends who need PDF documents can join the learning skirt here, front: 953, middle: 352, and finally: 883. There are students and big guys in the skirt, and resources are free to share. See you or leave!