Preface
Vue is a library for building interactive web interfaces. Vue provides MVVM data binding and a composable component system with simple and flexible API.
React is a JAVASCRIPT library for building user interfaces. React is mainly used to build UI. React has high performance and very simple code logic. More and more people have begun to pay attention to and use it.
Vue features:
- Concise : HTML template + JSON data, and then create a Vue instance.
- Data-driven : Automatically track dependent template expressions and calculated attributes.
- Componentization : Use decoupled and reusable components to construct interfaces.
- Lightweight : ~24kb min+gzip, no dependencies.
- Fast : Accurate and effective asynchronous batch DOM updates.
- Module friendly : Install via NPM or Bower, seamlessly integrate into your workflow.
Summary of Vue interview questions
vue-cli project
- What technologies have been built for the vue-cli project, and what are their functions?
- What are the commonly used npm commands for the vue-cli project?
- Please tell us the usefulness of the folders and files in the vue-cli project
- The configuration of the project development environment and production environment of index.js under the config folder
- Could you please introduce some of the configuration in package.json in detail
Vue core knowledge points
- Understanding that Vue is a progressive framework
- What are the two cores of vue.js?
- What is the difference between v-if and v-show
- Vue commonly used modifiers
- Can v-on monitor multiple methods?
- The role of key value in vue
- vue-cli project upgrade vue version
- How to use event object in vue event?
- Use of $nextTick
- Why must data in a Vue component be a function
- Priority of v-for and v-if
- The method of sub component calling parent component in vue
- The role of keep-alive components in vue
- How to write reusable components in vue?
- What is the vue life cycle?
- What are the vue life cycle hook functions?
- How does vue monitor keystrokes in keyboard events?
- Method to trigger view update when vue updates the array
- Precautions for object change detection in vue
- Solve the problem of flashing on the initialization page of non-engineered projects
- The list generated by v-for realizes the active switch
- Use of v-model syntactic sugar components
- Custom filters in vue
- Single page applications such as vue and their advantages and disadvantages
- What are the calculated properties of vue?
- Several scaffolding templates provided by vue-cli
- How does the parent component of vue pass data to the child component?
- How to prohibit scroll bar scrolling after vue pop-up window?
- The difference between the caching of calculated attributes and method calls
- Use of custom instructions in vue-cli
vue-router
- How does vue-router respond to changes in routing parameters?
- Complete vue-router navigation analysis process
- What kinds of navigation hooks (navigation guards) does vue-router have?
- Several ways for vue-router to pass parameters
- Dynamic routing matching of vue-router
- How does vue-router define nested routing?
- Components and their properties
- Vue-router implements lazy routing of routing (dynamic loading of routing)
- Two modes of vue-router routing
- History routing mode configuration and background configuration
vuex
- What is vuex?
- Use the core concepts of vuex
- Application of vuex in vue-cli
- Use vuex in vue to modify the value of state
- Vuex actions modify the status asynchronously
http request
- What is a Promise object?
- What is the difference between axios, fetch and ajax?
- What is JS's same-origin policy and cross-domain issues?
- How to solve cross-domain issues?
- What are the characteristics of axios?
UI sample formula
- The role of the scoped attribute of the .vue component
- How to make CSS only work in the current component?
- UI component libraries commonly used in vue-cli
- How to adapt to the mobile terminal? 【Classic】
- Mobile media query
- Vue content is centered vertically and horizontally
- How vue-cli introduces pictures
- Common style problems on mobile
- Text beyond hidden
Common Functions
- How to realize the tab switching function in vue?
- Keep-alive in vue implements tab component caching
- The effect of sliding in the page from right to left in vue
- How do parent and child components call each other in vue?
- The use of vue central event bus
MVVM design pattern
- MVC, MVP and MVVM patterns
- The difference between MVC, MVP and MVVM
- The realization principle of MVVM
- Object.defineProperty()方法
- Classes and objects defined in ES6
- Document fragmentation in JS
- Destructuring assignment
- Array.from
- Array.reduce
- Recursive use
- Obj.keys()与Obj.defineProperty
- Publish-subscribe model
- Vue project optimization, shorten the loading time of the first screen
Expand in depth
- The execution process after the input of the vue development command npm run dev
- Server-side rendering of vue
- Write an npm installation package from scratch
- Loaders commonly used in vue-cli
- The features of webpack are
limited in space, and there is a need for interview materials [ click here ] to receive front-end Vue, React framework interview questions (including questions and answers)
React features:
- Declarative design : React adopts a declarative paradigm, which makes it easy to describe applications.
- Efficient : React minimizes interaction with DOM by simulating the DOM.
- Flexible : React can work well with known libraries or frameworks.
- JSX : JSX is an extension of JavaScript syntax. React development does not necessarily use JSX, but we recommend it.
- Components : Building components through React makes the code easier to reuse and can be well used in the development of large projects.
- One-way response data flow : React implements one-way response data flow, thereby reducing repetitive code, which is why it is simpler than traditional data binding.
Summary of React interview questions
basic knowledge
- Distinguish between Real DOM and Virtual DOM
- What is React?
- What are the characteristics of React?
- List some of the main advantages of React.
- What are the limitations of React?
- What is JSX?
- Do you know Virtual DOM? Explain how it works.
- Why can't the browser read JSX?
- Compared with ES5, how does React's ES6 syntax differ?
- How is React different from Angular?
React components
- You understand the phrase "In React, everything is a component".
- Explain the purpose of render() in React.
- How to embed two or more components into one component?
- What is Props?
- What is the state in React? How is it used?
- Distinguish state and props
- How to update the status of the component?
- What are arrow functions in React? how to use?
- Distinguish between stateful and stateless components.
- What are the stages of the React component life cycle?
- Explain in detail the life cycle methods of React components.
- What are events in React?
- How to create an event in React?
- What are synthetic events in React?
- What do you know about React's refs?
- List some situations where Refs should be used.
- How to modularize code in React?
- How to create a form in React
- How much do you know about controlled and uncontrolled components?
- What is a high-order component (HOC)?
- What can you do with HOC?
- What is a pure component?
- What is the importance of keys in React?
React Redux - What are the main problems of the MVC framework?
- Explain Flux
- What is Redux?
- What are the three principles that Redux follows?
- What is your understanding of "single source of truth"?
- List the components of Redux.
- How does data flow through Redux?
- How to define Action in Redux?
- Explain the role of Reducer.
- What is the meaning of Store in Redux?
- How is Redux different from Flux?
- What are the advantages of Redux?
React routing
- What is React routing?
- Why is the switch keyword used in React Router v4?
- Why do you need routing in React?
- List the advantages of React Router.
- How is React Router different from regular routing?
