Write in front
CSDN topic challenge phase 1
-
Event details address: CSDN
-
Entry topic: front end interview collection
-
Topic Description: welcome to join the topic creation partners. If I guess correctly, I think you should be a front-end person like me. Nowadays, the front-end accounts for an increasingly important proportion in the IT industry and has become an indispensable part. Front-end technologies are emerging one after another, and various technical categories and technical frameworks are also swarming out. The difficulty of front-end interview also increases. If we have a set of front-end interview dictionary. If you are a candidate: you can calmly solo interviewer, if you are an interviewer: you can torture the candidate to the bone!
In short, we all gather our interview experience and learned knowledge here to form a set of front-end interview Dictionary of the system. Let readers have a great harvest whether in interview or study. Let's build a front-end interview dictionary hand in hand!!!
Talk about several methods of judging data types in JavaScript
typeof
typeof is generally used to judge the basic data type. Except that judging null will output "object", others are correct
When typeof judges the reference data type, except that the judgment function will output "function", others will output "object"
instanceof
Instanceof can accurately judge the reference data type. Its principle is to detect whether the prototype attribute of the constructor is on the prototype chain of an instance object, and cannot judge the basic data type
// Implementation of instanceof function instanceofOper(left, right) { const prototype = right.prototype; while (left) { if ((left = left.__proto__) === prototype) { return true; } } return false; } // let obj = {} // Object.getPrototypeOf(obj) === obj.__proto__ ==> true
// Implement instanceof 2 function myInstanceof(left, right) { // Here, use typeof to judge the basic data type. If yes, return false directly if (typeof left !== "object" || left === null) return false; // getProtypeOf is the API of the Object object itself, which can get the prototype Object of the parameter let proto = Object.getPrototypeOf(left); while (true) { if (proto === null) return false; if (proto === right.prototype) return true; //Find the same prototype object and return true proto = Object.getPrototypeof(proto); } }
Object.prototype.toString.call() returns [object Xxxx]
Deep copy and shallow copy
let obj = { b: "xxx" }; let arr = [{ a: "ss" }, obj, 333]; // assignment let arr2 = arr; // Shallow copy - only one layer is copied, and deep references still exist // Object.assign(), ... Extension operator, slice, etc let arr2 = arr.slice(); let arr2 = [...arr]; obj.b = "222"; // arr2[1].b => 222 // arr[2] = 4444 ==> arr2[2] ===> 333 // Deep copy // 1. The simplest is JSON Stringify, but there is a problem with this. See the instructions below let arr2 = JSON.parse(JSON.stringify(arr)); // 2. Self encapsulation and recursive processing
Realize deep copy - simple version
export function deepClone(obj, map = new Map()) { if (!obj && typeof obj !== "object") return obj; if (obj instanceof Date) return new Date(obj); if (obj instanceof RegExp) return new RegExp(obj.source, obj.flags); if (map.get(obj)) { // If there is a circular reference, this object is returned return map.get(obj); } const cloneObj = obj.constructor(); // The of the array is [], and the object is {} map.set(obj, cloneObj); // Cache object for circular reference for (let key in obj) { if (obj.hasOwnProperty(key)) { cloneObj[key] = deepClone(obj[key], map); } } return cloneObj; }
Write at the end
CSDN topic challenge phase 1
- Event details address: CSDN