preface

Job-hopping had been planned for a long time. Although it was delayed for a month due to the epidemic, I decided to quit because I didn’t want to wait for death. The first two weeks are basically testing the water attitude to participate in the interview, so the face is not how. Here, I must sincerely give you a piece of advice, do not have this kind of psychology, because my psychological early missed some good company T_T.

I interviewed for front-end development, and the preparatory work was to review VUE, JS and ES6. Then the interview began. After the first interview, I really felt like, “Is the front-end interview so hard? Is it going to heaven? Is it too much to ask me an algorithm?” . There are a lot of things in the front end. In the interview for more than half a month, I basically did not ask repeated questions. This is one of the reasons why I tested the waters. Thinking about many aspects of some, most of the interview questions are known, and then targeted review, the later interview should play better. However…

Cut the nonsense and post the interview questions I’ve had this month (partial answers posted).

The framework

Our company uses VUE and applets, so the interviewers basically ask about these two frameworks. If you haven’t used a frame and the interviewer asks if you haven’t, it’s better to just say you haven’t. Don’t lie about this unless you’re really good at it and some of the principles of unused frameworks are clear.

vue

  1. Talk about vue’s bidirectional data binding implementation (it’s rarely asked this question this year, but some interviewers still do).

    Object. DefinerProperty is used to hijack setters and getters for attributes of individual data. When data changes, messages are published to the dependent collector to inform the observer to execute callback functions to achieve the effect of view update. DefinerProperty (Object definerProperty) has some pain points, such as: (1) cannot detect array subscript changes, resulting in array deletion or insert elements, the array changes do not respond to real-time; (2) Only the attributes of the object can be monitored. When the object depth is relatively deep, only each attribute can be traversed to realize monitoring. Vue3.0 uses proxies to completely avoid these pain points of object.definerProperty.)

  2. How does VUE transfer values between components

    Props, EMIT, vuex, Route pass, Pass through local storage, VUE-bus, $refs, $children, $parent

  3. What is the conflict between vuex and Vue two-way data binding

    In strict mode, properties in state objects in VUEX cannot be changed at will, but users can change data at will when using the V-Model for form processing. If properties in State in VUex are tied directly to the V-Model, an error will be thrown. The solution

  4. The difference between the history mode and hash mode in vue-router

  5. Say something about the vUE lifecycle (while answering, say which hook function implements what function)

    BeforeCreate: indicates the initialization event for data observation.

    Created :data Data is bound.

    BeforeMount: Replaces the real DOM with the virtual DOM.

    Mounted: Mounts DOM elements to a page.

    BeforeUpdate: Data Before data is updated.

    Updated: data After data is updated.

    BeforeDestroy: Called before instance destruction, all instances can still be called.

    Destroyed: Called after the instance is destroyed. All instances are destroyed.

  6. The role of route lazy loading

    Lazy loading is when it is needed to load, along with the load. In a single-page application, if there is no lazy application loading, the webPack file will be very large, resulting in a long loading time when you enter the home page for the first time, which is not good for user experience. And the use of lazy loading can be divided into pages, only when the need to load the page, can effectively share the load pressure of the home page, effectively reduce the load time.

  7. Custom instruction

  8. Mixin

  9. The execution order of the parent component lifecycle

  10. How do I prevent styles from interfering with each other

    Add the scoped attribute to the style tag

  11. To understand the virtual DOM, talk about the implementation principle

  12. Ever used Axios? How does Axios set up interceptors?

  13. How do I listen for array changes in VUE?

    Object.definerproperty can’t be hijacked to listen on arrays and objects, so vuvu3.0 or later overrides push, shift… Common Array operations such as Array.

  14. Talk to keep alive

  15. Vue-router Indicates the route hook

  16. Vue vs. React

Wechat applets

  1. Talk about the life cycle of wechat applets
  2. The realization principle of micro channel small program
  3. Custom components of wechat applets
  4. What pit did you encounter in wechat mini program, and how did you solve it?
  5. Whether wechat small program can jump to other programs

