Section III JS

A: JS introduction:

1, the introduction of JS:

• HTML: Describing the structure of a page from a semantic perspective

• CSS: From an aesthetic perspective, describe the style (beautify the page)

• JavaScript: Describing behavior from an interactive perspective (improving the user experience)

2, the composition of JS:

• The grammatical standard of ecmascript:javascript. Includes variables, expressions, operators, functions, if statements, for statements, and so on.

• DOM: An API that operates on elements on a Web page . For example, let the box move, color change, Carousel diagram and so on.

• BOM: An API for manipulating browser-part functionality . For example, let the browser automatically scroll.

3. Features:

(1) Easy to use: can be written with any text editing tools, only the browser can execute the program.

(2) Interpretation Execution ( interpretation language ): Do not compile, line-by-row execution, without strict variable declaration.

(3) Object-based: Built in a large number of ready-made objects, writing a small number of programs can accomplish goals

4, the structure of JS:

<script type= "Text/javascript" ></script>
Can be placed anywhere in the HTML

1. Alert pops up "warning box"

2 console.log("") . Indicates output in console. Console indicates "console", and log indicates "output".

5. Grammar rules:

(1) JavaScript is not sensitive to line, indent, and space.

Note: Each statement ends with a semicolon, although the semicolon is not mandatory, but for the program to be compressed in the future, if not semicolon, after compression will not run.

(2) All the symbols are in English. such as parentheses , quotation marks, semicolons.

(3) JavaScript comments:

Single-line Comment:

I'm a note.

Multi-line Comments:

/* Multiline    Comment 1 multiline    comment 2*/

Note: In sublime, the shortcut key for a single-line comment is ctrl+/ that the shortcut key for a multiline comment is ctrl+shift+/ .

6. User input: Prompt () statement

