Meituan point review – front end of the business group to the store (3 rounds of technical surface + HR surface)

One side

1. CSS implements the animation, how do you get it to execute this to execute another keyFrame, how do you know when the animation is finished
2. Implementation outputs name at intervals

function A(name) {
  this.name = name;
}
A.prototype.log = function() {
    // Output name every 2s
}
Copy the code

3. Why does the following code burst the stack? Using setTimeout to recursively implement setTimeInterve() will not burst the stack

funtion fo(){
  fo()
}
Copy the code

4. RequestAnimationFrame implements a moving animation
5. React Performance optimization what do you know?
6. React Key function? What if the same key appears?
7. Implement component A React component, passed insrc='hello world'andtarget = 'world'Make Target highlight.
8. DangerousSetInnerHTMl, okay? And innerHTML
9. regularstr = '1 apple cost 30$'As many ways as you can match this 30. Have you heard of the look around?
10. Structure conversion, array structure to tree structure. What is the time complexity? Do you know the implementation of hashMap?

[
 {
 id: 'A',
 children: ['B'.'C'.'E'], // root node}, {id:'B',
 children: ['D'],
},
]

A 
| \ \
B C E
|
D
=>

{
 id: 'A',
 children: [
  {
    id: 'B',
    children: [
            {
                id: 'D',
                children: []
            }
    ]
  }
}
Copy the code

1. The first question really confused me, CSS animation how to know it finished execution, Baidu did not find the result. Later, I asked the second round of interviewers. He said that the animation defines the time of the animation and the number of seconds for each animation, and then the next one.
2. Which regular question, besides the regular /(\d+)? In addition to /g matching, you can also use the assertion /\d+(? :$)/g, and the interviewer said look around, can go to see re

Second interview

1. React: What do you know about React
2. Why is server rendering used and why does client rendering take too long to load on the first screen?
3. When did you take these resources? Is it executed inside the React life cycle or outside
4. How do you pass the requested data to the front end via script tags?
5. Can you stuff anything inside a script tag? Such as

<script>
const store = {
    a: '</script>'
}
</script>
Copy the code

6. Put values and values directly into script tags<script src="a.js">What’s the difference?
7. Does the HTML returned come with a style? It still doesn’t have a pattern
8. Have you made any special changes to the pictures?

These questions are SSR related questions, ask the true drop depth. If you’re adding SSR to your resume, you should be prepared for this

9. Handwriting pictures lazy loading
10. The browser is cached, so if you refresh it, it will take you back to where you were last time, and all the images on it will have loaded, right
11. What would you do if your image was treated to something special, such as transform? How to avoid
12. Array flat, how to determine the type?
13. A = [[1,2],3,Set([4,5]),[[[[6]]]],a] what if there is an internal ring?
14. What is the time complexity of this algorithm
15. React Key, what if it doesn’t? What if they are the same?
16. How do you know how many Li’s you clicked on

render() {
  const list = arr.map(n= > (<li><div><span>{data[n]}</span></div><li>))
  return (
    <ul onClick={this.handle}>
    {list}
    </ul>
  );
}
Copy the code

18. The following code differences

opacity: 0;
color: #0000;
Copy the code

19. <input type="file">This thing is so ugly, how to make it beautiful
20. Animate that shopping cart, that parabola, and then the interviewer goes to the phone
21. RequestAnimationFrame calculates its execution interval
22. What if JS blocks? Will your algorithm be affected? For example, what if you lose frames?

for (let i = 0; i < 10000000000; i++) {

}
Copy the code

Only one part is collected at a time, and when requestIdleCallBack is executed the requestAnimationFrame execution is healthy and ready to be collected

24. What do you prepare for an interview? What do you think they’re gonna ask
25. Why vitual Dom? Have you read the source code?
26. Have you written anything about the back end?
27. What are the differences before and after Webpack
28. Webpack after the code error, how to find the error code
29. I typed meituan.com and it turned out to be bj.meituan.com

meituan.com 
bj.meituan.com
Copy the code

30. Is redirection on the server side client side? Is this 301 or 302

301

31. Will the HMTL in the head show up? There’s something in the head

<head>
<div>1</div>
</head>
Copy the code

32. What’s the difference between a script tag in a header and one at the bottom of a body
33. The following defer async distinction

<script defer async>
Copy the code

1. The interviewer is a little brother, the question is particularly large, asked me for 80 minutes. Each to the questions are in-depth to ask, always ask, SSR asked me 8 questions, lazy loading pictures also asked me not to know so far. However, this round of interview is the best interview I have ever had, because I feel that I know all the questions, have practiced, so I did not panic.
2. React key function react key function react key

On three sides

1. What are your plans for the next three years? Do you speak any other languages? Does the compilation principle work?
2. Look at the code and say the output

function foo(){
  var b = 2;
  / / 1
  console.log(b + this.a)
}
function foo1(){
  var a = 4
  / / 2
  console.log(a + this.a)
  foo.call(this)
}
foo1.call({a:122})
Copy the code

3. What are the difficulties of your project? What’s complicated about it
4. Let the following code not error, array sorted

var arr = [1.3.4.2.6.7.9];
arr.mySort();
Copy the code

4. The difference between stack and heap in memory
5. Difference between HTTP and HTTPS
6. Animation implementation, CSS implementation, JS implementation. What if it’s blocked? What if it gets stuck?
7. How to implement drag before H5
8. What do you know about browser events? Onload, okay?
9. Find the longest non-repeating string, such as1231456 = > 231456
10. What do you think of the Webpack implementation?
11. How do you usually study? Have you written any small demos?
12. Implement koA’s middleware, the run method

var list = [function (next){
// Asynchronous invocation
}]

function run(list){}Copy the code

The interviewers have been nice this time, and the questions are much simpler and have fewer questions. This is the third time I’ve been asked this question

HR side

1. How do you feel after these rounds of written tests and interviews?
2. What are your future plans? How are you going to implement this plan
3. Tell me something about your college, study and life
4. Are you planning on a summer internship, or?
5. How do you usually study
6. Why do you come to our company?
7. Do you have any other interviews? Where are we?
8. You are from Jiangxi province. What do you think about working in Beijing?

HR is a beautiful little sister, very gentle. Just be honest. The interviewer just wants to see how you are, whether you can come to work or not

conclusion

1. The algorithm, the algorithm is basic, time complexity calculation and so on. Go to force buckle brush topic, very useful, brush about 150 160, I think the algorithm questions in the interview should not feel difficult.
2. A lot of code, I still lack experience, a lot of practice will be more confident in the interview, the interview officer out of a topic, you have written code, this cool ah.
3. HTTP, HTTPS, TCP, DNS, status code, etc. You can go to my GitHub to check. I will summarize what I have learned every day.