©2020-2024 ioDraw All rights reserved
<> interview vue Common interview questions and written questions for front end engineers .
Interview nearly a dozen companies, summed up a set VUE Interview questions , Hope to help more people .
*
yes MVVM Understanding of
MVVM Divided into Model,View,ViewModel The three .
Model： Representative data model
View： Representative view
ViewModel： Connecting views and models , Realize the bidirectional binding of data
*
Vue The principle of data bidirectional binding
Using hijacking data publisher - The way of subscriber mode , adopt Object.defineProperty() To hijack the properties setter,getter, Publish messages to subscribers when data changes , Trigger the corresponding listening callback . When an ordinary
JavaScript Object to Vue As part of it data Option ,Vue Will traverse its properties , use Object.defineProperty Turn them into
getter/setter, Users can't see it getter/setter, But inside, they let me know Vue Tracking dependency , Notifies changes when properties are accessed and modified .
1, Implementation of a data listener Observer, It can monitor all properties of data objects , If there is any change, you can get the latest value and inform the subscriber
2, Implementation of an instruction parser Compile, Scan and parse the instructions of each element node , Replace data according to instruction template , And bind the corresponding update function
3, Implement a Watcher, As a connection Observer and Compile The bridge of , Be able to subscribe and receive notification of each property change , Execute the corresponding callback function of instruction binding , To update the view
*
yes webpack Understanding of
Front end packaging tools …
*
Understanding of front end Engineering
*
On Modularization , Understanding of componentization
*
use vue-lic Build a Vue Project for
*
yes npm Understanding of
Third party library management tools
*
ES6 What new concepts have been put forward
1.var let
2. Arrow function
3. Template string （ backquote ）
4. Destructuring assignment
5.import,export
6.class
…
*
HTTP Common status codes
400 Syntax error in client request , Not understood by the server
403 The server received the request but refused to serve |
200 Client request successful |
404 The requested resource does not exist eg: Wrong input URL |
500 An unexpected error occurred on the server |
503 The server is currently unable to process client requests , It may return to normal after a period of time
*
Common methods of array , And use
*
let ,var ,const The difference between the two
var Declared variables can be declared repeatedly , and let You can't repeat the statement
var Is not limited to the block level , and let Is it limited to the block level
var Meeting with window Phase mapping （ A property will be hung ）, and let Not with window Phase mapping
var Variables can be accessed on top of the declaration , and let There is a temporary dead zone , Accessing variables on the top of the declaration will report an error
const Must be assigned after declaration , Otherwise, it will report an error
const Defining immutable quantities , If you change, you will report an error
const and let It won't be the same with you window Phase mapping , Support for block level scopes , Accessing variables on the top of the declaration will report an error
*
Cross domain problems How to solve it
jsonp
*
How to solve the problem of browser compatibility
*
about data security Measures taken
md5, Symmetric encryption , Asymmetric encryption
*
Vue Family bucket ——vue,vue-router,vuex
*
vuex The five core attributes of
state,getter,mutations,actions,modules
*
v-show and v-if The difference between
*
Value transfer of parent-child components
The parent component passes the value to the child component ：
The first step ： In parent component v-bind:parentmsg=“ Of the parent component data value ”（parentmsg This name can be customized ）
Step two ： In subcomponents props:[‘parentmsg’]
{{parentmsg}} So you can use it The value of the parent component
The parent component passes the method to the child component ：
The first step ： In the parent component @func= Parent component method name ( Method name without ‘()’,func Customizable )
Step two ： Write in subcomponent method this.$emit(‘func’, Method parameters ) (func Customizable , Nonparametric method ‘ Method parameters ’ Don't write it )
*
The way of route jump
1.<router-link to='home'> router-link
2. router.push('/home')
*
Vue Life cycle of an instance
*
vue-router in hash Mode and history The difference between models
The most intuitive difference is in the url in hash I brought one # and history There is no such thing ;
history Back end support required ;
history Refresh or jump back after jump will report an error
*
yes ui Use of framework
element-ui,iview,ionic
*
angular and vue A comparison of
*
Original Ajax How to send a request
*
The concept of closure
Function nested function , Internal functions refer to external function variables , After external function call , Its objects should have been destroyed , But closures exist , The variable object that still gives us access to the external function , As a result, the garbage collection mechanism did not take effect , Variables are saved , Memory leak .
*
Vue How to send requests in
vue-router
*
axios How to send a request
*
Front end cache
cookie, WebStorage
*
CSS Common layout
*
You used it CSS frame
less
*
Understanding of unidirectional data flow
*
Calculation properties （computed） and watch The difference between
*
Callback function
*
Promise Three states
pending,fulfilled,rejected( up in the air , perform , refuse ), There can only be one state at a time , And once the state changes, it can't change again .promise Is a constructor ,promise Object represents an item with two possible results （ Success or failure ） The task of , It also holds multiple callbacks , When different results appear, corresponding callbacks are issued respectively .
1. initialization , state ：pending
2. When calling resolve( success ), state ：pengding=>fulfilled
3. When calling reject( fail ), state ：pending=>rejected
*
Concepts of synchronization and asynchrony
*
Get Requests and Post The difference between requests
* Get It's not safe , Because in the transmission process , The data is placed in the requested URL in ;Post All operations of are invisible to the user .
2 Get The amount of data transferred is small , This is mainly due to URL Length limit ;Post A large amount of data is transmitted , Generally, it is not limited by default .
3.Get limit Form The value of the dataset for the form must be ASCII character ; and Post Support the whole ISO10646 character set .
4. Get However, the efficiency of implementation is higher than that of control Post Good method .Get yes form Default method for submission .
*
Custom filter
*
How to use native js Bind multiple buttons to a button onclick event
*
VUE If you register global components
*
list css Selector and priority
*
Weight calculation rules
*
This paper expounds several ways of clearing floating and their advantages and disadvantages
*
sketch cookies sessionStorage and localStorage difference
*
Array de duplication
*
mvvm,mvc Principle and difference
Here are the written questions
Technology