Front-end interview (personal collection summary) HTML

Front-end interview (personal collection summary) CSS

Front-end interview (personal collection summary)

How many basic data types are there in JS

undefined, null, boolean, string, number

New symbol type in Ps:ES6

Reference: JavaScript data types and their detection

JS variables are classified into those types according to how they are stored and describe their characteristics

  • Value types

  • Reference types

A thorough understanding of deep and shallow copy in JavaScript

What types can be obtained from using typeof in JS

Undefind, String, number, Boolean, function, object

Objects, arrays, and null are all objects (functions are reference types, but can be recognized), because Typeof cannot distinguish reference types

Ps: you can get the new symbol type in ES6

How do I determine if a variable is an array type

You can use the instanceof keyword

Here’s an example:

var arr = []
arr instanceof Array //true
Array.isArray(arr) //true
Copy the code

When to use ‘===’ when to use ‘==’

  • The automatic forcible conversion is risky.

  • The jQuery source code recommends using level 3, and I personally write it that way. Double equality can be used to judge Boolean values

Reference: Completely ending implicit type conversions behind Javascript

Write an example of inheritance

// constructor mode
function Animal { this.name = 'pig' }
function Animal2 { Animal.call(this); this.age = 18 }
console.log(new Animal2())
// Disadvantages: Cannot inherit Animal prototype object

// Prototype chain mode
function Animal { this.name = 'pig' }
function Animal2 { this.age = 18 }
Animal2.prototype = new Animal();
console.log(new Animal2())
// Disadvantages: it is actually shared. If you modify the contents of the prototype object, other inherited classes will also synchronize the changes

// Combination mode
function Animal { this.name = 'pig' }
function Animal2 { Animal.call(this); this.age = 18 }
Animal2.prototype = Animal.prototype;
console.log(new Animal2())
// Disadvantages: Since references to the same prototype object, it is impossible to distinguish by whom the object is instantiated

// Final mode
function Animal { this.name = 'pig' }
function Animal2 { Animal.call(this); this.age = 18 }
Animal2.prototype = Obiect.create(Animal.prototype);
Animal2.prototype.constructor = Animal2;
console.log(new Animal2())
// Explanation: Specify the constructor attribute as itself by creating a new object that is no longer the same
Copy the code

Several ways to create objects

  • literal

  • object

  • The constructor

  • object create

Describes the process of new an object

  • Create an empty object and inherit the prototype object

  • Execute the constructor, which points to the empty object

  • If object is returned, the new object is returned, otherwise object is returned

Your understanding of variable ascension

When executing code, declarations of variables and functions are promoted to the top of the scope (the variable is undefined)

If it is global, it is promoted to the top of the script

If it’s inside the function, it’s promoted to the top of the function, as is this

PS: Note the case of function expressions (anonymous functions)

PS2: Note the let situation in ES6, there is no variable promotion

This can be used in several different ways

  • Execute as a constructor

  • Execute as an object property

  • Execute as a normal function

  • call apply bind

Create 10 A labels and click to pop up the corresponding serial number

for(var i=0; i<10; i++){ (function(i){
  	var a = document.createElement('a');
    a.innerHtml=i+'<br>';
    a.onclick=function(e){
  		e.preventDefault();
      	alert(i)
	}
    document.body.appendChild(a)
  })(i)
}
Copy the code

How to understand scope

There are only functional and global scopes. ES6 will add block-level scopes later

Variables declared outside a function are globally scoped and can be used inside a function

Variables declared inside a function are function scopes and cannot be used outside the function

Scope chain: The process by which a free variable goes up to find (when defined) a variable in its parent scope.

Free variables: variables not defined in the current scope

Ps: Use let in curly braces to declare variables as block-level scopes that can only be used internally to reduce global contamination

Do you know closures?

Closure: A special function that uses one function to access an internal variable in another function

Usage scenario: Currization function

Reference: mp.weixin.qq.com/s/G9HIJWH-5…

What’s the difference between synchronous and asynchronous?

Synchronous blocks code execution; asynchronous does not

Asynchronous front-end scenarios?

  • Scheduled task: setTimeout setInverval

  • Web request: Ajax request, dynamicloading

  • event

JS running mechanism is briefly described

  • Single threaded: JS engines, event triggers, and timing triggers are all single threaded.
  • Task queue: JS is divided into synchronous tasks and asynchronous tasks. Once all synchronous tasks in the execution stack are executed (the JS engine is idle at this time), the system reads the task queue, adds the asynchronous tasks that can be run to the executable stack, and starts execution.
  • Event loop system: When some API is called by code in the execution stack, various events are added to the event queue. When the code in the stack finishes executing, it reads the events in the event queue and executes the loopback process.

Reference: www.dailichun.com/2018/01/21/…

Processes and threads

  • Process: A running application, a running environment for the application, and the smallest unit of CPU resource allocation
  • Thread: Based on a process and used to perform operations (such as executing code), it is the smallest unit of CPU scheduling. A process can have more than one thread

Gets a random number in a string format of consistent length

var random = Math.random();
var random = random+'00000000';
var random = random.slice(0.10);
Copy the code

Write a generic forEach function that iterates through objects and arrays

function foreach(obj,fn){
  var key;
  if(obj instanceof Array){
  	obj.forEach(function(item,index){
  		fn(index,item)
	})
  }else{
  	for(key in obj){
  		fn(key,obj[key])
	}
  }
}
Copy the code

How do I get the current timestamp in JavaScript

  • Date.now()

  • new Date().getTime()

  • +new Date()