Record of interview questions (part 2)

preface

Record of the interview questions (1). While qingming small long holiday, the rest of the last part also write, because recently more busy this article has been dragged for a long time. Now it is just the beginning of silver Four, there should still be some friends looking for a job, it is not too late, I hope this article can help these friends.

Personal blog: obkoro1.com

The main contents of this paper are as follows:

The interview questions QA
Some minor interview problems
Vue series problems

The interview questions QA

Q: Are you familiar with ES6’s let and const variable declarations? What are the differences with ES5 var?

let

In the same scope: var can declare variables repeatedly, let cannot declare the same variable repeatedly.

Es5 is a function scope, that is, the inside of a function is a scope, es6 is a block-level scope (curly braces ‘{inside of a scope}’), such as: if, for, the inside of a scope is a scope.
Var has variable promotion and can be used before variable declaration. Let does not have variable promotion and can be used before variable declaration.
Let has a temporary dead zone, ruan Yifeng es6 introduction documentation explains as follows:

const

Const has many of the same properties as let: non-repeatable declarations, no variable promotion, temporary dead zones, and block-level scope.
There is another difference with the let command: const must be assigned at declaration time or an error will be reported. Const constants declared by const cannot be changed.

By constants we mean values, strings, boilers.For reference types (arrays and objects), const only guarantees that the pointer is fixed

Q: priority of the Css.

This kind also usually appears in the written exam, the specific question is not very clear.

Weight priority:! important>style(1000)>id(100)>class(10) ! Always use important regardless of the weight. If two selectors apply to the same element, calculate the weights and add them. Attributes with higher weights take effect. (The class ID selector is stacked on the same tag, and then asks which CSS attribute is valid.)Copy the code

If you’re interested you can take a look at what I wrote do you really know enough about CSS weights

Q: Inheritance of function object instance method, prototype inheritance.

Function object inheritance, in the interview time, generally appeared in the pen test there, also encountered several times, the following gives an answer.

The function father (name) {/ / parent function enclosing name = name | 'koro1'; This.code =function(){console.log(this.name+'coding'); }}; Father. Prototype. Add =function(food){console.log(this.name+'eat'+food); } function son(name){father. Call (this); / / this is bound to the subclasses, binding instance methods of the parent code (prototype method the add is not binding). This name = name | | 'OBKoro1'; } son.prototype = new father(); Var sonVar= new son('faker'); var sonVar= new son('faker'); / / here also can be transmitted and name son. The prototype. The constructor = son; // Fix constructor pointing to console.log(sonvar.code ()); console.log(sonVar.add()); // The method of the parent class can be calledCopy the code

Q: by`reduce`Function to implement a simple array summation, sample array`,4,8,0,9 [3]`;

This is a simple pen-and-paper exam. There are two ways to do this: one is the common traversal method, and the other is to use the eval() method.