<script type="text/javascript">        var a = prompt (' What's the weather today?  ');        Console.log (a); </script>

7. Direct Volume: Numbers and strings

A "direct quantity" is a constant , also known as a literal. See what, it is what.

There are 2 simple direct quantities: numbers, strings.

8. Variables

• Define variables: var is a keyword used to define variables. The so-called keyword, is a special function of the small words. The keyword must be separated by a space.

• Assignment of a variable: the equals sign assigns the value to the right of the equal sign to the left variable.

• Variable name: we can give the variable any name.

• correct wording:   var A;   // definition    ;  // Assign Value    Console.log (a);  // Output experienced programmers will write definitions and assignments together: var ;    // defined, and assigned a value ofconsole.log (a);  // Output

9. Variable Type:

1. Numeric Type: number

2. String Type: String

3, typeof () view the type of file

4, Hyphenation Fuhai difference:

Console.log (" i " " love " " you ");   // Hyphen, put three separate characters, connected together    Console.log (" i + love + you ");           // Output as-is     Console.log (1+2+3);             // Output 6 Summary: If both sides of the plus sign are numeric, this is a plus. Otherwise, it is a hyphen (used to concatenate strings).

10, the value of the variable:

statement:    = B; Assigns the value of B to a A, a. Assigns the value to the right of the equal sign to the left variable, the variable to the right of the equal sign, and the value unchanged.        give a special example:var"3";         var 2 ;        Console.log (a--numeric = numeric)

11. Variable Format conversion:

　　parseInt(): String to Number

 parseint () to convert a string to a number. Parse represents "transform", and int denotes "integer" (note the spelling of int). Example: String to number method: parseint (" 5   1    " 2018 you are so handsome!!   "   2   var  a = parseint (5.8 ) + parseint ( Span style= "COLOR: #800080" >4.7   var  a = parseint (5.8  + 4.7  ); Console.log (a);  

12. Data type:

1. Basic Data type: Number/string/boolean/null/undefind

Number Copy CodevarA =123;//typeof Check what data type the current variable isConsole.log (typeofa)//Special CasesvarA1 =5/0; Console.log (typeofE1)//Infinity infinitely large. Number TypeCopy Codestringvarstr ='123'Console.log (typeofstr) BooleanvarB1 =false; Console.log (typeofB1)NULLvarC1 =NULL;//empty objects. ObjectConsole.log (C1) undefinedvarD1;//indicates that the variable is not definedConsole.log (typeofD1)

underlying data type

2. Reference data type:

• Function
• Object
• Arrray
• String
• Date

13. Operators:

1. Assignment operators:

　　　　

2. Arithmetic operators

　　　　

3. Comparison operators

　　　　

4. Special Circumstances:

string concatenation + string operation special case. Python has a more convenient way to splice strings, in fact, in JS also have, we can Baidu engine search Es6 template string. Extension

var  firstName  = ' small '; var lastName = ' brother Ma '; var name = ' Iraq '; var = ' US Army ';//string concatenation var str = "March 20, 2003," +name+ "war broke out, The American-dominated coalition forces defeated Saddam Hussein's army in just more than 20 days. This is another massive and overwhelming military victory in the "+am+" following the Gulf War more than 10 years ago. "var fullstr = Str;console.log (fullstr) var fullName = FirstName +" "+ Lastname;console.log (fullName)

You cannot perform a + operation on a string only by stitching var a1 = ' 1 '; var a2 = ' 2 '; Console.log (A1-A2)//12

var B1 = ' one '; var b2  = ' B ';//NaN. = = = = Number is number type Console.log (typeof (B1*B2))

14. Data type conversion:

1. Converting a numeric type to a string type

Implicit conversions

var n1 = 123;var N2 = ' 123 '; var n3 = n1+n2;//Implicit conversion console.log (typeof N3);

Forcing type conversions

Force type conversion string (), toString () var str1 = String (n1), Console.log (typeof str1), var num = 234;console.log (num.tostring ())

2. Converting a string type to a numeric type

var  ' 789.123WADJHKD ' ; var num2 = number  (stringnum), Console.log (num2)//  parseint () can parse a string and returns an integer console.log (parseint (Stringnum)) Console.log (parsefloat (Stringnum));

3. Any data type can be converted to a Boolean type

var ' 123 ' ; var 0 ; var b3 =-123var b4 =var b5 = NaN; var // undefined var NULL ; // non-0 true console.log (Boolean (B7))

6. Process Control

1.if, If-else, If-else if-else

2. Logic and &&, logic or | |

3.switch

4.while Cycle

5.do_while

6.for Cycle

Double-FO cycle

Note: http://www.cnblogs.com/majj/p/9095485.html refer to this page

15. Common built-in objects:

1. Array:

1. How arrays are created

• The literal way to create (recommend that you use this way, simple rough)

var colors = [' red ', ' color ', ' yellow '];

• Create an object using the New keyword to create the constructor using the constructor (which is spoken later)

  var colors2 = new Array ();

2. Assigning values to arrays

var arr = [];//one by one assignment by subscript arr[0] = 123;arr[1] = ' hahaha '; arr[2] = ' hehe hey '

3. Common methods of arrays

Specific methods of use refer to: http://www.cnblogs.com/majj/p/9095590.html

2 . Method of String

3 Date

Create Date object only constructor one way, use the New keyword

Created a Date object var mydate = new Date ();

// Create Date Object var mydate=New  Date ();         // get a day in one months Console.log (Mydate.getdate ()); // returns the local time Console.log (MyDate (). tolocalstring ()); // 2018/5/27 pm 10:36:23/

4. Math built-in objects

6.1 Math.ceil () rounding up, ' ceiling function '

var x = 1.234;//The Ceiling function represents a value  greater than or equal to X, and the integer closest to it is 2var a = Math.ceil (x); Console.log (a);//2

6.2 Math.floor down rounding, ' floor function '

var x = 1.234;//is less than or equal to X, and the nearest integer to it is 1var B = Math.floor (x); Console.log (b);//1

6.3 Maximum and minimum values for two numbers

The minimum value of the maximum value of two numbers Console.log (Math.max (2,5));//5console.log (Math.min (2,5));//2

6.4 Random number Math.random ()

var ran = Math.random (); Console.log (ran); [0,1]

What do you do if you take a random number between 100-200?

Back over formula: Random number between Min-max: Min+math.random () * (max-min)

16. Functions

Function: is to encapsulate some statements, and then execute them in the form of calls .

Role of the function:

• Write a large number of repeated statements in the function, and later when you need these statements, you can call the function directly, avoid duplication of work.

• Simplify programming and make programming modular.

Console.log ("helloWorld");    SayHello ();      // calling functions     // To define a function:     function SayHello () {        console.log ("hello");        Console.log ("helloWorld");    }

First step: definition of function

Syntax for function definitions:

Function name () {    }

The explanations are as follows:

• Function: is a keyword. Chinese is "function", "function".

• Function name: The naming convention is the same as the naming of variables. Can only be letters, numbers, underscores, dollar signs, and cannot start with a number.

• Parameters: There is a pair of parentheses behind, which is used for parameters.

• Inside the curly braces is the statement of this function.

Step Two: Call the function

Syntax for function calls:

function name ();

Parameters of the function: formal parameters and arguments

Parameters of a function include formal and actual arguments

Note: The number of actual and formal parameters should be the same.

Example:

        sum (3,4);        SUM ("3", 4);        SUM ("Hello", "World");        Functions: Sum function        sum (A, b) {            Console.log (a + b);        }

return value of the function

Example:

       Console.log (SUM (3, 4));        Functions: Sum function        sum (A, b) {            return a + b;        }

17. Pseudo-Array arguments

Arguments represents the actual argument. There is a particular place to be: arguments is only used in functions .

(1) Number of return function arguments : arguments.length

FN (2,4);
FN (2,4,6);
FN (2,4,6,8);


function fn (a,b,c,d) {
    Console.log (arguments);
    Console.log (fn.length);         Get the number of formal parameters
    Console.log (arguments.length);  Get the number of arguments

    Console.log ("----------------");
}

Results:

(2) The reason is that arguments is a pseudo-array, because:arguments can modify the element, but cannot change the length of the array . Example:

    FN (2,4);    FN (2,4,6);    FN (2,4,6,8);    function fn (A, b) {        arguments[0] =;  Change the first number of arguments to        Arguments.push (8);  This method does not pass because the element cannot be incremented    }

There are several ways to empty an array:

   var array = [1,2,3,4,5,6];    Array.splice (0);      Method 1: Delete all items in the array    array.length = 0;     The 1:length property can be assigned a value, in other languages length is read-only    array = [];           Way 3: Recommended

Section III JS