How the JavaScript engine works

Go

1. What is the JavaScript parsing engine?

In short, the JavaScript parsing engine is a program that can "read" JavaScript code and accurately give the result of the code running. Let's say that when you write var a = 1 + 1 , so a piece of code that the JavaScript engine does is to read (parse) Your code and change the value of a to 2.

People who have learned the principles of compiling know that for static languages (such as Java, C + +, c), called compilers (Compiler)that handle these things, the corresponding dynamic language for JavaScript is called Interpreter (interpreter). The difference between the two is summed up in a nutshell: The compiler compiles the source code into another code (such as machine code, or bytecode), and the interpreter directly parses and outputs the result of the code . For example, Firebug's console is a JavaScript interpreter.

However, it is difficult to define now that the JavaScript engine is an interpreter or a compiler, because, for example, like V8 (Chrome JS engine), it in order to improve the performance of JS, before running will be JS compiled into a local machine code (native machines Code), and then to execute the machine code (this speed is much faster), I believe that the JIT (Just in time compilation) must be familiar with it.

I personally think that there is no need to overemphasize what the JavaScript parsing engine really is, and I personally think it is possible to understand what it does. For the compiler or interpreter is how to understand the code, the university to turn out the compilation of teaching materials on it.

It is also emphasized that the JavaScript engine itself is a program, and the code is written. For example, V8 is written in C + +.

2. What is the relationship between the JavaScript parsing engine and ECMAScript?

JavaScript engine is a program, we write JavaScript code is also a program, how to let the program read the program? This requires defining the rules. For example, the previously mentioned var a = 1 + 1;it says:

• The left Var stands for this statement (Declaration), which declares a variable
• The + on the right indicates the addition of 1 and 1.
• An equal sign in the middle indicates that this is an assignment statement
• The final semicolon indicates that the statement is over.

These are the rules, and with that it's a measure of what the JavaScript engine can do to parse JavaScript code based on that standard. So the ECMAScript here is to define these rules. The document, ECMAScript 262, defines a complete set of standards for the language of JavaScript. These include:

• Var,if,else,break,continue is the key word for JavaScript.
• Abstract,int,long and so on are javascript reserved words
• What kind of numbers, what kind of string, etc.
• Operators (+,-,>,<, etc.) defined
• Defines the syntax for JavaScript
• Defines the processing algorithms for criteria such as expressions, statements, and so on, such as how to deal with = =
• ??

The standard JavaScript engine will be based on this set of documents to achieve, note that the standard is emphasized here, because there are not according to standards, such as the JS engine of IE. That's why JavaScript has compatibility issues. As for why IE JS Engine does not follow the standard to achieve, it is necessary to talk about the browser war, here do not repeat, Google itself.

So, to put it simply, ECMAScript defines the language standard, which the JavaScript engine implements, which is the relationship between the two.

3. What is the relationship between the JavaScript parsing engine and the browser?

Simply put, the JavaScript engine is one of the components of the browser. Because the browser has to do a lot of other things, such as parsing pages, rendering pages, cookie management, history and so on. So, since it is part of the case, JavaScript engines are generally developed by the browser developers themselves. For example: IE9 Chakra, Firefox tracemonkey, Chrome V8 and so on.

It also shows that different browsers use different JavaScript engines. Therefore, we can only say that we want to learn more about which JavaScript engine .

4. What are the ways to gain an insight into its internal principles?

Figuring out the first three questions, that's a good answer. Personally, the main ways are as follows:

• Read the book about how JavaScript engines work
  This is the most convenient way, but I personally understand that such a book is almost no, but Dmitry A.soshnikov blog article really is very praise, suggest directly to see English, really English looks labored, can read the translation
• See ECMAScript's standard documentation
  This approach is relatively straightforward and original, because the engine is implemented according to standards. At present, you can see the fifth and third editions, but it is not easy to understand.
• See JS Engine source code
  This is the most direct and, of course, the hardest. Because it also involves the implementation of lexical analyzers, parsers, and so on more underlying things, and not all engine code is open source.

5. The first of the above methods is difficult to see what to do?

In fact, the article in the first way, the author has extracted the contents of the document, in an easy-to-understand way to explain it. If it seems to be struggling, that means there are two things missing:

• It's not enough to understand JavaScript itself.
  If you've just touched JavaScript, or haven't even touched it before. It was a struggle to understand the inner workings. First, you should read more books, practice, knowledge and practice to understand the characteristics of JavaScript prophecy. In this case, you just need to understand the phenomenon. For example,(function () {}) () You can call the anonymous function directly, use a closure to solve the problem of the variable value of the deferred operation in the loop, and so on. To understand these, we need to learn and practice more. Practice here is not much to say, and knowledge to learn more about reading and blog. This level of the book is relatively more, "Professional JavaScript for Web developers" is a very good book (Chinese version, please look for yourself).
• Lack of relevant domain knowledge
  When JavaScript reaches a certain depth, however, it is not clear, or can not be very deep into the inside to explore. That means there is a lack of corresponding domain knowledge. What is obvious here is the knowledge of compiling principles. However, in fact, the understanding of this piece probably basically seems to be no problem. To continue in depth, that requires a thorough understanding of the principles of compiling, such as lexical analysis using what algorithm, generally how to deal with. What will be the problem, how to solve, AST generation algorithm generally have what kinds and so on. That depends on the compilation principle of the book, there are basic classic books, such as "compilers:principles, techniques, and Tools" This is also legendary dragon book, there are very famous "SICP" and "Plai". But in fact, according to personal experience, for Dmitry article, to understand it, as long as you have a certain depth of JavaScript, and your college computer courses can be roughly mastered (especially the operating system), that is, the basis is good, understanding should be no problem. Because these articles are basically not related to the underlying compilation, just explain the contents of the document, and many of them are interlinked, such as: Context switch and CPU process switch, function-related local variables of the stack storage, function exit operation and so on are consistent.

The above is the personal view of this issue, in addition, I think, learning any technology can not be rushed, to the foundation of a solid, so learn what will soon.

Extended Reading

The list of topics for this article is as follows:

2. How do we know how the JavaScript engine works
4. JavaScript Quest: The importance of writing maintainable code
6. JavaScript Quest: Use global variables with caution
8. JavaScript Quest: Var pre-parsing and side effects
10. JavaScript Quest: For Loop (for Loops)
12. JavaScript Quest: For-in loop (for-in Loops)
14. JavaScript Quest: Prototypes is too powerful
16. JavaScript Quest: eval () is "the Devil"
18. JavaScript Quest: Using parseint () for numeric conversions
20. JavaScript Quest: Basic Coding Specifications
22. JavaScript Quest: function declaration and function expression
24. JavaScript Quest: Named function expressions
26. JavaScript Quest: Function names in the debugger
28. JavaScript Quest: Bugs in JScript
30. JavaScript Quest: Memory management for JScript
32. JavaScript Quest: SpiderMonkey's Quirks
34. JavaScript Quest: Named Function expression substitution scheme
36. JavaScript Quest: Objects Object
38. JavaScript Quest: Prototype chain Prototype chain
40. JavaScript Quest: Constructor Constructor
42. JavaScript Quest: Executable Context Stack
44. Execution context One: Variable object and active object
46. Execution context Second: scope chain scope Chains
48. Execution context its three: closure Closures
50. Execution context Its four: this pointer
52. JavaScript Quest: Powerful prototypes and prototype chains
54. One of the JavaScript functions: function declaration
56. JavaScript functions second: function expressions
58. JavaScript functions three: function expressions in Groups
60. JavaScript functions its four: function constructors
62. JavaScript variable object one: VO's declaration
64. JavaScript Variable Object second: Vo in different execution contexts
66. JavaScript Variable Object Three: Two stages of the execution context
68. JavaScript Variable object four: about variables
70. JavaScript variable object Its five: __parent__ property
72. JavaScript scope chain One: scope chain definition
74. JavaScript scope chain Second: The life cycle of a function
76. JavaScript scope chain Three: scope chain characteristics
78. JavaScript closures: An introduction to closures
80. JavaScript closures Second: implementation of closures
82. JavaScript closure Three: the use of closures

How the JavaScript engine works