preface

Read my article about some of my recent thoughts after leaving Mogu Street and then having to look for a job.

I now face five companies: drops, ants, spelling, cool knorr, byte to beat a lot, a lot of spelling and cool knorr has to offer, basic ant finished second interview, drops and bytes will be on three sides, I I’ve been face in front of the first after the first summed up, the other no matter before, I have summed up this week and I hope to be able to give to the students is looking for a job to help.

In the article, I will not only list the interview questions, but also give some suggestions for answering them. Due to my limited ability, I cannot guarantee my correct answers. If there are any mistakes, I hope you can correct me.

Cool knorr

Kroca was one of the first companies I met. I met him on The Tuesday before he was laid off, and he was laid off on Friday. Maybe that’s why.

The interview department is the tool group, which is the core department of KUGale. The four interviewers told me that the group I met with was the most core group in the tool team, which would involve some image-related technologies, such as three.js and WebGL. Therefore, this group was actually quite good, and I felt I could learn a lot of technologies.

One side (telephone)

  • How did you optimize your project

    I put performance optimization on my resume, so this question.

  • What’s worth saying about your project

    Basically, you look at the highlights of the project, you talk about how some of the project’s difficulties were solved, or you talk about some of the cool technologies that were used in the project.

  • What are the advantages of Ts

    All of the advantages that you can find on the Web today are due to the advantages of static languages.

  • Difference between Type and interface

    Type is just an alias for a type, and does not generate a type. In fact, type and interface are not the same concept. In fact, they should not be compared, but sometimes they look similar.

  • React Event mechanism

    Points I feel need to answer:

    1. React why composite events
    2. Event mechanism: Process of registration and distribution. At least say that event registration is at the top of the elementdocumentNode.

    Learn about the React event mechanism

  • React diff

    Take a look at my previous post on the Virtual DOM: The React History of the Virtual DOM and its value to understand what diff means.

    The React 16 DIff policy can be described in detail in my previous post

  • The React to optimize

    See the React functional component performance Optimization guide I wrote earlier. There are also apis for class components.

  • How do I understand closures

    The foundation of the foundation, although the social recruitment test is not much, but if you can not understand the closure, should reduce a lot of points. Closures are not defined in the specification, so many people have different definitions and different perspectives, but they should have a correct understanding of the way, if according to my understanding, all functions in JavaScript are closures, because there is a global environment, all functions can access global variables.

  • How is throttling implemented

    The anti-shake and throttling code still needs to be hand-written, so this is another example of a closure,

  • What does the prototype, class B inherits Class A, look like when translated into ES5

    To be honest, I think this question is quite good. It examines how to write a good inheritance method, examines the new process, and examines the understanding of Class.

    Note: Class is overloaded. How do I call super in the constructor of a subclass

Second interview (on-site interview)

  • React fundamentals

    UI = F (state), virtual DOM, Diff policy, setState

  • React How to optimize performance

    This question is also high-frequency, see one side answer

  • Key concepts of Redux

    Store, Reduce, Action, actionCreater, Dispatch

  • Talk about the React lifecycle

    Try to compare React 15 to React 16 and see why 16 is going to do away with those life cycles and why the new life cycles can be replaced.

    Just to give you a sense of what this graph is

  • What do hooks do with lifecycles

    It is reasonable to say that functional components do not have a life cycle, but how to simulate the life cycle of class components is operated in useEffect, because the life cycle is basically done by side effects, put in useEffect is the most appropriate, specially used to deal with side effects.

  • Pen questions a

constA = {b:3}

function foo(obj) {
  obj.b = 5

  return obj
}

const aa = foo(a)

console.log(a.b)

console.log(aa.b)
Copy the code
  • Pen 2:
function Ofo() {}

function Bick() {
	this.name = 'mybick'
}

var myBick = new Ofo()

Ofo.prototype = new Bick()

var youbick = new Bick()

console.log(myBick.name)

console.log(youbick.name)
Copy the code

  • Write three: examine the box model and box-sizing attributes, judge the size and color of elements.

  • Implement a fill function, not a loop.

    Examine the recursive

  • Use ES5 to implement private variables

    Examine the use of closures

Three sides (site side)

  • What are the performance optimizations in the resume

    Reduce request frequency, image compression, React. Memo, React. UseMemo

  • How to optimize the performance of the react. memo component

    ShouldComponentUpdate (SCU). SCU is strongly related to IMMUTABLE, so it is important to understand how imMUTABLE react is, otherwise you may not understand why state cannot be modified directly, and then setState, and redux reducer should return a new object.

  • Implement a Pick in Typescript

    type Pick<T, K extends keyof T> = { [P in K]: T[P] }

  • Written Promise. All

  • Only 10 concurrent handwritten entries are allowed

  • Algorithm problem, how to determine the intersection of single linked list.

    There’s a bunch of ways. I was saying that if the last node is the same, then it intersects.

  • Algorithm problem, how to find the first intersecting node.

    Iterate through both lists to the end, recording the length of both lists simultaneously. Two lists intersect if the last node is the same. Once we have two list lengths, we know which list is longer. Let the longer list be len1 and the shorter list be Len2. The longer list is moved back (len1-Len2) lengths first. Then it starts to traverse both lists from the current position. When the nodes of the list traversed are the same, this node is the first node to intersect.

    This is something I just thought of, but I remember it was easier in the interview, but I can’t remember it.

