JavaScript
concept: a client-side scripting language.
Runs in the client browser. Every browser has a JavaScript parsing engine.
Scripting language: It can be parsed and executed directly by the browser without compiling.
Function: It can enhance the interaction between the user and the html page, and can control the html element to make the page dynamic. effect to enhance the user experience.
JavaScript development history:
1. In 1992, Nombase Company developed the first client-side scripting language, which was specially used for form verification. Named: C–. Later renamed ScriptEase.
2. In 1995, Netscape developed a client-side scripting language: LiveScript. Later, experts from SUN Company were invited to modify the LiveScript and named it JavaScript.
3. In 1996, Microsoft copied JavaScript to develop the JScript language.
4. In 1997, ECMA (European Computer Manufacturers Association), ECMAScript, said the standard for all client-side scripting languages.
JavaScript = ECMAScript + JavaScript's own unique things (BOM + DOM)
ECMAScript: The Standard for Client-Side Scripting Languages
1.1. Basic grammar
1. Combining with html
– internal js: define <script>, the content of the tag body is js code
– external js: define <script>, import external js file through src attribute
Note: <script> can be defined in any html page place. But the location of the definition affects the execution order. <script> can define multiple
2. Comments
– single-line comments: // comment content
– multi-line comments: / comment content /
3. Data type
– primitive data type:
number: number. Integer/Decimal/NaN(not a number)
string: String. String "abc" "a" 'a'
boolean: true and false
null: a placeholder for an empty object
undefined: undefined. If a variable is not given an initialization value, it will be assigned to undefined by default
– reference data type: object
4, variable
variable: a small memory space to store data
Java language is a strongly typed language, while JavaScript is a weakly typed language.
Strong type: When opening up variable storage space, it defines the data type of the data stored in the space in the future. Only fixed types of data can be stored.
Weak type: When opening up variable storage space, the future storage data type of the space is not defined, and any type of data can be stored.
Syntax: var variable name = variable value;
document.write(); print data on the page
typeof(variable name); find data type
5, operator
– unary operator: operator with only one operand
++ – + (positive sign)
– arithmetic operator + – * / % …
– assignment operator = += -= …
– comparison operator > < <= >= == === (all equal)
– logical operator! || &&
– Ternary operator? :
6. Flow control statement
withch while for do…while if…else…
7. Special syntax
The statement ends with ;. If there is only one statement in a line, ; can omit (not recommended)
the definition of variables and use the var keyword, or not use; use: the defined variable is a local variable
not used: the defined variable is a global variable (not recommended)
Case: Ninety-nine multiplication table
<style type="text/css">
td{
border:1px solid;
}
</style>
<script type="text/javascript">
document.write("<table align = 'center'>");
for(var i = 1; i<=9 ; i++){
document.write("<tr>");
for(var j = 1; j <= i;j++){
document.write("<td>");
document.write(j +"*" + i + "=" + i*j);
document.write("</td>");
}
document.write("</tr>");
}
document.write("</table>");
</script>
1.2, the basic object
1. Function: function (method) object
– create: var fun = new Function (formal parameter list, method body);
function method name (formal parameter list) { method body } var method name = function (formal parameter) { method body } – method – attribute: length: represents the number of formal parameters – feature: when the method is defined, the type of the formal parameter does not need to be written . The method is an object. If a method with the same name is defined, it will be overwritten in js. The name of the method has nothing to do with the parameter list. There is a hidden built-in object (array) in the method declaration, arguments, which encapsulate all the actual parameters - call: method name (actual parameter list); 2. Array: array object - create: var arr = new Array(list of elements); var arr = new Array(default length); var arr = [list of elements]; – method: join(parameters): put all elements in the array into a string. Elements are split by the specified delimiter. push(): Adds one or more elements to the end of the array and returns the new length. – Attribute: length: Length of the array – Features: In js, the type of array elements is variable. The length of the array in js is variable.
3. Boolean
4. Date
– Create: var date = new Date(); – Method: toLocaleString(): Return the time locale string format
corresponding to the current date object getTime(); Get the millisecond value.
5. Math
– Features: Math objects do not need to be created, they can be used directly. Math.method name();
– method: random(): returns a random number between 0-1, including 0 but not 1
ceil(x); rounds up the log
floor(x): rounds down the log round(x): Rounds
the number to the nearest whole number.
– Attribute: PI
6, RegExp: Regular expression object
Regular expression: Define the composition rules of strings.
– A single character: [] such as: [a] [ab]a or b [az] a to z
special match a single character representing a special meaning: \d: a single digit character \w: a single word character
– quantifier symbol: ? : Indicates 0 or 1 occurrences *: Indicates 0 or more
occurrences +: Indicates 1 or more occurrences {m, n}: Indicates m <= number <= n
– start accepting matches ^: start ￥: end
– Create: var reg = new RegExp(“regular expression”);
var reg = /regex/;
– Method: text(parameter): Verify that the specified string conforms to the specification of the regular definition
7. Global
– Features: Global object, the method encapsulated in this Global can be used directly without an object
– method: encodeURI(): url encoding
docodeURL(): url decoding
encodeURIComponent(): url encoding, more encoded characters
docodeURLComponent (): url decoding
parseInt(): Convert the string to a number
isNAN(): Determine whether it is NAN
eval(): Speak the js string and execute it as script code.