Coding With Fun
Home Docker Django Node.js Articles Python pip guide FAQ Policy

A company's junior front-end job interview conclusion, I almost doubt whether I am a senior programmer


Jun 01, 2021 Article blog


Table of contents


This article gives you a summary of a junior front-end job interview from an Internet company in Shanghai, hoping to help you.

The interview process

1.) Self-introduction and how do you usually learn the front end?

A: Just answer normally.

2.) Q: Please give an example of the difference between Vue and React?

A: Components: React components are JS are the JS part inside the function, HTML part of return and Vue I use a single-file component that consists of HTML templates, JS CSS

Props: React child component gets the external property passed by the parent component through props object passed in as a function argument, and the child component of Vue gets the external property passed by the parent component through the construction option prop

state : React declares and initializes the data through useState and gets state and setState updates the status to the view through setState and Vue declares the data via data option, modifying the data directly to the view.

3.) Q: Why can Vue modify data be updated directly to the view?

A: Vue modifies the property to the getter and setter classes using defineProperty method for properties declared in the data option

Vue listens to reads and writes of data through getter and setter types, and Vue re-renders components whenever the data changes.

4.) Q: Now if there is a data data of a:123 , now this asynchronous change to 456, now requires when a change to 456 to execute a piece of code how to implement it?

A: You can listen for changes to data a through the Watch option, and then execute the corresponding code. Q: This is really possible, what if you don't use Watch

answer:...

5.) Q: Think about Vue's asynchronous API

A: Well, you can use nextTick() method to get the data and then determine whether a is equal to 456 and then execute the corresponding code.

6.) Q: Has Vuex been used? Talk about your understanding.

A: Vuex is the global state management tool for Vue projects and has several core concepts:

  • store: a container that stores the state;
  • state: status;
  • mutation: a way to synchronize state changes;
  • getter:store's calculated properties;
  • action: methods for asynchronous state changes;
  • Module: The store will be modularly managed.

7.) Q: Do you know anything about ES6? Talk about the difference between let and var.

answer:

  • The variable declared by let is within the block-level scope, while the variable declared by var is within the scope of the function.
  • Let cannot repeat claims, but var can repeat claims.
  • Let does not have variable promotion, and var has variable promotion.

8.) Q: Please write the console results if you have the following code.

{
   var a = 1;
   let b = 2;
}
console.log(a)
console.log(b)

A: Output: 1, error

9.) Q: What about console?

console.log(a)
console.log(b)
{
   var a = 1;
   let b = 2;
}

A: Undefined, wrong

10.) Q: Is there anything else ES6 knows? Does Promise understand?

A: I understand.

11.) Q: Explain what you know about Promise

A: I've described what Promise is, three states, resolve in a callback function, the role of reject and three instance methods, .then .catch .finally and two static methods, .all .race

12.) Q: What's the difference between try catch and Promise's .catch?

A: try catch is also used to catch errors, And Promise has an error bubbling feature, and although .then returns a new object, .catch can still catch errors from the first Promise object after .then (I'm not sure if that's the right answer, and the interviewer didn't say anything)

13.) Q: Macro tasks, microtasks understand?

A: I know (then I draw a diagram, the blue block represents the macro task queue, orange represents the microtask queue, the execution order is to perform the current horizontal synchronization task, then execute the horizontal microtask, and then execute the next horizontal macro task)

 A company's junior front-end job interview conclusion, I almost doubt whether I am a senior programmer1

Macro tasks and microtasks

14.) Q: Does Promise return macro tasks or microtasks?

A: Promise returns microtasks

1.) Ask: Why Does Promise Return MicrotaskS?

A: Promise represents the return result of an asynchronous operation -> When the browser gets the results must want to process -> Joining a microtask queue is faster than macro task processing -> So join the microtask queue.

15.) Q: There is currently a parent div and a child div, there is a button binding a click event on the child div, when button is clicked what happens?

A: button is clicked - > child component event trigger -> parent component event trigger This is the bubbling mechanism of the event

16.) Q: Is there any mechanism for events other than bubbling?

A: There is also a capture mechanism, addEventListener defaults to a bubbling mechanism, which can be changed to capture by changing the third parameter to true

17.) Q: What pits have you stepped on in the Vue project and the React project? (It's best to prepare this question in advance, I thought about it for a moment)

  • Vue project in TS development because Vue 2.0 template JS code does not have a type declaration - > resulting in the data obtained is any type - > Conclusion: Vue 2.0 is currently not well supported for TS.
  • React is functional programming, and when your state is an object and you want to change one of its properties, setState needs to use the object first... Expand, after changing the corresponding property value.

18.) Q: Then start asking questions about the project, how does your UI component project popover component work? To put it simply.

A: (This answer varies according to the specific item, the specific answer content is not repeated here)

19.) Q: What are the toughest problems you've encountered in your project?

A: (It's best to prepare this question in advance, and the answers vary depending on the project and are not repeated)

Summary of experience:

1. If the interview question is more complicated, you can say first: Let me think about it a little, don't worry about answering.

2. Some problems end up in advance, such as: the most difficult problems in the project and solutions, which pits encountered, etc.

3. Basic knowledge is still very important, interviewer many questions will be based on the concepts you mentioned to expand, you'd better say every technical term you have a certain understanding.

Source: Public Number -- Frontman Author: Ghost Brother

The above is W3Cschool编程狮 about the junior front-end job interview section of the relevant introduction, I hope to help you.