Four sides (field side)

  • How do you feel about your popularity in the company

  • What contribution do you feel you have made to your group

  • Why you leave your job

  • Have you invested in any other companies besides ours

  • What are the salary and rank requirements

  • How to center vertically and horizontally

  • Have you seen the source code of the open source library?

  • Talk about the React source code and tell me what you remember

    I have read some of the React source code, so I should be able to give a general idea about the React source code update.

  • What are the properties of FiberNode

  • What’s a stadeNode for?

  • There are some technical issues I can’t remember

summary

The interview experience was good. I had a telephone interview, and after I felt OK with the interview, I called the company to go to the on-site interview. After finishing work at 6:30, I went to the interview by bike.

I felt that the interviewers were not interested in my project and seldom asked about the project. Maybe because they were the tool group, they didn’t even cover the component library in my resume, so they had more basic and comprehensive investigation.

However, considering the lack of complexity of the project I did before and the problem of working years, THE rating was not high, so the salary was not particularly high, but it was the peak of the rating. If there is no better offer, It is still worth going to KROCa, especially the tool group.

A lot of spelling

One side

  • How does the React 16 lifecycle change

    ComponentWillMount componentWillReceiveProps, componentWillUpdate prepare abolished, Added static getDerivedStateFromProps and getSnapshotBeforeUpdate

    I also explained in detail why getDerivedStateFromProps was used to replace the three life cycles that were to be deprecated. The main reason is that the life cycles before render 16 might be executed multiple times. See this article for details: React Fiber Architecture Deep In React

  • Take a closer look at getDerivedStateFromProps

  • How do you optimize performance in your projects

  • flex: 0 1 auto; What does that mean?

    Flex this attribute often test questions, take a good look at the ruan teacher’s Flex grammar article flex interview questions basically no problem.

  • What does the & of less stand for?

  • [‘ aaAFSD ‘, ‘aawwewer’, ‘aaddfff’] => ‘aa

    It can’t be debugged, it’s all about programming literacy, it’s only for the interviewer.

  • Interface and Type

    Took another test, there is an answer above

  • Is there any state management?

    I usually use Redux and DVA, and then talk a little bit about the concepts that distinguish redux from DVA

  • Is SSR useful?

    Never used

  • Node familiar?

    Write less

Second interview

  • Differences between a class component and a functional component

    How does a functional component differ from a class component?

  • CSS priority

    Important > Inline > ID selector > Class selector > Tag selector

  • Avoid CSS global contamination.

    CSS Modules that I often use

  • How CSS Modules work

    Generates a unique class name

  • There is an A tag, how to dynamically determine its style.

    I said write a few CSS and then pass a prefix externally. Is that what the interviewer asked? When I say we can pass the context, we don’t need to pass every component.

  • The difference between import and require import

    ES6 module and CommonJS module Key points: 1. The former is a reference to a value, while the latter is a copy of a value. 2. The former output interface at compile time, the latter load at run time.

    Recommended articles: Front-end modularity: CommonJS,AMD,CMD,ES6

  • What are the performance issues with require

    If you think about the difference in the last one, you’ll see

  • How do component libraries load on demand

    My common one is babel-plugin-import

  • How does WebPack implement dynamic loading

    To be fair, webpack loads dynamically in two ways: import() and require.ensure, but the principle is the same.

    How do webPack implement dynamic import? How do webPack implement dynamic import

  • Does React have an API for dynamic loading?

    React.lazy

  • What does React. Lazy work?

  • Can Webpack dynamically load modules introduced by Require?

    This should not be the case. As mentioned earlier, WebPack supports dynamic imports with basically only import() and require.ensure.

  • Can webpack do Tree Shaking?

    No, Tree Shaking requires static analysis, which is only supported by ES6 modules.

  • Design what properties an Input component needs. I said value, defaultValue, onChange

  • What is the type of value?

  • How does onChange specify the type of value

  • Interface and Type

  • Write a promise retry function that can be set at intervals and times. function foo(fn, interval, times) {}

    Regular questions. There are reference answers on the Internet.

On three sides

  • What does the component platform do?

    Talked to me in detail about the design of the component platform, because they wanted to do a component platform.

  • Implement a REdux

    Implement createStore, keypoint publishing and subscription, and unsubscribe.

  • Implement a REdux with TS

    Simple plus type, I wrote the type is not as complex as redux source code, it was relatively simple.

section

In fact, I did not feel that THE answer was particularly good, and even forgot the grammar of less. At that time, I felt cold, and I did not have enough time to write the style.

Fortunately, I passed the second interview with the interviewer. I think the interview was very professional, and I basically studied the depth of knowledge from the shallow to the deep. I think the answer was ok, because I am the kind of person who knows how to go as deep as possible. For node, SSR, mobile terminal, small program these aspects of my ability is very weak, but if you are not familiar with the interview, just say that you are not familiar with the line, he will not meet.

My requirement to myself before preparing for the interview is that I will try not to be questioned quickly, so I focus on reviewing the knowledge I am good at.

Face down feeling pinduoduo is not as difficult as imagined, although pinduoduo’s salary is the highest in the industry, but Pinduoduo is in Shanghai, I am in Hangzhou, and the other is mandatory 6-day shift, I am more afraid of this. Considering that my girlfriend and I are different, if only off, and the holiday will be less than normal, the opportunity to meet even less.

Consider the team, salary, and personal life.

The last

I am taoweng, a thinking front er, looking forward to your attention.

If you are also looking for a job recently, welcome to find me to communicate, the following is my public number.