Front-end pen question set (2)

No. 11

In css styles, PX and Em are often used. What are their advantages and disadvantages and what are their differences in performance?

Answer:

PX is the pixel and Em is the relative unit. Em can accurately scale the text when you zoom in and view the webpage. When PX is used as the size, the text will not become larger when the page is enlarged in Some browsers.

No. 12

If you are using Google Chrome or Apple Safari, how can you make the input element display "Alipay WD team" by default, and display blank after the cursor moves in?

 

No. 13

Explain

alert(Function instanceof Object);alert(Object instanceof Function);

This result.

Answer:

Objects, functions, arrays, and so on are called constructors. They are all functions. All functions are instances of the constructor function. From the perspective of the prototype chain mechanism, that is to say, all functions can find the construction prototype function. protorype object for creating their function constructor through the prototype chain, so:

 

 alert(Object instanceof Function);// return true

At the same time, because function. prototype is an object, so its constructor is an object. from the perspective of the prototype chain mechanism, that is to say, all functions can use the prototype chain to find the prototype object to create their object constructor. prototype object, so:

 

 

 alert(Function instanceof Object);// return true

Interestingly, based on our analysis of instanceof through the prototype chain mechanism, we can easily conclude that the function instanceof function still returns true, and the principle is the same.

 

1. function is a constructor, so it is a function object.

2. Function objects are created by function constructors. The prototype chain mechanism is interpreted as: function. prototype exists in the prototype chain of function objects.

3. instanceof searches for each node in the prototype chain. If the prototype of function constructor function is found in the prototype chain, true is returned.

Therefore, the following code returns true.

 alert(Function instanceof Function);// still true

 

Conclusion

1. In JavaScript, everything is an object. They all inherit from the object. Or the root node of the prototype chain of all objects is object. prototype.

2. It is very important to understand how the prototype chain mechanism works in JavaScript. No matter how complex an object is, you can easily break it down.

No. 14:

// The existing code is as follows:
VaR Foo = 1;
Function main (){
Alert (FOO );
VaR Foo = 2;
Alert (this. Foo)
This. Foo = 3;
}
// 1. Provide the Alert Result for calling the function in the following two ways and explain the cause.
VaR M1 = Main ();
VaR m2 = new main ();
// 2. If you want the M1 generated by VAR M1 = Main () to be exactly the same as the previous m2, how can we transform the main function?

Answer:

1. When var M1 = Main (), alert returns undefined and 1 because foo is in main () the function domain has not been defined, so the prompt undefined is displayed, and the output of this. foo, because the function execution environment is fully local, equivalent to window. main (), so this = window, so this. foo = Window. foo = 1
When var m2 = new main (), alert returns undefined and undefined. The reason for the first undefined is the same as that in the previous case, the second cause of undefined prompt is that a main () instance is constructed with new in this case, so the execution environment has changed, instead of the full local area, but m2, so this = m2 at this time, so this. foo = m2.foo,. foo), this in M2. foo has not been defined, so the prompt is undefined.
2. If M1 = Main () is the same as m2, the main () function must be changed to function main () {alert (FOO); Foo = undefined; alert (this. foo );}.

No. 15

Write a script to achieve this: when any link on the page is clicked, alert returns the sequence number of the link on the page, for example, alert (1) for the first link, and so on;

Answer:

The main test is the closure in the loop.

<A href = "#"> first link </a> <a href = '#'> second link </a> <SCRIPT> window. onload = function () {var L = document. links. length for (VAR I = 0; I <L; I ++) {document. links [I]. onclick = (function (x) {return function () {alert (x + 1) ;}) (I) ;}</SCRIPT>

 

Front-end pen question set (2)