Basic JS and basic js tutorials

Basic JS and basic js tutorials
JavaScriptPart 1I. defines browser-based languages; Object-oriented; process-oriented C language; java object-oriented: inheritance, encapsulation, polymorphism; event-driven; scripting language; II. purpose: Form Verification to relieve pressure on the server; add page animation effects; dynamically change page content; AJax network requests; 3. components: ECMAScript; scripting language, language standard ES5.1, latest ES6.0; Syntax, variables and data types, DOM; Document Object Model; document node BOM browser object model window: history, doucument, location 4. basic javaScript structure: <script type = "text/javascript"> javascript statements </script> 5. three methods of using JS: 1. embedded JS in HTML tags; (not recommended) 2. use JS directly on the HTML page. <script type = "text/javascript"> javascript statement </script> 3. reference external JS files. <script language = "JavaScript" src = ""> </script>[Note]1. javaScript code and reference JS Code on the page can be embedded in any location of HTML, but different locations will affect the execution sequence of JS Code. For example: <script> before the body, the JS Code will be executed before the page is loaded; 2. JS Code in the page, using type = "text/javascript"; 3. reference an external JS file and use the language = "JavaScript"; the <script> tag that references the external JS file must appear in pairs and the tag cannot contain any code; single line comment ctrl +/Paragraph comment ctrl + shift +/6. statement of declaring variables in JS: 1. written in the following way: var width = 10; // the variable that uses the var life is valid only in the current function scope; width = 11; // The variable generated without the var direct value assignment, the default value is a global variable. The entire JS condition is valid. var a, B, c = 1. Multiple variables are declared at the same time. variables are separated by English letters. However, values must be assigned for copying, for example, in the above formula, only c = 1, B: undefined; 2. naming rules for variables: letters, numbers, underscores (_), and underscores ($); case-sensitive; uppercase and lowercase letters: different variables; 3. the variable name must comply with the hump rule: the variable starts with lowercase, and then each initial letter (separated by an underscore), for example, jiang_hao_shi_shuai_ge jianghaoshisw.ige 4. the data type of the variable in JS: undefined. The variable declared with var is not initialized and assigned a value; Null: indicates a Null reference; number; Boolean: true or false, which can be a decimal number, it can also be an integer; String: The content wrapped with "" or ''is a String; object :( complex data type: function, array) 5. common numeric functions: ① isNaN (): used to determine whether a variable or constant is NaN (non-numeric ). When isNaN is used to determine whether to use the number () function for conversion. If it can be converted to a number, it is not a non-numeric value and the result is false; "111" is a pure numeric string, false "" empty string, false "la" contains other characters, true/false boolean type, false ② number (): convert other types to numeric types [string type to numeric type] ①. when the string is a pure numeric string, it is converted to the corresponding number "111" --> 111; ② when the string is a null string, it is converted to 0, "--> 0; ③ When a string contains other non-numeric characters, it cannot be converted. "111a" --> NaN; [boolean type to numerical value] true-> 1; fulse-> 0; [Null/undefined special values] Null-> 0, undefined-> NaN; [convert the object type to a value] (later) Call the valueof function to determine whether the function has returned values, based on the above situations, the parseInt converts the string Change to a value. the Null String cannot be converted and the result is NaN; ""-> NaN; ②. only digits can be converted. decimal points are removed; 123-> 123; 123.45-> 123; ③. contains other characters. The part before the first non-numeric character is truncated. "123a456"-> 123; "a123a234"-> NaN; ④. parseInt can only be converted to the string type: Boolean/null/undefined are all NaN; parseFloat: converts the string to a value. The usage is the same as that of parseInt, but the decimal point is reserved when the decimal point is converted; reserved integer when converting; 123.5-> 123.5; 123-> 123; typeof variable data type undefined-> undefined string-> string; true/false-> boolean; value-> number; object/null-> object; function-> function; [Considerations for declaring variables]: 1. all variable type declarations in JS use the var keyword. The specific data type of the variable depends on the execution of the value assignment to the variable; 2. when the same variable can be assigned different values, modify the variable's data type var width = 10; the variable is an integer; width = "Haha"; the variable is changed to a string; 3 the variable can be declared using var, it can also be omitted; [difference] whether it is a global variable; 4. the same variable name can be declared with var multiple times, but it does not have any meaning and no error is reported. The declaration after the second time will only be understood as the output statement * document in the value assignment JS. write (): the output statement prints the content in the write statement on the browser screen. * [note when using]: content other than variables and constants must be placed in "" When printing; variable constants must be placed out of "". * When the printed content is composed of multiple parts, + links are used before. * For example: document. write ("cards in the left hand:" + left + "<br/> ")Part 2I. arithmetic Operations: + addition,-subtraction, * multiplication,/division, % remainder, ++ auto-increment, and -- auto-subtraction +, the link string/addition operation. When both sides of the plus sign are numbers, the addition operation is performed. When either side has a string, the connected string will still return a string ;/: the result is as much as possible. %: returns the remainder. + +: the auto-incrementing operator. The variable is plus 1 on the basis of the original variable; --: Likewise; =: Value assignment; + =: a + = 5 --> a = a + 5;-=: a-= 5 --> a = A-5; the former execution efficiency is fast; 2, [relational operation ]: ==,==! =,>, <, >=, <=: Equal to; same type, same =, different types. If the types on both sides of the equation are different, use number () convert to numeric type. when determining whether null = undefined is true, null = undefined is not true === strictly equal to; if the type is different, false is returned directly, and the type is the same, in the next step, determine. Conditional operators (multi-object operations): a> B? True: false when? If the preceding operation returns true, run the following code: When? When the preceding calculation result is false, run the following code. Multiple layers can be nested. For example, var jiegao = num> 5? "Big" :( num = 5? "Incorrect": "small"); [operator priority ]()! ++ -- */% +-> <<=>==! = & | Various values: = + =/= * =Part 3I. [if-else] Syntax: if (Judgment condition) {// execution when the condition is true;} else {// execution when the condition is false;} expression in if, the operation result should be changed to: Boolean: true false String, non-Null String is true, empty String is false, Null/NaN/Undefined: All false, Object: all true; the else {} structure can be omitted based on actual conditions. [multi-layer if, step if] 1. Structure: if (condition 1) {condition 1 is true} else if (condition 2) {condition 1 is not true & condition 2 is true (else if can have multiple)} else {condition 1 is not true & condition 2 is not true} 2. In the multi-if structure, each judgment condition is mutually exclusive and only one path can be selected; 3. if-else's {} can be omitted, but it is not recommended. if it is omitted, the Code contained in the if/else structure is only the last line (the end of the Branch). if {} is omitted, the else structure will always belong to the nearest if structure. [nested if structure] 1. Syntax: if (condition 1) {condition 1 is true if (condition 2) {condition 1 is true, condition 2 is also true} else {condition 1 is not true} 4. [switch branch structure] 1. syntax: switch (expression) {case constant expression 1: Statement 1; break; case constant expression 2: Statement 2; break; defalt: Statement; break;} [note ]: ① The expression in switch () and the expression behind each case (the object and array cannot work) can be any data type supported by js; ② All constant expressions after case must be different; otherwise, only the first constant is executed; ③ constants after case can be of any data type, different cases of the same switch structure can be different data; ④ When determining the switch structure, the use of full-level judgment ==; ⑤ The role of break: after the case code is executed, the current switch structure exists. If the break is missing, all the case and defalt 6 switch structures are executed in sequence from the correct case items, only one correct answer is judged. When a correct case item is met, the subsequent case item is not judged. The switch structure is executed at a faster speed than multiple if structures. When multiple branches, the switch structure can be prioritized;V. Loop StructureSteps of the Loop Structure: 1 declare the loop variable 2 judge the loop Condition 3 execute the loop body (while {}) operation 4 update the loop variable and then execute the loop 2, 3, 4 [supported data types in the Loop Structure in js] Boolean: true false; String, non-empty String true, empty String false; number (): 0 false, all non-zero values are true Null/NaN/Undefined: All values are false; Object: All values are true; while loop features: first judgment, execution; do-while: limited execution, then judgment, even if the initial condition is not true, the do-while loop executes a [for Loop] at least once: the first judgment and then the execution of three expressions can be composed of multiple parts, consisting of commas, however, the judgment conditions in the second part need to be connected with &, and the final conditions need to be true/false. for (expression 1, expression 2, expression 3) {statement;} 1, define loop variable; 2. judge the cyclic condition. 3. Update the cyclic variable. The three expressions can be omitted, but two expressions are not saved. For example: