Personal Background

2017 bachelor’s degree, hangzhou, front-end program yuan.

Before April 17, SHE was a cute girl with UI. She positioned herself as an interactive god and was keen on researching product user experience.

March 17 years as a UI design interns into the company, now because of UI development prospect is unknown, after a period of thoughtful (stitching) decided to transfer front end for self-study followed by managers put forward the demand for a period of time, then gradually forward side direction, June to staff, jobs for the front-end engineer.

One year front-end experience and no previous front-end interview experience

The text start

Recently, I interviewed a lot of companies. The strategy I adopted was to put the company I most wanted to work for to the last, accumulate experience at the beginning, and then make full preparations to fight.

From the very beginning, I couldn’t get the interviewer’s questions at all. I just shook my head and said I didn’t know. After that, I summarized and sorted out my shortcomings every time. Up to now, the success rate of the interview is quite good. I have received several offers, and all the companies are large and medium-sized. Although I was tortured by DXY who I most wanted to go to, I gradually built up my confidence and understood my shortcomings and had the direction to work on.

Post your own upgrade process.

It is a long story, will be updated, please look forward to

Portal:

A year of front-end interview to upgrade the road (I)

A year of front-end interview to upgrade the road (2)

A year of front-end interview to upgrade the road (3)

First Interview

Inexperienced and young, I didn’t even bring a resume (UI design interview is always an online portfolio) and rushed to work unprepared.

After the interview, I realized that the interview is not the same as the actual job development. The interview is more about the theoretical basis. So at ordinary times do not pay attention to basic skills of course I smile happily ground kneel.

Later, I went back and looked at the following questions. In fact, I found that the questions asked by the interviewer were all very basic questions, and SOME knowledge points were unconsciously used at ordinary times. However, I did not establish a knowledge system, so THAT I could not understand what the interviewer was asking.

I learned from this experience that I must pay attention to the theoretical basis, and my way of learning has changed from being obsessed with making cool practical demos to reading interview questions and theory books.

The for loop setTimeout500ms prints out 1-10

We’re looking at closures, and we’re looking at asynchrony

for(var i = 1; i < 11; i++){ var a =function(){
        var j = i;
        setTimeout(function(){
            console.log(j);
        },500)
    }
    a();
}
Copy the code

Cross domain methods for understanding

All of my work was requesting data from the same origin server, so I didn’t really touch the actual cross-domain operations.

But, if you haven’t seen a pig run, you’ve eaten pork, the same origin strategy, JSONp, Corse, I’ve covered everything I know. Later come back and reference ruan teacher’s article organized again

See the same origin policy and Cross – domain

CSS selectors + and ~

+ : selects the next sibling element ~ : selects all sibling elements after the element

About CSS selectors in the later interview also encountered, such as the difference between nTH-of-type (n) and nth-of-child(n), so also sorted out an extension of the selector article on CSS selectors in brief

Where does JQ use closures, or what closures have you seen in general?

Just before the interview, I had a conversation with one of my colleagues and asked him his opinion on closures. My colleague waved his hand confidently, saying that closures are rarely used in practical work.

Naive I said so in the interview, the interviewer’s heart must be mercilessly despise me, so talk to me about JQ source code, never read the source code of my storm cry.

The same problem arose at another large (non-Internet) company in the same industry, which presumably focused on the underlying principles of the framework.

In fact, JQ uses a lot of closures, and all methods and variables are made private through closures and called globally with $.

Closures make local variables and methods resident in memory and accessible globally to prevent global duplication.

However, because of this feature, closures can take up a lot of memory, so be careful when using them.

What are the built-in methods of arrays

It’s still a basic question. The interviewer told me to talk as much as I could. Later I came back and made a systematic arrangement

Array built-in methods (1)

Array build-in method (2)

The first interview lasted less than one hour, and I mainly introduced my own project. Now the above questions are really basic, but I did not answer them well at that time.

Because it was recommended by an acquaintance, and I knew in advance that the little sister was a senior in the interview, and I added wechat, I was also innocent, the little sister said to come to chat, I really didn’t bring anything to run over, but really thought it was chat, so that the questions of the interviewer are to think of which asked which, or a disadvantage.

So, this interview gains experience

  1. Resumes are important, not only to show personal information, but also to guide the interviewer’s questions so that they are ready to be asked
  2. The theoretical basis is very important, only relying on the actual practice of the project learning, can only become a tool to use the machine, only understand the underlying principle of the tool, can be integrated, draw inferences

Second strike

I asked for leave for the second time. I met with two companies in one day. I was lucky. A programming education platform, into A round. There were about 30 of them. Although the scale is not large, I like the business of the company very much, and I have always dreamed of being a teacher.

The technical chat was very pleasant and did not cover basic interview questions. Tech brother is an alumnus, and he values my resume. The questions focused on the details of my school project, challenge Cup, big innovation, what I was responsible for, why I did it, whether I was the person in charge and so on. I also appreciate my experience organizing front-end sharing sessions. At the same time, he also explained the company’s business and future development plan in detail to me.

And what touched me was that they looked at my blog and Github in detail before the interview and were able to speak directly about my project. It gave me a lot of respect.

Then I talked to the CEO, and his focus was on whether my plan for myself was in line with their development. The impression I get is that they don’t need people who are just on the tech pyramid, they need people who are willing to go along with them.

Since there is not much technology involved in the front end, this company’s description ends there.

The other is to do Internet tourism, office address is located in the Xixi scenic area, the environment can be said to be one in ten thousand. From 3 PM to 6 PM, hr even dropped me off at the bus stop. Thank you very much. The technical interviewers in both rounds should be team members and very friendly. Take the normal written interview process, do not ask the content is relatively basic. Let’s just say it was a close call.

With the process

The written test

The pen tests are relatively simple, to investigate the basic skills, I write relatively smooth, involving the homology and cross-domain, prototype chain, the basic use of VUE, design a few simple functions, I will post a slightly impressive topic

1. Differences between VUE and Jq

Vue: Data-driven rendering pages, no need to operate specific DOM, weak coupling between pages and JS, easy to maintain

Jquery: it relies on DOM, the page logic is consistent with the code logic, and the design idea of the page and JS coupling is completely different. It should choose the appropriate framework according to different occasions and requirements

2. Design a function that passes in a number, n, that returns 1 if n is divisible by 3, 2 if n is divisible by 5, and 3 if n is divisible by 7

Boon? Maybe it’s too easy. The e first reaction is to cheat.

And sure enough, when I was doing it, THERE was a problem, what if a number is divisible by 3 and divisible by 5? How much should be returned? They don’t specify that. Thought for a long time also did not find what pit, I guess this may be to inspect the input check

function Ajust(num){
    if(typeof num ! ="number"| | num = = null) {/ / exclude input is empty, and input the digital datareturn false;
    }else{
        if(num! =0){// exclude 0if(num%3 === 0){
                return 1;
            }else if(num%5 === 0){
                return 2;
            }else if(num%7 === 0){
                return3; }}else{
            retrun num+"Not divisible by any of 3,5, and 7."}}}Copy the code

During the interview, I raised my doubts and the interviewer was confused, so I had to conclude that there was a bug in their question.

They belong to the same Animal Species, Miao. Use your knowledge of stereotypes and objects to write out their relationships

The original problem might be a little more complicated, I don’t know, but look at the prototype chain and the object

// constructorfunction Animal(){
   this.word = "";
   this.say = function() {return "say "+ this.word; } } var Dog = new Animal(); Var Cat = new Animal(); // Instance Miao dog.word ="Wang";
Cat.word = "Miao";
Copy the code

The interview

1. What are the basic data types

Null, string, Boolean, undefined, number

2. How many requests are returned by HTTP? What do they mean

1xx: indicates the information status code

2xx: The request succeeded

3xx: redirection

4xx: Client error

5xx: Server error

4. Do you know how to deconstruct assignment

Read the document, mainly including the assignment mode and variable values, you can use an array or object to assign a given variable. Then he gave an example

const {a,b,c} = {a:"1",b:"2",c:"3"}
Copy the code
5. What is the difference between require and import

Import is used to import external modules.

Require can not only reference files and modules, but can also be used in code without restrictions on where it can be used

6. Know promise

Read the documentation, written as a native standard in ES6. Is an asynchronous programming solution. This is a big pity. Once the Promise is set, it cannot be changed. This is a big pity, which is pending (a big Promise) and rejected (a failure).

7. How can AJAX requests be changed from asynchronous to synchronous?

Ajax methods have a field that controls async, which defaults to true to indicate asynchrony. Change it to false to synchronize

8. What does This point to in the function?

Refers to the object calling the function.

The interviewer did not say anything to me about this answer. However, in a later interview, I made a lot of expansions about this point. My statement was not precise, and the point about this could be a long one.

This refers to the environment object in which the function is executed

From these two sets of questions, we can reunderstand JS this, scope, closure, object

9. What can apply and call do? What’s the difference?

Change this to point. The two functions are basically the same, but the difference is that the way of receiving parameters is different. Apply receives parameters in the form of array or array like

10. Fixed width on the left, adaptive layout on the right; Fixed width in the middle, adaptive layout on both sides
  • Left fixed width, right adaptive: left fixed width, right floating, left margin set to left width
  • Fixed width in the middle, adaptive on both sides:margin:0 auto
11. What are the new features of HTML5 and CSS3
  • Html5: audio, video, Canvas, SVG, and other semantic tags
  • Css3: Rounded corners, animation, filters, Transform, etc

Later the second face of the little brother asked a lot of JQ use of the question, this is my strengths are good answer

Also asked about the basic use of VUE, can also answer

Then he talked to me about personal planning and said that if I came, he would be the one to teach me and I was sure I would learn a lot. Well, he’s leaving in a month

I ？？？？？

Hr side

Hr is so friendly. She talked with me about the travel, the places she went to and the interesting and delicious things. Knowing that I was from Wenzhou, I could not stop, saying that I had been to an island in Wenzhou a long time ago, and talked about my career planning from the local customs and practices on the island. I’m just smiling and nodding. Yeah, yeah, yeah, yeah

Finally, HR dropped me off at the bus stop. I really appreciate it.

World War II went well and gave me a lot of energy as a rookie, which made me feel like I wasn’t too bad