Basic concepts
javascript是一门解释型的语言，浏览器充当解释器。js执行引擎并不是一行一行的执行，而是一段一段的分析执行。Delay scripts
The defer attribute is defined in HTML4.0.1, which is used to indicate that the script will not affect the construction of the page when it is executed. In other words, the script will be delayed until the entire page has been parsed before execution. Therefore, setting the defer attribute in the <script> element is equivalent to telling the browser to download immediately, but delaying execution. In XHTML documents, set the defer attribute to defer=“defer"
Asynchronous scripts
html5 defines the async attribute for <script>. The entire property is similar to the defer property and is used to change the behavior of processing scripts. Similarly, similar to defer, async only works with external script files and tells the browser to download the file immediately. But unlike defer, scripts marked as async do not guarantee execution in the order in which they are specified.
The purpose of specifying async is to prevent the page from waiting for the script file to be downloaded and executed, thereby loading other contents of the page asynchronously. Therefore, it is recommended that asynchronous scripts do not operate DOM during loading
case sensitive
Everything in ECMASCript (including variables, function names, and operators) is case sensitive.
1. JScript variables
Variables are set in memory when they are first used, so they are later referenced in scripts. Declare it before using variables. Variable declarations can be used using the var keyword.
var count, amount, level; // 用单个var 关键字声明的多个声明。
Variable naming
Variable names include global variables, local variables, class variables, function parameters, etc. They all fall into this category.
Variable naming is composed of type prefix + meaningful words, and the readability of variables and functions is increased by camel nomenclature. For example: sUserName, nCount.
Prefix specification:
Each local variable needs to have a type prefix, which can be divided into:
s: represents a string. For example: sName, sHtml; n: represents a number. For example: nPage, nTotal; b: represents logic. For example: bChecked, bHasLogin; a: represents an array. For example: aList, aGroup; r: represents a regular expression. For example: rDomain, rEmail; f: represents a function. For example: fGetHtml, fInit; o: represents other objects not mentioned above, such as: oButton, oDate; g: represents global variables, such as: gUserName, gLoginTime;
JScript is a case-sensitive language. Creating a legitimate variable name should follow the following rules:
Note that the first character cannot be a number.
You can follow any letter or number and underscore, but not spaces
The variable name must not be a reserved word.
javascript is a weakly typed language, and JavaScript ignores unnecessary spaces. You can add spaces to the script to improve its readability.
var is a reserved word for javascript , indicating that the following is the variable description, the variable name is a user-defined identifier, and the variables are separated by commas.
If a variable is declared but no value is assigned to it, the variable exists and its value is the Jscript value undefined.
Force type conversion
In Jscript, operations can be performed on different types of values without worrying about exceptions from the JScript interpreter. Instead, the JScript interpreter automatically changes (casts) one of the data types to another data type and then performs the operation. For example:
The calculation result value is added to the string and the cast value into a string. Adding the boolean value to the string casts the boolean value to a string. Adding the numeric value to the Boolean value casts the Boolean value to a numeric value.
To explicitly convert a string to an integer, use parseInt method. To explicitly convert a string to a number, use parseFloat method.
Lifetime of JavaScript variables: When you declare a variable within a function, you can only access the variable in that function. When exiting the function, this variable will be revoked. This variable is called a local variable. You can use local variables with the same name in different functions, because only functions that declared variables can recognize each variable.
If you declare a variable outside of a function, all functions on the page can access the variable. The lifetime of these variables starts after they are declared and ends when the page is closed.
js variable mind map
2.js data type
jscript has three types -> main data types, two -> composite data types and two -> special data types.
Main (basic) data types
字符串数值布尔Composite (reference) data type
对象数组Special data types
Null`Undefined`String data type: String data type is used to represent text in JScript. In js, while both double quotes ("") and single quotes ('') can represent strings, they have almost no difference. But using only double quotes ("") to indicate a string is considered the best.
A string value is a string of zeros or more Unicode characters (letters, numbers, and punctuation marks) arranged together.
What is Unicode?
Unicode provides unique values for each character, regardless of platform, program or language. Unicode is developed to provide a unified encoding for processing all characters that exist in the world.
Numerical data type
We need to understand that JScript internally represents all values as floating point values, so there is no difference between integers and floating point values in JScript.
Boolean data type
Boolean (logical) can only have two values: true or false.
js arrays and objects
For details, please see my article -> JavaScript Learning Summary - Array and Object Part
Null Data Type: You can clear the content of a variable by assigning a null value to a variable.
typeof operator in Jscript will report the null value as Object type, not type null .
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en"><head> <meta http-equiv="Content-Type" content="text/html;charset=UTF-8" /> <title></title> <script type="text/javascript"> alert(typeof null); </script></head><body></body></html>
null is used to represent an object that has not existed yet, and is often used to represent a function that attempts to return an object that does not exist.
Undefined data type:
The undefined value will be returned in the following situation:
对象属性不存在，声明了变量但从未赋值。Difference between null and undefined
alert(typeof undefined); //output "undefined" alert(typeof null); //output "object" alert(null == undefined); //output "true"
ECMAScript believes that undefined is derived from null, so they are defined as equal.
alert(null === undefined); //output "false" alert(typeof null == typeof undefined); //output "false"
null and undefined are different in types, so output "false". And === means absolute equality, here null === undefined output false
In addition, here is a more important data type - reference data type
Reference data type
JavaScript reference data type is an object stored in heap memory. JavaScript does not allow direct access to the location and operation of the heap memory space. It can only operate the reference address of the object in the stack memory. So the reference type data is actually stored in the stack memory as the reference address of the object in the heap memory. This reference address allows you to quickly find objects stored in heap memory.
Let's demonstrate the process of assigning reference data types
Of course, adding a name attribute to obj2 is actually adding a name attribute to the objects in heap memory. Obj2 and obj1 save only the reference address of the heap memory object in the stack memory. Although they are also copied, the object pointed to is the same. Therefore, changing obj2 causes the change of obj1.
Basic type values refer to simple data segments stored in the stack memory, i.e., a location where such values are stored completely in memory.
The reference type value refers to those objects stored in heap memory, that is, the variable is actually just a pointer, which points to another location in memory, where the object is saved.
In short, the heap memory stores reference values, and the stack memory stores fixed type values.
In ECMAScript , variables can have two types of values, namely the original value and the reference value.
A simple segment of data where the original values are stored in the stack , that is, their values are stored directly at the location where the variable is accessed. The referenced object stored in the heap ( heap ), that is, the value stored at the variable is a pointer ( point ) pointing to the memory where the object is stored.
<script type="text/javascript">var box = new Object(); //Create a reference type var box = "lee"; //The basic type value is the string box.age = 23; //It is weird to add attributes to basic type values, because only objects can add attributes. alert(box.age); //It is not a reference type, and cannot be output;</script>
3.JScript operators
Priority: refers to the order of operations of operators. In layman's terms, it is to calculate which part of the operation first.
Combination: The calculation order of the same priority operator, in layman's terms, is it from which direction to calculate, whether it is left to right or right to left.
Data type conversion
String() to string type
Number() converts to numeric type
Boolean() to Boolean type
parseInt : Converts a string to an integer. Start parsing from the beginning of the string, stop parsing at the first non-integer position, and return all integers read before. If the string does not start with an integer, NaN will be returned. For example: the value returned by parseInt ("150 hi") is: 150, and the value returned by parseInt ("hi") is: NaN.
parseFloat : Converts a string to a floating point number. Start parsing from the beginning of the string, stop parsing at the first non-integer position, and return all integers read before. If the string does not start with an integer, NaN will be returned. For example: parseFloat("15.5 hi") 返回的值是：15.5，parseFloat("hi 15.5")返回的值是：NaN。
eval：将字符串作为javascript表达式进行计算，并返回执行结果，如果没有结果则返回undefined。4.js process control
For js process control statements, here are only a few difficult to understand. I won't go into details about the others. A mind map is attached below.
1. The for...in statement executes one or more statements corresponding to each of an object, or each element of an array.
for (variable in [object | array]) statements
parameter:
variable : a required option. A variable that can be either attribute of an object or any element of an array.
object , array : optional. The object or array to traverse on it.
statement : optional. One or more statements to be executed relative to each property of an object or each element of an array. It can be a compound statement.
Although conditional control statements (such as if statements) require the use of code blocks only when multiple statements are executed (starting at the left brace "{" and ending at the right brace "}"), the best practice is to always use code blocks.
if(args) alert(args);//Easy to errors if(args){ alert(args);//Recommended to use}JS process control statement mind map
5.js function
A function is a reusable block of code that is driven by an event or executed when it is called.
Jscript supports two functions: one is a function inside the language, and the other is created by itself.
JavaScript functions allow no parameters (but brackets containing parameters cannot be omitted), and parameters can be passed to functions for use by functions.
For more information about functions, please visit another article of my article: A summary of JavaScript learning (IV) Function function part
Composition of objects
Method - Function: Procedure, Dynamic Properties - Variables: State, Static
Finally, a mind map summarized by the seniors: