preface

People all say that the front end needs to come out regularly for an interview every year to measure their current technical level and value. I graduated in July of 2017 and have not tried it until now, nor do I want to change my job, so I come out to try and see what my level is like.

The following is some of my on-site interview answers, some of the questions vary from person to person I will not answer, the answers are for reference answers, there are some wrong places or bad places, there are better answers can comment in the comments section.

The original address

Baidu WEB front-end engineer for five consecutive 3 hours

One side

Finish the paper first

  1. Implements a function to determine whether the input is a palindrome string.
function run(input) {
  if (typeofinput ! = ='string') return false;
  return input.split(' ').reverse().join(' ') === input;
}
Copy the code
  1. Two or more ways to achieve vertical horizontal center of known or unknown width.

/ / 1
.wrapper {
  position: relative;
  .box {
    position: absolute;
    top: 50%;
    left: 50%;
    width: 100px;
    height: 100px;
    margin: -50px 0 0 -50px; }}/ / 2
.wrapper {
  position: relative;
  .box {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%); }}/ / 3
.wrapper {
  .box {
    display: flex;
    justify-content:center;
    align-items: center;
    height: 100px; }}/ / 4
.wrapper {
  display: table;
  .box {
    display: table-cell;
    vertical-align: middle; }}Copy the code
  1. To achieve the effect, click the icon inside the container, the border of the icon becomes border 1px solid red, click the blank to reset.
const box = document.getElementById('box');
function isIcon(target) {
  return target.className.includes('icon');
}

box.onclick = function(e) {
  e.stopPropagation();
  const target = e.target;
  if (isIcon(target)) {
    target.style.border = '1px solid red'; }}const doc = document;
doc.onclick = function(e) {
  const children = box.children;
  for(let i; i < children.length; i++) {
    if (isIcon(children[i])) {
      children[i].style.border = 'none'; }}}Copy the code
  1. Please simply implement bidirectional data binding MVVM.
<input id="input"/>
Copy the code
const data = {};
const input = document.getElementById('input');
Object.defineProperty(data, 'text', {
  set(value) {
    input.value = value;
    this.value = value; }}); input.onchange =function(e) {
  data.text = e.target.value;
}
Copy the code
  1. SetItem (key,value) and getItem(key)
var instance = null;
class Storage {
  static getInstance() {
    if(! instance) { instance =new Storage();
    }
    return instance;
  }
  setItem = (key, value) = > localStorage.setItem(key, value),
  getItem = key= > localStorage.getItem(key)
}
Copy the code

Q1 Your technology stack is mainly react. What’s the problem with React?

1, JSX do expression judgment, need to be strong Boolean type, such as:

render() {
  const b = 0;
  return <div>{!!!!! b &&<div>This is a text</div>
    }
  </div>
}
Copy the code

If not used!! B will force the data type and print 0 in the page.

2, Try not to use setState in componentWillReviceProps, if you must use setState, then you need to determine the end condition, otherwise there will be infinite heavy rendering, resulting in page crash. Componentwill Props will render indefinitely, componentDidUpdate

When adding refs to components, try not to use anonymous functions, because when the components are updated, anonymous functions will be treated as new prop. When the ref property receives the new function, react will empty the ref properties first, which means that the ref props will be executed with null as the callback parameter. The ref is then executed on the instance of the component, so when using anonymous functions to do ref, sometimes the attribute after the ref assignment will be null. see

4. Do not pass index as component key when traversing child nodes.

Q2 I now have a button that I want to bind to the react button. How do I do this?

class Demo {
  render() {
    return <button onClick={(e)= >{alert(' I clicked the button ')}}> button</button>}}Copy the code

Q3 followed up with a question. Do you think there will be any problems with setting click events like this?

Since onClick uses an anonymous function, the onClick is treated as a new prop every time it is rerendered, reassigning the internal cached onClick event, so there may be a slight performance degradation (in my view) compared to using the function directly.

Modify the

class Demo {

  onClick = (e) = > {
    alert('I clicked the button.')
  }

  render() {
    return <button onClick={this.onClick}>button</button>}}Copy the code

Of course, you’re not declaring the arrow function internally, but then you might need to use the bind context when setting onClick. This will have the same effect as using the anonymous function previously, because Bind will return the new function and react will also consider it a new prop.

Q4 Tell me about event Loop

First of all, JS is single-threaded, the main task is to deal with user interaction, and user interaction is nothing more than to respond to DOM increase, delete and change, using the form of event queue, an event cycle only one event response, making the script execution relatively continuous, so there is an event queue, used to store the event to be executed. So where does the event queue event get pushed in. That’s another thread thread called trigger events do, his main role is in timing trigger threads, thread asynchronous HTTP requests to satisfy certain conditions, the callback function is a push to the event queue, waiting for the js engine idle time to execute, js engine, of course, have priority in the implementation process, first js engine in an event loop, The main task of js thread will be executed first, and then it will look up whether there is microtask (promise). If there is, the microtask will be executed first; if not, it will look up macroTask (setTimeout, setInterval) for execution.

Q5 Talk about the flow of events

There are two types of event flow, capture event flow and bubbling event flow.

The capture event flow starts at the root node and continues to search for execution on child nodes until the search execution reaches the target node.

The flow of bubbling events starts at the target node and bubbles up to the parent node for execution until it reaches the root node.

The DOM event flow is divided into three phases, one is capturing node, one is in target node, and one is bubbling.

Q6 I now have a progress bar, there is a string of text in the middle of the progress bar, when my progress bar covers the text, the text and progress bar color reversal, how to achieve?

. At that time, I gave the JS scheme. When the width of the progress bar changes, calculate to cover 50% of each text. If so, set the text to the opposite color.

Of course, CSS also has a corresponding solution, which is mix-blending-mode, which I haven’t touched.

There is also a corresponding scheme for HTML, that is, two DOM structures with the same position but opposite colors are set to overlap together. The top layer covers the bottom layer, and the progress bar on the top layer takes overflow as hidden and its width as progress.

Second interview

Q1 Why did you leave your last company?

Q2 What do you think is the ideal front-end position?

Q3 So you are aware of the problem and have you tried to solve it?

On three sides

Q1 Tell me about an overall development process in your last company

Q2 React virtual DOM implementation

React uses JS to implement a set of DOM structures. Before each operation with the real DOM, the implemented DIff algorithm is used to compare the virtual DOM and recursively find the DOM nodes with changes. It is then updated. In order to realize the virtual DOM, we need to put each node type abstract as an object, each node type has its own attributes, namely prop, every time for the diff, react will first compare the node type, if the node type is different, so the react directly to delete the node, and then directly to create a new node is inserted into the among them, React determines whether a prop has been updated if the node type is the same. React determines whether a prop has been updated if the node type is different. React re-renders the node and compares its children layer by layer until there are no children.

Q3 React: How are sibling nodes handled during rendering? That’s when the key is different.

ReactNode is an array with a map and then a ReactNode is returned. To facilitate optimization within React, we must add a key to each ReactNode. The key prop is not intended for developers, but for React. React updates only the properties of the reactNode if the key is the same or if the component properties change. If the key is different, react destroys the component and then recreates it.

Q4 I now have an array [1,2,3,4], please implement the algorithm to get the full array of this array, such as [2,1,3,4], [2,1,4,3]… What is the time complexity of your algorithm

I didn’t write this out, but I gave you a general idea: remove each array and find its full permutation, and then find the full permutation between the results, and then connect the final results…

For those of you who are interested, see the full array

Q5 I now have a backpack with a capacity of M, and then N goods with weights of W1, W2, W3… Wn, the value of each cargo is V1, V2, V3… Vn, W and V have nothing to do with each other, asking for the maximum value that the backpack can hold.

I did not write this out, but also gave an idea: firstly, use the method of Q4 to get the whole combination of the cargo weight array (including the whole combination divided into small arrays), and then calculate the value of each combination, and sort, and then go through the number group, find the combination with high value just fit into the backpack M.

This question dynamic planning interview questions, interested students please baidu or Google.

All around

Q1 Please tell me about the r&d release process of your last company.

Q2 You can talk about webpack plugins and how to use Webpack to optimize projects.

Recently I was working on webpack build optimization and performance optimization. I was talking about it for about 15~20 minutes. Please see webPack plugin summary.

Build optimization

1. Reduce the compilation volume of ContextReplacementPugin, IgnorePlugin, babel-plugin-import, babel-plugin-transform-Runtime.

2. Compile happypack, Thread-Loader, uglifyjsWebpackPlugin in parallel

3. Cache cache-loader, hard-source-webpack-plugin, uglifyjsWebpackPlugin enable cache, babel-loader enable cache

