JS Getting Started

Source: Internet
Author: User
Tags true true

One.

Three ways to use JS
1HTML tag Embedded JS
<button onclick= "Javascrpt:alert (222222222)" >11111</button>
Use JS directly on the 2.HTML page

<script type= "Text/javascript" >

JS Code
</script>
3 referencing external JS files
<script language= "javascript" src= "path" ></script>
Precautions
1 page JS code and Reference JS code can be embedded in the page anywhere, but does not affect the JS code execution order
For example,:<script></script> in front of the body will be loaded before the page to execute the JS code;
2 page JS code using type= "Text/javascript"
External, use language= "JavaScript"
3 The <script></script> tag referencing the external JS file must appear in pairs and cannot have any code inside the tag

Two.

The variables in JS
The notation for variable declarations in 1JS: var width = 10;//functions declared with Var are valid only at the current function scope
Width1 = 11;//does not use Var, the direct assignment generates the variable, the default global change, the entire JS file is valid
var a,b,c=1; the same declaration statement declares multiple variables at the same time, and the variables are separated by commas, but the assignment needs to be assigned separately, as in the above style only C is assigned 1,a/b to undefine (undefined)
Note the VAR keyword is used for all type declarations in 1JS. The specific data type of the variable, depending on the execution of the assigned value to the variable
2 The same variable, you can modify the variable data type at multiple different assignments:
var width = 10;//as shaping variable
width= "haha";//width is changed to string type
3 variables can be declared with Var, or you can omit var. difference: No var is used, default is global variable
4 the same variable name can be declared multiple times with var. But there is no meaning and no error. The declaration after the second time is understood to be an assignment;
2 Variable Naming conventions:
1 variable names can only be composed of alphanumeric underscore $
2 cannot start with a number
3 variables are case-sensitive, uppercase and lowercase letters are different variables
3 The name of the variable names to conform to the hump rule:
The variable starts with lowercase, followed by the first letter of each word (or between the words, separated by underscores)
Jiaoyingcai√
Jiao _ying_cai√
Jiaoyingcaix
Data types of variables in 4JS
Undefine: Undefined, variable declared with VAR, no initialization assignment. var A;
Null:null, indicating empty drinking. var a = null;
Boolean: True or FALSE, optional value True/false
Number: A numeric type, which can be a decimal or an integer.
String: Type. Use "" or "wrapped content, called string
Object: Complex data type: function array, etc.
5 commonly used numeric functions:
1 IsNaN: Used to determine whether a variable or constant is Nan (non-numeric)
When judging with isNaN, the number () function is often used to convert, if it can be converted to numbers, it is not a non-numeric value, the result is false
"111" Pure numeric string, false "" "empty string, false" 1a "including other characters true
True/false Boolean type, False
2 Number (): Convert other types to numeric types
String type to Number
1 string is a pure numeric string and is converted to a number
2 string is empty string will be converted to 0
3 string contains other non-numeric characters, cannot be converted: "111a" NaN
4 Boolean Boolean-type-to-value null 0; Undefine NaN
5object Type to Value
Call the valueof function first to determine if the function has a return value, and then judge it according to the various conditions described above.
6parseint: Convert a string to a numeric type
Empty string, cannot go, result is Nan
Pure string can go "123" 123; " 23.4 "23; (when fractional conversion, erase the decimal point behind)
A string containing other characters. The numeric part before the first non-numeric character is intercepted. "123a1111" 123; " a1111 "NaN;
Parseint can only be converted to string type, boolean/null/undefined are Nan
7parsefloat: Convert a string to a numeric value
Used in the same way as parseint. But when converting a decimal string, keep the number behind the decimal point; Integer is preserved when converting an integer character
⑤typeof: Used to detect variable data types
->undefined string not defined, Sting True/false, Boolean
Value-Number Object/null-

Three. JS Output statement: Document.weite () Note: Anything other than the variable/constant must be printed in "", the variable/constant is placed in "" outer print is made up of multiple parts with + connected.

Pop-up window output: alert () using the same output statement

Pop-up window input: Prompt ("Please enter your name", "xxx");

* Two-part parameter: 1 The input box above the prompt information
* 2 The default information in the input box
* The two parts are separated by commas, and only a part of the default is the hint message;
* The default is to receive input content, which is the character
* You can define variables to accept input, such as var name = prompt ("Please enter your name", "Jiang Hao"); Click OK button, enter success; Click the Cancel button, name = NULL;

Four. Operator

1. Arithmetic operations
+ Plus, minus, * multiply,/divide,% withdraw, + + self-increment 、--self-reduction

+: There are two functions, link string/addition operation, when the + both sides are numbers, the addition operation, when the + side has any side as a string, string link, the result of the link is considered a string;
+ +: The increment operator, the variable is based on the original +1;
--: The self-decrement operator, the variable on the original basis-1;

"The similarities and differences between n++ and ++n"
n++: First Use the value of N to calculate, then put the n+1;
++n: First put the value of N +1, and then use n+1 after the value, to calculate;
The same point: whether n++ or ++n, after the execution of the code, will be n+1;
Eg:var a = 3;
var b,c;
b = a++ +2; A=3 b=5 a=4
c = ++a +2; A=4 a=5 c=7

2. Assignment operation
= Assignment, + = = *=/=%=

+ =: A + = 5, equivalent to a = a + 5; But the efficiency of the former is faster than that of the latter.

3. Relational operations
= = equals, = = = Strictly equals,! = is not equal to, >, <, >=, <=

= = = strictly equals; Type is different, return false; Type is the same, then make next judgment;
= = = equal to, same type, same as = = =, type different, try to convert both sides of the equation to a number, then judge;
Exception: null = = Undefined√null = = = Undefinedx

4. Conditional operator (multi-mesh operation)
A>b?true:false

There are two key symbols:? and:
When? When the previous part evaluates to True, execute: the preceding code;
When? When the previous part of the operation results in False, execute: the following code;

>>> multi-mesh operators can be nested in multiple layers:
For example: var Jieguo = num>5? " Input too big ":(num==5?" It's right! ":" Input is too small ");

5. Logical operators
&& and, | | Or! Non -


[Precedence of operators]
()
! ++ --
% / *
+ -
> < >= <=
== !=
&&
||
various assignments = + = *=/=%=

Five. The branching structure in JS

If-else Structure
1, Structure:
if (judging condition) {
//condition is true when executing
}else{
//condition is false when executing
}
2, if () expression, The result of the operation should be:
①boolean:true true False
②string: The non-empty string is a vacuum string false
③number:0 false Everything is not 0, are true
④null/nan/undefined: All False
⑤object: All True
3, else{} structure, can be omitted depending on the situation;
*/
var num = {};

if (num) {
//condition is true when
Document.Write is executed ("If condition is established");
} else{
//condition is false when
document.write ("If condition is not valid");
}
//Num<10?document.write ("If condition"):d ocument.write ("If condition is not established");



/* "Multiple if, ladder if"
1, structural notation:
if (condition one) {
//condition one established
} else if (condition two) {
//condition one not established && condition II established

//else-if section, can have more than n
} else{
/Condition one not established && condition two not established
}

2, multiple if structure, each judgment condition is mutually exclusive! Only one of the roads can be selected.

3, If/else {} can be omitted, but generally not advocated;
if you omit {}, the If/else struct contains only the most recent line (the semicolon ends);
If you omit {}, the else structure will always belong to the nearest if structure in front of it.

"Nested IF Structure"
1, the structure of the wording:
if (condition i) {
Condition One established
if (condition two) {
Condition I set up && Condition II also established
}else{
Condition One establishment && condition two not established
}
}else{
Condition one is not tenable
}

2, if structure can be multi-nesting, but in principle, not more than 3 layers
*/





/* "Switch-case structure"
1, the structure of the wording:
switch (expression) {
case constant Expression 1:
Statement 1;
Break
Case constant Expression 2:
Statement 2;
Break
......
Default
Statement n
Break
}
2. Precautions:
The expression in ①switch (), and the expression following each case, can be any of the data types supported by JS (objects and arrays do not work);
All constant expressions following the ②case must be different, otherwise only the first one will be executed;
The constants after ③case can be any data type; different case of the same switch structure can be many different data types;
④switch in the judgment of the time, the use of a congruent judgment = = =.
⑤break function: After executing the case code, jump out of the current switch structure;
The consequences of missing a break: Start with the correct case and execute all case and default in turn. Reason: ⑥↓
⑥switch structure When judging, will only judge the correct answer, when the correct case is encountered, will not judge the subsequent project. Execute in turn.
⑦switch structures are executed faster than multiple if structures. In a multi-channel branch, you can prioritize the use of the switch structure.

Six. Circulation ·

"Steps of the looping structure"
① declaring a loop variable
② Judging Cycle conditions
③ executing the loop body (all code in the while {}) operation
④ Updating loop variables
Then, the loop executes the ②③④

"Data types supported by loop conditions in JS"
①boolean:true true False False
②string: Non-empty string for vacuum string is False
③number:0 is false everything is not 0, are true
④null/nan/undefined: All is False
⑤object: All is True

While loop characteristics: First judge, then execute;
* Do-while cycle characteristics: First execution, then judgment; even if the initial conditions are not established, the Do-while cycle is executed at least once;

"For Loop"
1. For loop has three expressions: ① define cyclic variable ② judge loop condition ③ Update loop variable
Between three expressions, separated by;
For loop three expressions can be omitted, two, one is indispensable
2, for loop characteristics: First judge, then execute;
3, for loop three expressions, can have a multi-part, separated by commas; however, the second part of the judging condition needs to use && link, the final result needs to be true/False

JS Getting Started

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.