Remember a technical interview (2022-2)

Original link: https://paugram.com/coding/tech-interview-2022-2.html

For the previous situation, you can browse the diary of ” Interviewing the Second Company “. This article only records the gluten related to technology.

Talk about the technology stack used in your project

??: Scaffolding Vite, Component Library Antd, Chart G2Plot, State Management Mobx and Redux

You use the Vue 2 family bucket at home, right? Have you heard about the Vue 3? What is the difference between them?

??: If you know it but haven’t actually used it, you can consider self-study. The main difference is that the template writing is different (❌ In fact, there should be an improvement in performance

What do you think are the similarities between Vue 3 and React?

??: Template syntax is a bit more appropriate, Vue 3 can also be written in JSX syntax (❌ Maybe answer something else

What is the difference between Vue and React when you actually use it

??: I am definitely writing React now, after all, I have more project experience (❌ The answer is not very consistent

Like React, have you ever used someone else’s scaffolding like CRA?

??: I used this to learn from the beginning, and later changed it to Vite’s own, assembling routing, state management, interface request and so on.

React you commonly use Antd, right?

??: Other component libraries have been researched, and Antd’s business scenarios are the best covered

Which state management do you use, why do you use it, and what problem does it solve

??: At present, I prefer to use useReducer , and useReducer is simple. Cross-component parameters, complex data state adjustment (unanswered), and data hosting such as global user login status

Hooks will only be available in React 16. What problem do you think Hooks solve?

??: It is mainly the extraction of the same business logic of multiple components, reducing the writing of repetitive code

What would you do without Hooks?

??: If the class is written, it may be a bit repetitive. Now I prefer to use Hooks to write it (❌ Actually, I didn’t answer it.

TS sees you can write, what is the difference between TS and JS?

??: I also started to use TS in the first project written by the company. After entering the pit, it was out of control. TS is mainly based on type checking (substitute the problem of confusing component parameters and unknown use mentioned in my previous blog post.

What are the new syntax features of ES6?

??: That is, some syntactic sugar methods like map reducer , you still have some understanding, it is better than using for while

What is the difference between let, var and const?

??: const means unmodifiable (objects are okay) let and var involve variable promotion. Of course, most of them are written with let and const .

Can you give an example of variable hoisting?

??: When writing a function, the declaration is usually placed at the top. If it is var, it will be improved. If let is used, it must be defined first and then used (in fact, it can be said that var is allowed to declare multiple times, so it is difficult to find potential problem

How do you use Promises?

??: Mainly to solve asynchronous scenarios, for example, multiple pictures can be uploaded in sequence

What do you do when an exception occurs in await?

❌ I didn’t answer well, it’s actually try and catch , but I think this form is more elegant without using Promise’s catch

Have you written native JS, how do you write native constructors?

??: In ES5, it is a function and then new XXXX like this, in the method, write this.XXXX
??: Maybe the new ones are written like that, and the new ones are like constructor . We used to use prototype for older ones. ??: Yes, this is ES6, and prototype is a way of writing prototype chains.

What is the prototype chain?

??: The simple point is that the object is constructed based on what

How do you pass parameters to JS functions, by value or by reference (in fact, I don’t understand, the question should refer to the basic object and the reference object

??: Look at what you pass, if it is a basic object string number or something, it is itself, if it is an array object, it is a reference ??: This is just how you look on the surface, then you are copying the parameters , it is passed by value, the complicated thing is the reference address of the passed it ??: Yes, if it is a complete copy, it can only be a deep copy.

What is the difference between deep copy and shallow copy?

??: The easiest way is ... the spread operator, which is the most basic copy of an object. If there are sub-objects in it, it will not be copied (❌ Actually, recursion is required ??: three points That is something like Object.assign ??: That is a shallow copy, right ??: Then I don’t remember, I haven’t written it for a long time, but I know there is such a thing

Do you write a lot of CSS?

??: In the beginning, I actually wrote the most CSS and wrote a lot of static pages, but I found that it was of no use. The company still has more requirements for JS, writing business logic and so on. ??: I have met many of them. I only use the framework, some styles are written very little, and the components basically use Antd these styles ??: Yes, but sometimes you may encounter some very strange problems, I found the mobile terminal of Antd date in the previous home There is a problem on the page that opens up the page. In this case, you have to change the style to make it wrap.

I see you mentioned Float, Flex, Grid these layouts, tell me the difference between them?

??: Float has the longest history, but it is actually designed around the layout of the article. It feels like it is used for layout in a more Hack way. It has a fatal problem that the height cannot be controlled uniformly, and there may be confusion and collapse. ? ?: Compared with Float, Flex is more flexible. It is designed in line. You can align sub-elements up, down, left, and right, which is more free. Writing a 100% height can make each block the same height and more beautiful.

Do you know about HTTP requests, including some common request headers?

??: The request header is mainly used in the CORS cross-domain scenario. The client and the server must have an agreement, otherwise they will be blocked. The solution is a reverse proxy, or the server can set a specific domain name or *
??: Is it common for you to cross domains? ??: There are two types of projects in our company, one is two domain names at the front and back ends, which will cross domains, and the other is that the front and back ends of the Nginx reverse generation are gone??: Then It’s good if you don’t configure it like this ??: The back end may not be happy, so I can only see the mood of others

Are there other request headers you commonly use?

??: That’s Token or cache control

How many cache control methods are there?

??: I am familiar with Expire and Cache-Control , but now they seem to have more Cache-Control ??: One is forcing cache, the other is negotiating cache, mandatory cache has a fixed time, negotiation Cache is the back-end returning to the front-end for agreement and negotiation

So what other suggestions do you have for on-page optimization?

??: As far as my personal experience is concerned, in fact, resources such as pictures account for a large proportion. For pictures, webp is used without considering the compatibility. If the compatibility is high, you can choose jpg png , gif is relatively poor, and video is used instead. . Then use the compression tool to increase the compression ratio and lower the resolution. In addition, the engineering project is still code segmentation, dynamic loading is like this. When there are many pages, they are divided and loaded on demand. If it is not divided, the first screen will be longer, and the packaged files will be large.

On the whole, there are many questions that I feel that I didn’t answer them very well at the time. I also rethought them when I was sorting out this gluten. If the content is a little insufficient or wrong, you are also welcome to post. Corrections in the comments!

This article is reproduced from: https://paugram.com/coding/tech-interview-2022-2.html
This site is for inclusion only, and the copyright belongs to the original author.

Leave a Comment