Jsninja-eloquent JavaScript Reading Notes 2-events and HTTP requests

A friend recommended book (http://eloquentjavascript.net/), while not busy recently read the next.

In general, this book is not suitable for beginners of JS, because the examples in it are relatively poor, less academic, and practical applications.

I personally recommend head first JavaScript For JS books. In fact, it is said that all the books in the head first series are good.

Every book has its merits. If you plan to read this book, you may just take a look at my notes...

Note: The English text and Chinese text are my comments. I directly translated Chinese without English.

 

This article is part 1 of the Reading Notes (the first part is here). The last two chapters are about eloquent javascript: browser events and HTTP requests. We recommend you read these two chapters.

 

1, it is important to realize that, even though events can fire at any time, no two handlers ever run at the same moment.

If other JavaScript code is still running, the browser waits until it finishes before it callthe next handler.
The event processing function is "synchronously executed". That is to say, multiple processing functions of the same event cannot be called at the same time.

 

2, in programmer jargon, browser Javascript is single-threaded, there are never two 'threads' running at the same time
In programming terms, JS applications are single-threaded ..

 

3, The most incompatible browser is Internet Explorer, Which ignores the standard that most other browsers follow. after that, there is opera, which does not properly support some useful events, such as the onUnload Event which fires when leaving a page, and sometimes gives confusing information about Keyboard Events
Do not follow standard browsers: IE and opera...

 

4. Most browsers pass the event object as an argument to the handler. Internet Explorer stores it in the top-level variable called event.
Most browsers pass the event object as a parameter to the event handler. However, ie stores this event object in the global variable event.
Therefore, to reference the event object within the event handler function, you can use the | Operator to process the event.

Function handler (EVT ){
EVT = EVT | window. event;
};

Of course, if you use jquery, you do not need to consider these differences between browsers.

 

5, A, mousedown => mouseup => click
B, (mousedown => mouseup => click) x2 => dblclick
A. Click a button to display the execution sequence of the current event.
B. Double-click the execution sequence of the current event. (I tested it in Firefox but not in other browsers)

 

6, Event objects related to the mouse containClientx and clienty Properties, Which give the X and Y coordinates of the mouse, in pixels, on the screen.
Documents can scroll, though, so often these coordinates do not tell us much about the part of the document that the mouse is over.
Some browsers provide pagex and Pagey properties for this purpose, but others (guess which) do not.
Fortunately, the information about the amount of pixels the document has been scrolled can be found in document. Body. scrollleft and document. Body. scrolltop.

The clientx, pagex, and scrollleft of the event object of the event processing function ..
Clientx-relative to the screen.
Pagex-relative to the document.
(The same is true for clienty and Pagey)
Apparently, when a horizontal scroll bar exists and the scroll value is greater than 0, pagex is greater than clientx, and theoretically pagex = clientx + (document. Body. scrollleft or window. pagexoffset)

Some browser event objects do not have the pagex attribute... For example, ie

The Declaration at the top of all pages is:
<! Doctype HTML public "-// W3C // dtd xhtml 1.0 transitional // en"
Http://www.w3.org/TR/2000/REC-xhtml1-20000126/DTD/xhtml1-transitional.dtd>
Or HTML5 Standard <! Doctype HTML>, change document.bodyto document.doc umentelement. Otherwise, document. Body. scrollleft is always 0.

Example: Http://vivasky.com/labs/jsfocus/js_eventTests.html

 

7, keydown => keyup => keypress
Internet Explorer does not generate a keypress event at all for special keys such as the Arrow keys.
In ie, the direction keys do not have a keypress event at all ~ (This is true in my tests)
Example: Http://vivasky.com/labs/jsfocus/js_eventTests.html

 

8. Simple generalized encapsulation of xml http requests

 

Code

  Function  Xhr (){
  Try  {  Return     New  XMLHttpRequest ();}  /*  Most contemporary browsers  */ 
  Catch  (Error ){};
  Try  {  Return     New  Activexobject (  "  Msxml2.xmlhttp  "  );}  /*  IE  */  
 Catch  (Error ){};
  Try  {  Return     New  Activexobject (  "  Microsoft. XMLHTTP  "  );}  /*  Ie5.5 and below?  */  
  Catch (Error ){};

  Return     Null  ;
}; 

 

 

For more information about xml http request, visitExample: Http://vivasky.com/labs/jsfocus/js_xhr.html

9 , recognizing Arrays can be tricky, since its type is "object ". you can use instanceof array, but that only works for arrays that were created in your own window-others will use the array prototype from other windows, and instanceof will return false. A cheap trick is to convert the constructor property to a string, and see whether that contains "Function Array ".
how to identify whether an object is Array?
using instanceof array directly has unstable factors. For the array created in the child form, using instanceof array in the parent form will return false...
you can convert the constructor function of this object into a string to see if it contains "Function Array "..
for example

  VaRX=[];
Console. Log (xInstanceofArray );
Console. Log (X. constructor. tostring ())
Alert (/^ \ S * Function Array/. Test (X. constructor. tostring ()));
 

 

 

 

10, there is a keyword named. I 've never actually used this in a real program, but I have seen other people use it, so it is useful to know what it is. Code using with looks like this:

var scope = "outside";
var object = {name: "Ignatius", scope: "Inside" };< br> with (object) {
Print ("name =", name, ", scope =", scope);
name = "Raoul ";
var newvariable = 49;
}< br> show (object. name);
show (newvariable);
keyword with, I have never used it...