Give you a summary of some questions about object-oriented, closure function and prototype chain. Don't say much. Go directly to dry goods!!!

            Welcome to my knowledge paradise. I hope these questions are helpful to you.

1. How to create objects?

1) Bind properties and methods directly to objects

2) Create objects by literal

3) Factory mode

4) Constructor

5) Prototype object

6) Mixed mode (constructor + prototype object)

2. How to create an object to realize property private method sharing?

function Obj(name,age){
this.name=name;
this.age=age;
this.fn()
}
Obj.prototype.fn=function(){
console.log(this.name);
}
var o=new Obj('Zhang San',50)

3. What does the new operator do?

1) An empty new object will be created when the instance is

2) Point this to a new empty object

3) Bind to the properties and methods on this and point to the empty object

4) Finally, the newly created object is returned

4.prototype and_ proto_ _ Relationship?

Prototype object prototype: each function has a prototype object, and the properties and methods bound to the prototype object are public

There is one on each object__ proto__ Object. Only function objects have prototype

__ proto__ Is a pointer that refers to the prototype of the object that constructs it

(the _proto _ of the instantiated object points to the prototype object of the constructor)

5. What is the prototype chain?

1) Because__ proto__ It is a property of any object and a pointer. It refers to the prototype object of the constructor, and the prototype object of the constructor also has__ proto__, Pointing to the prototype object of the object inherited by the constructor, and so on, will form a__ proto__ The chain is the prototype chain, which is accessed recursively__ proto__ To the end point, the value is null object.

2) Find the attribute (method). If it does not exist, it will go__ proto__ Search in (that is, search in the prototype object of the constructor). If the prototype object in the constructor does not have this attribute, because the constructor is also an object, it also has__ proto__, Then it will search in its explicit prototype until null. If not, it will return undefined

6. Understanding of this and its direction?

this points to the object to which the function runs

this does not refer to the function itself or the scope of the function, and points to the object calling the function

this point can be divided into six cases:

  1) this in the global function points to window when called in the global environment

   Note: if the global function is in strict mode, it does not point to window in the global environment, which means undefined

2) When a function is assigned to an event, it points to the object bound to the event

3) When this is used in an object's method, it points to the object to which the method belongs

4) In the closure, this points to window

5) this in the constructor and in the prototype object of the constructor point to the instance object of the constructor

6) this in the arrow function points to the execution environment where the arrow function is defined

7. Implement deep copy through recursion?

function deepCopy(obj){
	var obj2=Array.isArray(obj)?[]:{};
	for(var i in obj){ // Loop object obj 
		if(typeof obj[i]==='object'){ //Determine whether each item taken out is an object
			// If it is an object, you need to create a new object and then perform cyclic assignment
			 obj2[i]={};

			 for(var k in obj[i]){ 

			    obj2[i][k] = obj[i][k];
			 }
			obj2[i]=deepCopy(obj[i]);
		}else{
			// If it is not an object, it is assigned directly
			obj2[i]=obj[i];
		}
	}
	return obj2;
}

8. Get the distance from the current element to the body?

function getTL(obj){
	var oT=obj.offsetTop;  // Gets the upper distance from the current element to the anchor parent
	var oL=obj.offsetLeft;// Gets the left distance from the current element to the anchor parent
	var p=obj.offsetParent; // Gets the positional parent of the current element
	while(p){ // Judge whether the positioning parent is empty
		oT=oT+p.offsetTop+p.clientTop; 
		oL=oL+p.offsetLeft+p.clientLeft;
		p=p.offsetParent;
	};
	return {left:oL,top:oT};
} 

9. Object oriented programming and process oriented programming?

Object oriented programming: 1) create a programming method based on real world model in an abstract way

                           2) Abstract requirements into an object, and analyze its properties and methods on this object

                           3) Convert encapsulation of functions to encapsulation of objects

Process oriented programming: it is a programming method to analyze the steps required by the problem and realize these steps step by step with functions  

10. What is your understanding of closure function?

Closures are functions that can read internal variables of other functions. Closures can also be simply understood as "functions defined within a function". They have two greatest uses: one is to read internal variables of a function, and the other is to keep the values of these variables in memory all the time.

   What's the harm of closures?

  1) Increased memory consumption.

   2)   Some browsers are at risk of memory leakage and memory overflow due to the recycling mechanism.

  3) It increases the complexity of code and inconvenient maintenance and debugging

11. Navigation linkage package

	function getTL(obj) {
		var oT = obj.offsetTop;  // Gets the upper distance from the current element to the anchor parent
		var oL = obj.offsetLeft;// Gets the left distance from the current element to the anchor parent
		var p = obj.offsetParent; // Gets the positional parent of the current element
		while (p) { // Judge whether the positioning parent is empty
			oT = oT + p.offsetTop + p.clientTop;
			oL = oL + p.offsetLeft + p.clientLeft;
			p = p.offsetParent;
		};
		return { left: oL, top: oT };
	} 

Tags: Front-end html5 html

Posted on Thu, 23 Sep 2021 20:49:33 -0400 by kid85