4. Pre-compile dllWebpackPlugin && DllReferencePlugin, auto-dlL-webapck-Plugin

Performance optimization

Tree-shaking, Scope Hositing

2. Hash cache webpack-MD5-plugin

SplitChunksPlugin, import(), require.ensure

What is the difference between Q3 ES6 class new instances and ES5 new instances

I think this is the same (since I rarely read Babel compiled results), the interviewer said different… When I looked at the result of compiling Babel, I found that it was only the method declaration process of the class that was different, and the result of new was the same… I don’t know the answer right now…

Q4 Look at the canvas in your resume, please tell me why the picture of canvas has cross-domain problems.

I don’t know why canvas images cross domains, I haven’t found out so far, it’s similar, probably the reason for cross-domain is the same as the reason for browser cross-domain.

Q5 I now have a canvas with random black blocks on it. Please implement the method to calculate how many black blocks there are on the canvas.

Use getImageData to obtain the pixel array, and then traverse the number group. In the process of traversing the node, check whether the color of the pixels above and below the node is the same. If so, then set the identifier, and finally groupBy all the pixels. (This was my plan.)

For better answers, see the address

Q6 Please implement a promise by hand

I won’t write this, but see how promises are implemented

Note: all around is a super cute little sister, after computer is asked me to write to me, I said that I write about, and then the computer for her, then she should silently watching my code, trying to find my train of thought, did not ask me to realize the idea is what, then I ask her, you should not be let me explain my code to your way of thinking… You’re trying to find my mind, I don’t even know what my mind is… Then I both laughed, hahaha. At the end of the day, I said I hadn’t eaten lunch yet, and she also called another little brother to take it down to eat first. It was really a kind little sister, thank you very much.

Five surface

Q1 What are the characteristics of your technology

Q2 Tell me about the project you were most proud of. What were the flaws in your project? Any downsides?

Q3 now there is such a team, if you were asked to do the technical architecture, what would you do?

Given the team every a front-end technology stack may be inconsistent, this time I may choose to front-end architecture, let each person is responsible for the module can separate development, deployment, alone alone rolled back, does not depend on other project module, in as much as possible under the condition of saving the cost of learning between team members, it definitely has its drawbacks as well as, of course, That is, each module needs a front-end project, separate deployment, separate rollback undoubtedly also increases the operation and maintenance costs.

Q4 Tell me about the main business processes of your last company. Were you involved in them?

Hangzhou has praised

A WEB front-end engineer telephone interview lasted 43 minutes

Q1 Self-Introduction

Q2 Explain the whole process from entering the URL to seeing the page happen, as detailed as possible.

  1. First the browser main process takes over, opening a download thread.
  2. Then it makes an HTTP request (DNS query, IP address, etc.). In the middle, it holds hands three times, waits for the response, and starts to download the response packet.
  3. The downloaded content is handed over to the Renderer process for management.
  4. The Renderer process starts parsing the CSS Rule Tree and DOM Tree in parallel, so I usually place the link tag at the top of the page.
  5. In the process of parsing and drawing, when the browser encounters the link tag or script, IMG and other tags, the browser will download these contents. When it encounters the cache, the cache is used, and the cache is not suitable for re-downloading resources.
  6. After the CSS rule tree and DOM Tree are generated, we start to synthesize the Render Tree. At this time, the browser will conduct layout, calculate the position of each node, and then draw.
  7. After drawing, close the TCP connection with four waves.

Q3 You just said three handshakes and four waves. Describe it?

I am not very familiar with these concepts of computer network, so I can’t answer this question. Here mark is the article, and interested students can check the address

Q4 The position of CSS and JS mentioned in Q2 affects page efficiency. Why?

CSS in the loading process will not affect the generation of the DOM tree, but will affect the generation of the Render tree, and then affect the layout, so generally speaking, style link tag needs to try to put in the head, because when parsing DOM tree is top-down, and CSS style is asynchronously loaded, This way, parsing the body node under the DOM tree and loading CSS styles can be as parallel as possible, speeding up the generation of the Render tree.

Js script should be on the bottom, the reason is that js threads are mutually exclusive relationship with GUI rendering thread, if js at first, when the download execution js, affect rendering schedule drawing page, js mainly deal with the effect of interaction, and interaction must be, let the page so in order to ensure that the user experience, as far as possible let page mapped out.

