“This is the fourth day of my participation in the August Gwen Challenge.

【1】JavaScript review (A)

Shallow clone and deep clone

  • Shallow cloning:
let obj = {a:1.b: {c:2}};

/ / method
let cloneObj = {};
for(let key in obj){
    cloneObj[key] = obj[key]
};

// Method 2 destruct assignment
letcloneObj = {... obj};/ / method 3
let cloneObj = Object.assign({}, obj);
Copy the code

After shallow cloning, although obj === cloneObj; // fasle, but obj.b === cloneobj.b; // true, and when we change the value of obj.b.c, the value of cloneobj.b.c changes with it.

  • A deep clone
function deep(obj, tar) {
    var tar = tar ? tar : typeof obj === 'object' && obj instanceof Array ? [] : {};
        if(typeofobj ! = ='object') {return obj;
        }else{
           if(obj instanceof Array) {for(let key in obj){
                  if(typeof obj[key] === 'object'){
                     tar.push(deep(obj[key], []));
                  }else{
                     tar.push(obj[key])
                  }
              }
           }else{
              for(let key in obj){
                  if(typeof obj[key] === 'object'){
                     tar[key] = deep(obj[key], {});
                  }else{ tar[key] = obj[key]; }}}}return tar
}
Copy the code

After deep cloning, no matter we modify the original value or reference value of the property of the cloned object, it will not affect the cloned object.

Break, continue

A break is used to terminate the loop. After the break is executed, the loop is not continued, as follows:

for(let i = 0; i < 10; i ++) {
    if(i === 6) {break;
    }
    console.log(i);
};
// print the result: 0,1,2,3,4,5
Copy the code

Continue is used to skip the current loop without terminating subsequent loops, as follows:

for(let i = 0; i < 10; i ++) {
    if(i === 6) {continue;
    }
    console.log(i);
};
// print the result: 0,1,2,3,4,5,7,8,9
Copy the code

It is also important to note that you cannot use a return statement in a for loop.

This points to in each environment

The environment This point
Non-strict browser environment
global thisPoint to thewindow
function Depending on how it’s called, if it’s called directly, thenthisPoint to thewindow; If it’s not called directly, thenthisRefers to the caller calling the function.Simply put, this refers to whoever the function is called by.
Arrow function The arrow function is nonethis, itthisIs determined by the context of the current code block of the arrow function. In the browser environment, yeswindow
The constructor Constructors can be called in two ways. When a constructor is called as a normal function, thenthisPoint to thewindow; If it is to usenewKeyword to call, thenthisPoint to the constructor itself.
Strict mode browser environment
global thisPoint to thewindow
function If it is a direct call, thenthisPoint to theundefined; If it’s not called directly, thenthisRefers to the caller calling the function.
Arrow function The arrow function is nonethis, itthisIs determined by the context of the current code block of the arrow function. In the browser environment, yeswindow
The constructor As a normal function call, thenthisPoint to theundefined; If it is to usenewKeyword to call, thenthisPoint to the constructor itself.
Non-strict mode Node environment
global thisPoint to themodule.exports
function Call it directly, thenthisPoint to theglobal; If it’s not called directly, thenthisRefers to the caller calling the function.
Arrow function The arrow function is nonethis, itthisIs determined by the context of the current code block of the arrow function. In the Node environment, yesmodule.exports
The constructor Constructors can be called in two ways. When a constructor is called as a normal function, thenthisPoint to theglobal; If it is to usenewKeyword to call, thenthisPoint to the constructor itself.
Strict mode Node environment
global thisPoint to themodule.exports
function Call it directly, thenthisPoint to theundefined; If it’s not called directly, thenthisRefers to the caller calling the function.
Arrow function The arrow function is nonethis, itthisIs determined by the context of the current code block of the arrow function. In the Node environment, yesmodule.exports
The constructor Constructors can be called in two ways. When a constructor is called as a normal function, thenthisPoint to theundefined; If it is to usenewKeyword to call, thenthisPoint to the constructor itself.

Part of the interview questions will be updated every week, and we will progress together! Feel helpful to you, but also hope to help me point a praise ~ thank you ~