<> 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

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


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


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


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


axios How to send a request

Front end cache

cookie, WebStorage

CSS Common layout

You used it CSS frame


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

©2020 ioDraw All rights reserved
Java exercises 1: Simply define a car class New photo album app launched by Microsoft : Using cross platform framework React Native to write Chapter two Fundamentals of programming Programming exercises pandas Time order of webpack Code segmentation import()Vue slot slot: Default slot , Named slot , Scope slot Fundamentals of data analysis ——R language ( Processing missing values )C++ Implementation of matrix meteor shower effect PostMan Advanced Usage , Interface MD5+Secret autograph Sign The 12th Blue Bridge Cup B group C/C++ Provincial competition