Q5 now has A function A and B, please implement B to inherit from A

1 / / way
function B(){}
function A(){}
B.prototype = new A();

2 / / way
function A(){}
function B(){
  A.call(this);
}

3 / / way
function B(){}
function A(){}
B.prototype = new A();

function B(){
  A.call(this);
}
Copy the code

Q6 You just said in Q5 several inheritance methods, respectively talk about their advantages and disadvantages

Method 1: easy to understand, but can not implement multiple inheritance, the parent class new stereotype methods/stereotype properties, all subclasses can access

Method 2: Multiple inheritance can be implemented, but only the instance attributes and methods of the parent class can be inherited, not the prototype attributes/methods

Option 3: You can inherit instance properties/methods as well as stereotype properties/methods, but the example shows two A constructors

Q7 describes several ways in which CSS is vertically and horizontally centered

Refer to the front baidu a pen test Q2

Q8 Q7 flex layout, vertical horizontal center must know the width?

Yes, you have to know the height.

Q9 Describe this

This, the context in which the function is executed, can be changed by applying, calling, and bind. For anonymous functions or directly called functions, this refers to the global context (window for browser, global for nodejs), and the rest of the function calls, this refers to whoever called it. Of course, there are arrow functions in ES6. The point of the arrow function depends on where the arrow function is declared. Where the arrow function is declared, this points.

Q10 says something about the browser caching mechanism

There are two types of browser caching mechanisms, one is strong caching and the other is negotiated caching.

With strong caching, the browser downloads the resource directly on the first request and caches it locally, and uses the cache directly on the second request.

For the negotiated cache, the first request cache and store the cache id and time, and the repeated request sends the cache ID and the last cache time to the server. The server verifies the request and uses the cache if it fails.

Strong cache scheme

Exprires: the response header of the server that tells the client when the resource will expire on the first request. The drawback of Exprires is that the server time must be strictly synchronized with the client time.

Cache-control: max-age: indicates how long it takes for the resource to expire. This eliminates the problem that the client and server must synchronize their time.

Negotiated cache scheme

If-none-match /ETag: cache identifier, used to identify a cache when comparing caches. The server returns this identifier to the client for the first request. The client compares this identifier with the server for the second request and returns if-none-match to determine whether the cache is matched.

Last-modified/If modified – Since: On the first request, the server returns last-modified indicating the Last modification time of the requested resource. On the second request, the client carries if-modified-since indicating the Last modification time of the requested resource. The server compares the two fields.

Q11 ETag is how is this string generated?

I didn’t answer. I assumed it was an encryption algorithm based on the contents of the file or the last modification time. The method for generating ETag values is not explicitly specified.

Typically, you use the hash of the content, modify the hash of the timestamp last, or simply use the version number.

Q12 now asks you to complete a Dialog component, what are your design ideas? What should it do?

  1. This component needs to provide a hook to specify the rendering location, which is under the body by default.
  2. The retooler can then specify outer styles, such as widths, etc
  3. The component also needs a mask layer to hide the underlying content, which can be clicked to close the Dialog by executing the onCancel function passed in.
  4. In addition, the component is controllable, requiring the outer layer to pass visible to indicate whether it is visible.
  5. The Dialog may then need to customize the header head and bottom footer, with a header and bottom footer by default, and a confirm button and a cancel button at the bottom. The confirm button performs an externally passed onOk event, and the cancel button performs an externally passed onCancel event.
  6. When component visible is true, set body overflow to Hidden, hide the body scrollbar, and display the scrollbar vice versa.
  7. Component height may be greater than the page height, and a scrollbar is required inside the component.
  8. Rerender all content in a component only if its Visible changes and is true.

Q13 What do you think is the most impressive project you have ever done?

Ant Financial – Experience Technology Department senior data visualization R&D engineer

One phone call lasts 1 hour and 24 minutes

Q1 Describe a recent visualization project you worked on

Q2 just said that Java calls JS to generate data reports offline? How does Java call JS promise return result asynchronously?

Using the Java JAVASCRIPT engine Nashorn, Nashorn does not support event queues, so polyfill is introduced, then Java calls the JS method to get the Java Promise object, and then calls the then method of that object. The callback function is a method of some class in Java. Then while a variable indicating whether the callback has been executed, if not, lets the Java main thread sleep, and if it has been executed, breaks out of the loop and sets the change in the callback function passed in to the Promise. See address for code details

