Deep copy

The examination site:

  1. The difference between JavaScript primitive data types and reference data types. – pile/stack
  2. JavaScript data type judgment. —- Typeof OBj/NULL due to object JS legacy
  3. Deep copy function recursive method. —- call yourself

Answer: Deep copy interview questions

Throttling and anti-shaking

The examination site:

  1. The concept of throttling and anti-shaking.
  2. Use of setTimeout() and clearTimeout().
  3. Function encapsulation and closure applications.

Answer: throttling and anti-shaking

The function is currified

The examination site:

  1. The concept of currization of functions.
  2. Application of function closures. —- internally declares a function that takes advantage of closure properties to hold _args and collect all parameter values
  3. ToString invisible conversion features. —- overwrites the toString() method of _adder so that the _adder function prints directly as number.
  4. Array. The prototype. Slice. The call (the arguments) – will the arguments are converted to an Array of an Array of class
  5. Arry. reduce(function(a,b){return a+b},0) implements internal array accumulation

Answer: Currization of the function

Implementation of inheritance

The examination site:

  1. The prototype chain concept/prototype/constructur/proto
  2. call(),apply(),bind()
  3. Es6 inheritance method
  4. Es5 Parasitic combination inheritance
  5. What is inheritance?

JavaScript: Detail JS inheritance

Handwritten Ajax request

The examination site:

  1. The XMLHttpRequest object
  2. The open(), send(), onreadyStatechange () callbacks to XHR objects

Handwritten Ajax request

Encapsulating binding event handlers, event delegates

The examination site:

  1. Event bubbling and event capture.
  2. Event object Event.
  3. Event delegate.

Encapsulate the binding event handler

Javascript array sort

The examination site:

  1. Algorithm basis.
  2. Bubble sort.
  3. Quicksort.
  4. Select sort.

JavaScript array sort

Drag function implementation

The examination site:

  1. Event object
  2. Dragevent object in H5
  3. ClientX, clientY/movementX, movementY/offsetX, offsetY/pageX, pageY/screenX, screenY
  4. Element. GetBoundingClientRect () on the Element size and its location information relative to the viewport.

Manually implement drag and drop function

Array flattening

The examination site:

  1. The concept of array flattening.
  2. The use and understanding of array methods.
  3. Recursive methods and ideas.

Implement array flattening

To realize the instance of

The examination site:

  1. The basic concept of instanceof (the instanceof operator is used to check whether a constructor. Prototype exists on the prototype chain of an instance object as a parameter)
  2. Prototype and prototype chain concept
function myInstanceof(left,right){
    if(typeofleft! ='object'||left==null) {return false;
    }
    let proto = Object.getPrototypeOf(left);
    while (true) {
	// Return false if the end of the search is not found
	if (proto == null) return false;
	// Find the same prototype object
	if (proto === right.prototype) return true;
	proto = Object.getPrototypeOf(proto); }}Copy the code

Implement Array. The reverse ()

function reverse(myArr){
let left=0;// Store the first position on the left
let right=myArr.length-1;// Store the last position on the right
while(left<right){// Stop the process
    let temp=myArr[left];// Use an intermediate variable to swap positions
    myArr[left]=myArr[right];
    myArr[right]=temp;
    left++;
    right--;
    }
return myArr
}
let arr=[1.2.3.4.5.6]
console.log(reverse(arr))
Copy the code

Binary search

var search = function(nums, target) {
    let left=0,right=nums.length-1;
    while(left<=right){
        let middle=Math.floor(left+(right-left)/2);
        if(nums[middle]===target){
            return middle
        }else if(nums[middle]>target){
            right=middle-1
        }else if(nums[middle]<target){
            left=middle+1}}return -1
};
Copy the code

Write a json

<script>
let jsonp=(url,data={},callback='callback') = >{
    // Prepare the request URL with the padding
    let dataStr=url.indexOf('? ') = = = -1?'? ':'&'
    for(let key in data){
      dataStr +=`${key}=${data[key]}& `
    }
    dataStr +=`callback=`+callback
    / / script
    let oScript=document.createElement('script')
    oScript.src=url+dataStr
    The appendChild () method adds a new child node to the end of the node's child node list
    document.body.appendChild(oScript)
    window[callback]=(data) = >{
      console.log(data);
    }
}
jsonp('https://photo.sina.cn/aj/index?a=1', {page:1.cate:'recommend'
})
</script>
Copy the code

Write a call/apply/bind

The examination site:

  1. This points to the problem
  2. The difference between the apply/call/bind

Write a call/apply/bind

Write a Promise

The examination site:

  1. Promise specification
  2. Principle of Promise
  3. Promise causes and solutions
  4. Use of Promise

Interviewer: “Can you make a Promise by hand?”

Implement the new operator by hand

Calling the constructor in this way actually goes through four steps:

  1. Create a new object;
  2. Assign the constructor’s scope to the new object (so this refers to the new object);
  3. Execute the code in the constructor (add attributes to the new object);
  4. Returns a new object.
function myNew(obj, ... rest){
  // Create a new object based on the obj prototype
  const newObj = Object.create(obj.prototype);
  // Add attributes to the newly created newObj and get the result of the obj function execution.
  const result = obj.apply(newObj, rest);
  If the result of the execution has a return value and is an object, the result of the execution is returned; otherwise, the newly created object is returned
  return typeof result === 'object' ? result : newObj;
}
Copy the code