JS

  1. What are the node insertion operations
  2. How to solve cross-domain (if you mention JSONP, usually the interviewer will ask: JSONP implementation principle)
  3. Differences between typeOf and instanceOf
  4. How to distinguish Object from Array
  5. How does deep copy and shallow copy work, and why deep copy
  6. Talk about your understanding of closures. Some interviewers will ask directly, while others will give you a trial scenario and ask you how to solve it.)
  7. Talk about your understanding of prototype chains
  8. Bubble and capture
  9. Implement a promise with JS
  10. Implement the new method with JS
  11. Implementation principle of Websoket
  12. The principle of live streaming
  13. The difference between post and GET requests
  14. The difference between localStorage, sessionStorage and Cookier
  15. Briefly describe the ajax process
  16. What are the JS data types?
  17. Talk about JS prototypes

css

My CSS skills are basically enough to meet the requirements, but I’m not good at them. So when you ask me about CSS, I always say THAT I’m not very good at CSS, so the interviewer didn’t ask too many questions about CSS.

  1. Center a box horizontally and vertically
  2. What are the layouts in the CSS

ES6

  1. What does the arrow function do
  2. What promise does and how it works
  3. Difference between Async and Promise
  4. Let, const and var

    Var has a variable declaration enhancement. Var has no scope in {} and the variable name defined by var can be named repeatedly. And these lets and const are restricted

  5. Differences between map and forEach

    Both Map and forEach can be used to iterate over groups of numbers. However, map will return a new array of the same length as the original array, while forEech does not return a value

algorithm

A few companies ask about algorithms, but most don’t

  1. There are 16 bottles of water, one of which is poisonous, the mice will die after drinking a drop of toxic water in one hour, how many mice are needed at least to find out which bottle of water is poisonous after an hour?
  2. 25 horses, find the fastest 3, but there are only 5 tracks, you can only get the speed ranking of 5 horses per race, so what is the minimum number of races?
  3. Use bubble sort to sort an array in ascending order

other

  1. What performance optimizations have been made
  2. Mobile adaptive
  3. The difference between HTTP and HTTPS (individual interviewers will ask how this works)
  4. Whether code normalization is necessary
  5. The difference between the publishing subscriber model and the observer model
  6. Write down the entire process from “enter the domain name in the browser” to “page static resources fully loaded”
  7. The difference between heap and stack
  8. Advantages of WebPack (some will ask for a specific configuration, for example I was asked how sASS resolves to CSS configuration)
  9. The start-to-finish process for your company
  10. Do you have an understanding of the project architecture?
  11. What are the new features of HTML5?

The HR interview

For me, the hardest part is not the technical side. It’s an HR interview. In a technical interview, you just need to tell what you know, but the HR is at a loss when answering every question. It’s not enough to tell the truth, and it’s not enough to say something nice. For example, the reason for leaving is very troublesome. In fact, we all know that most of the reasons for leaving are not enough money. But always avoid talking about money when you answer.

  1. Why you leave your job
  2. Who is your idol? Why is that?
  3. What has been your most fulfilling experience?
  4. What is your biggest failure?
  5. What do you do when you are in a bad mood?

conclusion

In fact, the interviewer’s questions will be based on your resume and self-introduction, so it’s best to say what you are good at when introducing yourself. Say hello to the interviewer ——> name, year of graduation, how many years of development experience you have so far ——-> what projects you have worked on, what technology stacks are used in the projects ——> I am personally good at those stacks).

Some interviewers will ask one question and then move on to another, but others will follow through on your answer until you can’t answer any more. For example: Tell me about your understanding of the MVVM model. How the MVVM model is implemented in Vue. How to implement Object data binding…… Different interviewers have different priorities. Some interviewers focus on the basics and ask a lot of js questions, some interviewers focus on the framework and ask a lot of questions about how the framework works, while others focus on the project architecture.

If you are preparing for the interview in the first half of 2020, you should not have too much trouble preparing according to the directions given above. Finally, I wish you all can find the right job.