Q3 What are the advantages and disadvantages of SVG and Canvas?

What they have in common: Both are effective graphical tools, both have high performance for small amounts of data, both use JavaScript and HTML; They all comply with world Wide Web Consortium (W3C) standards.

SVG advantages:

Vector graphics, independent of pixels, will not be distorted after infinite magnification.

Represented in the DOM, event bindings are distributed directly to nodes by the browser.

SVG faults:

Dom format, which involves updating the DOM during animation and has low performance.

Canvas advantages:

Customization is stronger, you can draw what you want.

Non-dom structure form, with JavaScript to draw, involving animation performance is high.

Canvas faults:

Event distribution is handled by the canvas, and events for the content drawn need to be handled by itself.

Depending on pixels, it is not efficient fidelity, and performance is poor when the canvas is large.

Q4 What you just said is that canvas renders a larger canvas with lower performance? Why is that?

Because canvas depends on pixels, it is drawn pixel by pixel in the drawing process. When the canvas is large enough, there will be enough pixels, so the energy level will be low enough.

Q6 Suppose I now have 5000 circles, draw them completely, click on a circle, highlight the circle, and set the other 4999 circles to translucent, how to use SVG and Canvas respectively?

First, we start from data, each of our circles is a data, this data has the circle x, Y, RADIUS, isHighlight if SVG, directly render the node, then bind the click event to the node, click to change the highlighting property of all data (must be executed synchronously), and then let the browser draw. If it is canvas, we need to bind the event to the Canvans label by ourselves, and then determine whether the clicking position is inside the circle when clicking. If it is inside a certain circle, we will update the highlighting attribute of all data, and then draw it once.

Q7: How to implement canvas click event? What if instead of circles, these shapes are squares, rectangles, regular shapes, irregular shapes?

For each shape, it is abstracted into shape class, and each class has its own method isPointInSide to determine whether the node is in the graph. For irregular graphs, it is treated as a rectangle, and this method is used to determine whether the clicking position is in the graph when clicking.

Q8 What if my graphics may have the need to transform, enlarge, offset, or rotate? What do you do with isPointInSide?

I can’t answer this question. According to the interviewer, there seems to be an API for position mapping after deformation, rotation, enlargement, etc.

Q9 The canvas click event, how to quickly find the circle you clicked from the 5000 circles (not completely traversing 5000 nodes) when clicking?

Can be through the form of pre-search, when the mouse across the time to find some nodes near the mouse, when clicking on the time from these pre-screened good nodes to find the node click down, of course, the premise of this method is not to affect the execution of js main thread, must be asynchronous form.

Q10: @antv/g6: @ ANTv /g6: @ ANTv /g6: @ ANTv /g6: @ ANTv /g6: @ ANTv/G6: @ ANTV/G6: @ ANTV/G6

More than a year after graduation, I probably forgot the structure of tree. I answered as follows:

In the university, the data structure learned from C++ is in the form of Pointers. First, there is a root node, in which there is an array of Pointers to all its child nodes, and then each child node also has an array of Pointers to its child nodes, layer by layer, until it is a leaf node, and the pointer array is empty.

Q11 Remember binary trees? How many ways to describe binary tree traversal?

Sequential traversal: If the binary tree is not empty, access the root node, traverse the left subtree, traverse the right subtree.

Middle-order traversal: If the binary tree is not empty, traversal the left subtree; Access the root; Traverse the right subtree.

Back-order traversal: If the binary tree is not empty, traversal the left subtree; Traverse the right subtree; Access the root.

All traversal is recursive until there are no children.

Q12 tell me all the sorts you can remember. How do they work?

Bubble sort: double layer traversal, compare the two nodes before and after, if the conditions are met, the position is changed until the end of traversal.

Quicksort: Go to the middle of the array, iterate through all the numbers, push smaller numbers to one array, push larger numbers to another array, sort the two arrays recursively, and concatenate all the results.

Select sort: declare an array, find the maximum or minimum value in the input array each time, pull it out and push it into the declared array until the input array is empty.

Q13 Tell me about the most complex project you have ever worked on? What difficulties did you encounter and how did you solve them?


Interviewer: I’m almost done here. Do you have any more questions?

Me: I’m surprised today is all about visualization, not js, CSS, HTML.

Interviewer: Let’s move on

Me:…


