August Gengwen challenge | summary of front-end JS handwritten questions (II)

This is my participation 8 The fourth of the yuegengwen challenge 7 God , Check out the activity details ：8 Yuegengwen challenge

Review some of the code from the last article

• Shake proof ： The last time Triggering event N second Inside Not triggered again To execute the program , otherwise Retime
• throttle ：N second The event is triggered only once in the
• Simply judge the type ：typeof Can't judge normally null And the reference type can only be correctly judged Function,instancof Only the reference type can be judged normally , The best way ：Object.prototype.toString.call(arg)
• Shallow copy ： A full copy of all the properties of an object , For the copied basic data type , It will not be affected by the modification of the properties of the copied object , For the copied reference data type , It will be affected by the modification of the properties of the copied object
• Deep copy ： A full copy of all the properties of an object , For copied reference data types , Will open up a new memory space for storage , Therefore, it will not be affected by the modification of the properties of the copy object

// Shake proof 
function debounce(func,wait){
    let timer = null;
    return function(){
        if(!timer) clearTimeout(timer);
        timer = setTimeout(()=>{
            func.call(this,arguments)
        },wait)
    }
}
// throttle 
function throttle(func,delay){
    let canRun = true
    return function(){
        if(!canRun) return;
        canRun = false;
        setTimeout(()=>{
            func.call(this,arguments);
            canRun = true;
        },delay)
    }
}
// Throttling NEW 
function throttle(func,wait){
    let pre = 0;
    return function(){
        let now = Date.now();
        if(now-pre>wait){
            func.call(this,arguments)
            pre = now;
        }
    }
}
// Simply judge the type 
function getType(arg){
    return Object.prototype.toString.call(arg).slice(8,-1).toLowerCase();
}
/*  Copy  */
var person = {
    "name":"tony",
    "age":21,
    "tech":{
        "react":false
    }
}
// Shallow copy 
let personCopy1 = Object.assign({},person)  //Object.assign Method 
let personCopy2 = {...person}  //ES6 Expansion method 
// Deep copy 
let personCopy3 = JSON.parse(JSON.stringify(person)) //JSON.parse(JSON.stringify(obj)) Method 
// Recursive deep copy method 
function deepClone(obj){
    if(typeof(obj) !== 'object') return;
    var newObj = obj instanceof Array ? []:{};
    for(var key in obj){
        if(obj.hasOwnProperty(key)){
            newObj[key] = typeof obj[key] === 'object' ? deepClone(obj[key]) : obj[key];
        }
    }
    return newObj;
}
 Copy code 

The second content

1. Inherit

Two common inheritance methods ：

• Combination inheritance （ Prototype chain inheritance + Constructor inheritance ）
• Parasitic combination inheritance （ Improvements in combinatorial inheritance ,）

/*  Method 1 ： Combination inheritance  */
function Parent(age){
    this.age = age;
}
Parent.prototype.sayAge = function(){
    console.log(this.age);
}
// Constructor embezzlement , Set a variable 
function Child(age){
    Parent.call(this,age)
}
// Modify the prototype , Inheritance method 
Child.prototype = new Parent();
////////////////////////////////////////////////////////////
/*  Method 2 ： Parasitic combination inheritance （ Improvements in combinatorial inheritance ） */
function Parent(age){
    this.age = age;
}
Parent.prototype.sayAge = function(){
    console.log(this.age);
}
// Constructor embezzlement , Set a variable 
function Child(age){
    Parent.call(this,age);
}
// Prototype chain modification 
const prototype = object(Parent.prototype);
prototype.constructor = Child;
Child.prototype = prototype;
 Copy code 

2. Array weight removal

Method ：

• ES5 filter
• ES6 Set

//ES5 filter
function unique(arr){
    var res = arr.filter(function(item,index,array){
        return array.indexOf(item) === index
    })
    return res;
}
//ES6 Set
var unique = arr => [...new Set(arr)]
 Copy code 

3. Flattening arrays

Flattening arrays ： Flatten a multidimensional array into a one-dimensional array

Method ：

• recursive
• ES6 array.some

//ES5 recursive 
function flattern(arr){
    var array = [];
    for(var i=0;i<arr.length;i++){
        if(arr[i].isArray)  array = array.concat( flattern(arr[i]) )
        else array.push(arr[i])
    }
    return array
}
//ES6
function flatten(arr) {
    while (arr.some(item => Array.isArray(item))) {
        arr = [].concat(...arr);
    }
    return arr;
}
 Copy code 

4.new

step ：

• Create an empty object
• Point the object prototype to
• Modify the empty object context
• Return empty object

function newFunc(Constructor,...args){
    var obj = {}
    obj.__proto__ = Constructor.prototype
    Constructor.call(obj,args)
    return obj
}
 Copy code