Understanding JavaScript (1)

Introduction </P> <p> there are only two basic elements in the programming world: Data and code. The programming world presents infinite vigor and vitality in the tangle of data and code. </P> <p> data is inherently quiet and always wants to maintain its inherent nature. Code is inherently lively and always wants to change the world. </P> <p> you can see that the relationship between data code and material energy is surprisingly similar. Data is also inertial. If there is no code to exert external force, she always keeps her original state. Code is like energy. The only purpose of its existence is to try to change the original state of data. When the code changes the data, it will also affect or change the original trend of the code because of data resistance. Even in some cases, data can be converted into code, but code may be converted into data. There may also be a digital conversion equation in the form of E = mc2. However, in the conflict and unified operation between data and code, the rules of the computer world can always be reflected. These rules are the logic of the program we write. </P> <p> however, because different programmers have different world views, the data and code seem to be different. As a result, programmers of different world views use their respective methodologies to promote the evolution and development of the programming world. </P> <p> as we all know, today's most popular programming ideology is the idea of object-oriented programming. Why can Object-oriented Thinking quickly become popular in the programming world? For the first time, object-oriented thinking combines data and code into a unity and presents it to programmers with a simple object concept. In this case, the original messy algorithms, subprograms, and obscure complex data structures are divided into clear and orderly object structures, this makes it clear that data and code are in a mess in our hearts. We can have a clearer mind and explore a more vast programming world at the height of another thought. </P> <p> one day after Wu zuhong taught "Object truth Sutra", he told the Disciples: "after the lecture, I must have some insights, please write a token for them ". The great disciple, Shen Xiu, was recognized by everyone as the Senior brother with the highest understanding. His nephew wrote: "The body is an object tree, and his heart is as clear as a kind of vision. !". It immediately caused a sensation among the teachers and brothers. Only after the fire-headed Monk was able to see it, he sighed and wrote on the wall: "The object has no root, and the type is invisible. There is no such thing as where to make the dust ?". Then I shook my head and went away. Everyone who reads Hui Neng's notebook said, "What is wrong with writing? I can't understand it ". Master Hong endured the outstanding poetry and nodded. Then he shook his head silently. On the night of that day, Hong endured quietly calling Hui Neng to his Zen Room, teaching him the true story of the software he had collected for many years, and letting him escape by moonlight... </P> <p> later, Hui Neng met master's high hopes and created another vast sky of Zen in the south. Among the software that Hui Neng took in that year, there was a javascript truth! </P> <p> simple regression </P> <p> to understand JavaScript, you must first put down the concepts of objects and classes and return to the source of data and code. As mentioned above, there are only two basic elements in the programming world: Data and code, and these two elements have an ambiguous relationship. Javascript simplifies data and code to the most primitive level. </P> <p> the data in Javascript is concise. Simple data only includes undefined, null, Boolean, number, and string, and complex data contains only one type, namely, object. This is like the Chinese classical simple materialism, which classifies the most basic elements of the world as gold, wood, and fire. Other complex materials are composed of these five basic elements. </P> <p> the code in Javascript is a function. </P> <p> Note: The above words are in lowercase. Do not confuse them with JavaScript built-in functions such as number, String, object, and function. You know, JavaScript is case sensitive! </P> <p> Any JavaScript identifier, constant, variable, and parameter is only one of the unfined, null, bool, number, String, object, and function types, that is, the type indicated by the return value of typeof. There are no other types. </P> <p> let's talk about the simple data type first. </P> <p> undefined: represents all unknown things. The Code cannot be processed even if nothing is found. </P> <p> Note: typeof (undefined) returns undefined. </P> <p> you can assign an undefined value to any variable or attribute, but it does not mean that the variable is cleared. Instead, an attribute is added. </P> <p> NULL: there is such a concept, but there is nothing. None seems to exist. It is hard to imagine, but it can already be processed using code. </P> <p> Note: typeof (null) returns an object, but null is not an object, and a variable with a null value is not an object. </P> <p> Boolean: Yes. If not, no doubt exists. Right is right, right is wrong, absolutely clear. It can be processed by code or control the code process. </P> <p> Number: linear objects with distinct sizes and orders. It facilitates code batch processing and controls code iteration and loop. </P> <p> Note: Both typeof (NAN) and typeof (infinity) return number. </P> <p> the structure of Nan involved in any numerical calculation is Nan, and Nan! = Nan. </P> <p> infinity/infinity = Nan. </P> <p> string: a rational object oriented to humans, rather than machine signals. Human-machine information communication, code understanding of people's intentions, and so on, all rely on it. </P> <p> simple types are not objects, and JavaScript does not assign the objectization capability to these simple types. Identifiers, variables, and parameters that are directly assigned a simple type constant value are not an object. </P> <p> the so-called "objectization" means the ability to organize data and code into complex structures. In JavaScript, only the object type and function type provide the objectization capability. </P> <p> no class </P> <p> object is the object type. In JavaScript, no matter how complex the data and code are, they can be organized into objects in the form of objects. </P> <p> JavaScript does not have the concept of "class! </P> <p> for many object-oriented programmers, this is probably the most difficult to understand in JavaScript. Yes. In almost any object-oriented book, the first thing to talk about is the concept of "class", which is the pillar of object-oriented. This suddenly does not have a "class", we feel as if we have no spiritual pillar at once, and have no master. It seems that it is really not easy to put down objects and classes to reach the realm of "No root object, no invisible type. </P> <p> let's take a look at a javascript program: </P> <p> var life ={}; </P> <p> for (life. age = 1; life. age <= 3; life. age ++) </P> <p >{</P> <p> switch (life. age) </P> <p >{</P> <p> case 1: life. body = "egg"; </P> <p> life. say = function () {alert (this. age + this. body) };</P> <p> break; </P> <p> case 2: life. tail = "tail"; </P> <p> life. gill = "Cheek"; </P> <p> life. body = ""; </P> <p> life. say = function () {alert (this. age + this. body + "-" + this. tail + "," + This. gill) };</P> <p> break; </P> <p> case 3: delete life. tail; </P> <p> Delete life. gill; </P> <p> life. legs = "Four Legs"; </P> <p> life. lung = "lung"; </P> <p> life. body = "frog"; </P> <p> life. say = function () {alert (this. age + this. body + "-" + this. legs + "," + this. lung) };</P> <p> break; </P> <p >}; </P> <p> life. say (); </P> <p >}; </P> <p> at the beginning, this JavaScript program generates a life object, life was born as a simple object without any attributes or methods. In its first life, it had a body attribute and a say method, which looked like an "egg ". In the second life process, it grew "tail" and "Cheek", with the tail and Gill attributes, apparently it was a "Cockroach ". In the third life process, its tail and Gill attributes disappear, but "Four Legs" and "lung" grow, with the legs and lung attributes, finally, it becomes a "frog ". If your imagination is rich, you may also turn it into a handsome "Prince" and marry a beautiful "princess" or something. However, after reading this program, consider the following question: </P> <p> do we need classes? </P> <p> Do you still remember the fairy tale "look for mom" from childhood? Maybe last night, your child just fell asleep in this beautiful fairy tale. In the process of its own type evolution, the cute little girl gradually becomes the same "class" as her mother, thus finding her mother. The programming philosophy contained in this fairy tale is that the "class" of an object is evolved from nothing to existence and eventually disappears into the invisible world... </P> <p> "class" helps us understand the complex real world, and the chaotic real world also needs to be classified. However, if our thinking is constrained by "Classes", "Classes" will become "tired ". Imagine if a life object is defined as a fixed "class" at the beginning, can it still evolve? Can the cockroach still become a frog? Can you tell the children the story of Xiao looking for his mother? </P> <p> therefore, there is no "class" in Javascript, and classes have been made invisible and integrated with objects. It is precisely because the concept of "class" is put down that JavaScript objects have no vitality in other programming languages. </P> <p> if you begin to feel something deep in your heart, you have gradually started to understand the Javascript Zen machine. </P> <p> function magic </P> <p> next, let's discuss the magic of JavaScript Functions. </P> <p> JavaScript code has only one function form, and function is the function type. Maybe other programming languages also have code concepts such as procedure or method, but there is only one function form in JavaScript. When we write the next function, we just create a function-type entity. See the following program: </P> <p> function myfunc () </P> <p >{</P> <p> alert ("hello "); </P> <p >}; </P> <p> alert (typeof (myfunc )); </P> <p> after the code is run, you can see that typeof (myfunc) returns the function. The above function syntax is called "definition". If we rewrite it into the following "variable", it will be easier to understand: </P> <p> var myfunc = function () </P> <p >{</P> <p> alert ("hello "); </P> <p >}; </P> <p> alert (typeof (myfunc); </P> <p> A variable myfunc is defined here, its initial value is assigned to a function entity. Therefore, typeof (myfunc) returns a function. In fact, the writing of these two functions is equivalent, except for a slight difference, the internal implementation is exactly the same. That is to say, the JavaScript Functions we write are just a named variable. The variable type is function, and the value of the variable is the code body of the function we compile. </P> <p> clever, you may immediately ask: since a function is just a variable, variables can be assigned randomly and used anywhere? <Br/> let's take a look at the following code: </P> <p> var myfunc = function () </P> <p >{</P> <p> alert ("hello"); </P> <p> }; </P> <p> myfunc (); // call myfunc for the first time and output Hello </P> <p> myfunc = function () </P> <p >{</P> <p> alert ("yeah"); </P> <p> }; </P> <p> myfunc (); // The second call to myfunc will output Yeah </P> <p> the program running result tells us: the answer is yes! After the function is called for the first time, the function variable is assigned a new function code body, so that different outputs appear when the function is called for the second time. </P> <p> well, let's change the code above to the first defined function form: </P> <p> function myfunc () </P> <p >{</P> <p> alert ("hello"); </P> <p> }; </P> <p> myfunc (); // call myfunc here to output Yeah instead of Hello </P> <p> function myfunc () </P> <p >{</P> <p> alert ("yeah"); </P> <p> }; </P> <p> myfunc (); // call myfunc here. Of course, yeah is output. </P> <p> it is reasonable to say that the two functions with identical signatures, it should be illegal in other programming languages. But in Javascript, that's right. However, after the program runs, it finds a strange phenomenon: both calls are only the value output in the last function! Obviously, the first function does not play any role. Why? </P> <p> originally, the Javascript execution engine did not analyze and execute programs one by one, but analyzed and executed programs one by one. In addition, during the analysis and execution of the same program, the defined function statements are extracted for priority execution. After the function definition is executed, other statement code is executed in order. That is to say, before myfunc is called for the first time, the Code logic defined by the first function statement has been overwritten by the second Function Definition Statement. Therefore, the last function logic is executed for both calls. </P> <p> if you divide the JavaScript code into two sections, for example, you can write them in an HTML file and use the <script/> label to divide the JavaScript code into two sections: </P> <p> <SCRIPT> </P> <p> function myfunc () </P> <p >{</P> <p> alert ("hello"); </P> <p> }; </P> <p> myfunc (); // call myfunc, output Hello </P> <p> </SCRIPT> </P> <p> <SCRIPT> </P> <p> function myfunc () </P> <p >{</P> <p> alert ("yeah"); </P> <p> }; </P> <p> myfunc (); // call myfunc here to output Yeah </P> <p> </SCRIPT> </P> <p> in this case, the output is in order, which proves that JavaScript is indeed executed in segments. </P> <p> the execution of defined function statements in a piece of code takes precedence. This seems like the concept of static language compilation. Therefore, this feature is also called "pre-compilation" of JavaScript ". </P> <p> in most cases, we do not need to tangle these details. As long as you remember, the code in Javascript is also a kind of data that can be assigned and modified at will, and its value is the logic of the Code. However, unlike general data, a function can be called for execution. </P> <p> however, if Javascript functions only have this line, this is a comparison with C ++ function pointers, Delphi method pointers, and C # delegation, what's so strange! However, the magic of JavaScript Functions is also reflected in two aspects: first, the function type itself has the ability to be object-oriented, and second, the ability to combine function functions with object detachment. </P> <p>