Q14 Tell me about React.

Before we didn’t have jquery, our general process was to get data from the back end through Ajax and then use jquery to generate DOM results and update them to the page. However, with the development of business, our project may become more and more complex. Every time we request data or change the data, We need to reassemble the DOM structure again and then update the page, which makes it more and more expensive for us to manually synchronize dom and data, and frequent dom manipulation makes our page performance slow down.

At this time, MVVM was introduced. The two-way data binding of MVVM allowed us to synchronize DOM updates with data changes, and DOM updates could also directly synchronize our data changes. This greatly reduced the cost of manually maintaining DOM updates. React is a one-way data flow, requiring manual implementation of two-way data binding.

With MVVM is not enough, because if every time there is data to do the change, and then we all quantity to update the dom structure, didn’t also the way to solve our frequent operation dom structure (reduce the performance page) problems, in order to solve this problem, the react internal implements a set of virtual dom structure, also is to use js to implement a set of dom structure, React uses the famous DIff algorithm to compare DOM structures, find dom nodes that need to be added, updated, or deleted, and then update the real DOM at once. This greatly reduces the number of DOM manipulations.

So how does diFF algorithm work? First, diFF will directly determine the location of the original node to be unloaded and use the new node to load the unloaded node for nodes of different types. For nodes of the same node type, all attributes of the node are compared. If all attributes of the node are the same, it is determined that the node does not need to be updated; if the node attributes are different, it is determined that the node needs to be updated. React updates and renders the node.

React was originally designed to render the UI layer. Although each component has its own state, state refers to the state of the component. When the state needs to change, we need to use setState to update our component. We need to lift the state of the components into the parent component, to the state of the parent component to control the weight of these two components rendering, when our component level deeper and deeper, a state needs to have been passed down, no doubt increased the complexity of our code, we need a state management centre, to help us manage our state of the state.

When redux comes along, we can hand over all the states to Redux to manage. When one of our states changes, the components that depend on that state will do a re-rendering, which will solve our problem of passing state down all the time. Redux has the concepts of Action and Reducer. Action is the only source to modify state, while Reducer is the only entry to determine how state changes. This makes the data flow of Redux very standard, and also exposes the complexity of Redux code. There’s so much code to be done.

Later, another solution emerged in the community, mobx, which advocates simple and easy to understand code. You just define an observable, and any group that uses that observable changes its data, and the component gets rerendered. In addition, mobx has shouldUpdateComponent on whether to re-render component life cycle, which is not recommended for developers to change. This makes it easy and fast to complete many functions when we use MOBx development projects. Even the author of Redux also recommends using MOBx for project development. However, as the project got bigger, mobx also exposed its disadvantage, which was that the data flow was too random and it was not easy to trace the flow of data after bugs. This disadvantage reflected the advantages of Redux, so the community recommended mobx for small projects and Redux for large projects.

Q15 Suppose I have a component with a state count of 1, and THEN I execute twice in componentDidMount() this.setState({count: SetTimeout (() => {this.setState({count: ++this.state.count})}, 0). Why is that?

Count ++ = this.state.count++ = this.state.count++ = this.state.count++ = this.state.count++ React uses the isBatchUpdate field to indicate that the update is a batch update, and then commits all setState results to state at the end of render. Set the isBatchUpdate field to false.

For two setTimeout, the JS engine will throw these two setStates into the event queue, waiting for JS to be idle to execute, while our render function is executed synchronously (react16 version does not enable asynchronous rendering by default), so after our render execution is complete, That is, after our state is synchronized, the setState in the event queue is executed, and the second setState of setTimeout is the same, so the final result is 4.

Note: there seems to be a problem with the answer to this count, so I wrote a demo, the answer is not 4, demo address jsfiddle.net/yacan8/5gsp…

Q16 Tell me what you think is the most worthy thing you’ve ever done

The last

The several rounds of the interview the interviewer is very genial good communication, don’t know the no baidu five rounds of interview, remember only five the interviewer said, you wait for a moment, I go to ask others to do you have any other requirements, and then after a while HR is calling me back first, call waiting for HR message below, if failed, also won’t be in contact with me, it’s been four days, I hope there’s some news later. Then I passed both youzan and Ant Financial. After each interview, the interviewer asked me if I had any questions. I always ask what the interviewer said about me during the interview.

Follow-up portal -> Remember the whole process of a front-end interview