Let reduce=(arr)=>{// The first general traversal. let num=0; for(let [index,value] of arr.entries()){ num+=value; } return num; } let reduce=(arr)=>eval(arr.join("+")); Join ("+") yields the string '3+4+8+0+9'; // The eval() function evaluates the string and executes the JavaScript code inside it. Let result=[3,4,8,0,9].reduce((total,value)=>{return total+value});Copy the code

Q: What is the difference between call() and apply()?

The first argument to call() and apply() will be used as the value of this within the function, changing the function’s this reference. The difference between call and apply is that the call() method accepts a comma-separated argument as the following argument, and apply() accepts an array of arguments as the following argument.

I've seen A simple memorization from other blogs: from the C in Call to comma-separated, from the A in Apply to array.Copy the code

Q: What are the values of position? What does it do?

The static. Default value, does not leave the document flow, top, right, bottom, left attributes do not take effect.
Relative. Does not deviate from the document flow according to its position. When the child element is set to absolute, it deviates according to it.
Absolute. Offsets position in normal document flow according to top, right, bottom, left, etc.
Fixed. Navigate through a browser window. When a scroll bar appears, it does not scroll.

Q: How do you implement a closure? What do closures do?

A function nested within another function whose scope is a closure.

Function: Create private variables, reduce global variables, prevent variable name pollution. You can manipulate external scoped variables that are not recycled by the browser and save their values.

Q: from, please`2017-05-15T09:10:23 Europe/Paris`Extract results`[" 2017 ", "5", "15", "09", "10", "23"]`

To extract all numbers, you can write a regular expression that takes only numbers.

let str = '2017-05-15T09:10:23 Europe/Paris'; let arr = str.match( /\d{1,}/g); //match will return an array, // \d to find the number // {1,} means at least a few times, // /g means global searchCopy the code

Q: Please describe it`Promise`‘Promise’, the problems it solves and the current solutions for asynchronous operations.

This is a written question. This is my answer.

Use scenarios for Promise: Ajax requests, callback functions, complex manipulation judgments.

Promise was created in ES6 to address asynchronous programming.

Asynchronous operation solutions: Promises, generators, timers, and ES7 async

Interview questions:

Here is mainly some small problems encountered in the interview, one or two words can be said to clear things, we can take a look.

Function parameter variable promotion

Function aa(val){// Function arguments also promote console.log(val); //' function pass 'var val=' variable declaration '; console.log(val); } aa(' function pass argument ');Copy the code

What methods does JS have to define objects?

var obj=new Object(); Var obj={name:"OBKoro1"Copy the code

String number conversion operation problem

console.log(1+'2'+'2'); //122 console.log(+'1'+-'2'+'2'); //-12 console.log('A'+'B'+'2'); //AB2 console.log('A'-'B'+2); //NaN // Both numbers must be added, otherwise they are concatenated as strings. // Only two numbers can be subtracted, and the string is converted to a number. If not, the value is NaNCopy the code

What is the difference between split() and join()?

Split () splits characters into an array, and join() turns the array into a stringCopy the code

Pop ()push()unshift() Shift ()?

Pop () removes and returns the last element of the array. Push () adds one or more elements to the end of an array and returns a new length. The unshift() method adds one or more elements to the beginning of the array and returns the new length. The shift() method removes the first element from an array and returns the value of the first element.Copy the code

Check whether a number is an integer

function isIntefer(x){ return x%1===0; // return Boolean}Copy the code

How to convert a string to a number, for example:`12.3 b`?

Var num = parseFloat (' 12.3 b)Copy the code

What is a margin merge?

When two vertical margins meet, they form a margin whose height is equal to the greater of the two combined margins.

Q: What git/ SVN command lines do you use? What are the inline elements, what are the block elements? What selectors does CSS have?

Google, similar to cSS3 new attributes, H5 new attributes and so on, free words, a little back, have encountered.Copy the code

Vue series problems:

In the interview process, I was rarely asked about the framework, and most of them came across in the written exams. When introducing my own project, I would sometimes explain what technology Vue used here. At this time, the interviewer might follow Vue to ask, but in general, the questions were not too deep.

The following are the written questions:

Vue-router How to define a dynamic route? How to get the passed dynamic parameters?
```
Path :'a/:value' gets: this.$route.params.value.Copy the code
```
Name at least 4 vUE directives and their usage. The VUE document shows 13 instructions
How vUE binds events. @click=” Event name”

What are the similarities and differences between V-show and V-IF directives?

1. V-if deletes/adds Dom tags and does not occupy the document position. V-show switches the display attribute of CSS to control display and hiding and occupies the document position. 2. V-if will delete dom tags, so v-if performance consumption is higher. If frequent switching is required, v-show will be better.Copy the code

What does

do?

'<keep-alive>' is a built-in component of Vue that keeps state in memory during component switching, preventing repeated DOM rendering.Copy the code

Name three common Vue lifecycle hook functions. Vue document
Write the command code for the webpack package to the server and local development preview respectively:
```
NPM run build NPM run dev I feel very stupid.Copy the code
```

How do vUE parent components pass parameters?

Parent components pass parameters to child components through props, and child components pass parameters to parent components through events. Details are in the documentation.Copy the code

What the V-Model is used for and how to use it.

It's used for bidirectional binding for input fields or checkboxes, select boxes, things like that. <input v-model="inputData"/>Copy the code

Vuex workflow, as well as its role, usage scenarios.

Vuex workflow:
1. Within the VUE component, dispatch is used to trigger actions to submit modified data.
2. The mutations are then triggered by actions commit to modify the data.
3. Mutations receive the commit request, and automatically change the data in state (the data state in the data center) via Mutate.
4. Finally, the Store triggers updates for each component that calls it
Vuex’s role: Centralized management of project data state, data communication problems of complex components (such as siblings, distant relatives).
Server rendering of VUE
Bidirectional binding of VUE
```
Neither question will...Copy the code
```

Finished? Please like to support it. Here is another article. You can have a look at it when you are free.

summary

Ladies and gentlemen, looking for a job is also to find their own weak points, and then strengthen it, during the day by some problems to abuse, and then in the evening, we must figure out these problems, not every time by the same problem to abuse, so it is not good.

Hope to see the friends can point a like, you can also pay attention to me, your support is the biggest encouragement to me.

Finally: if need to reprint, please put the original link and signature. Code word is not easy, thank you for your support! I write articles in line with the mentality of exchange records, write bad place, do not quarrel, but welcome to give directions.

Personal blog and Nuggets personal homepage

The above 2018.4.7

Reference links:

Let and const commands