Home > Developer > Web Develop
JS is a scripting language that can be used in combination with HTML markup language, and its programs can be written directly in the browser to interpret execution.
First, the compositionJS is a scripting language designed specifically for Web page interaction. Consists of three parts:
1.ECMAScript (ECMA-262 definition), providing core language features
2. Document Object Model (DOM), which provides methods and interfaces for accessing and manipulating Web page content
3. Browser object Model (BOM), which provides methods and interfaces for interacting with the browser
Second, how to useThe script in the HTML must be between the <script> and </script> tags.
The script can be placed in the <body> or
Inline mode:
<script>
Alert ("My first JavaScript");
</script>
Use external file mode:
<script src= "Myscript.js" ></script>
Description
Previously needed to include the type attribute in script: <script type= "Text/javascript" >
It is not necessary to do so now.
JavaScript is the default scripting language in all modern browsers.
Additional notes:
HTML 4.01 defines 6 properties for <script>
Type--Represents the content type, which defaults to Text/javascript
SRC--source address, can cross domain
Async--Not guaranteed to execute sequentially
Defer--Download now, defer execution, sequentially
CharSet--most browsers are ignored and seldom used
Language--Abandoned
Iii. Explanation of grammarMostly similar to C #, there are a few points.
1. Declare the variable. JavaScript is a weakly typed scripting language that declares variables directly with Var, and variable names are case-sensitive.
VAR message;
Uninitialized variables like this will save a special value, undefined.
var message= "HI";
Initializing a variable like this does not mark it as a string type.
The process of initializing is simply assigning a value to a variable.
Therefore, you can modify the value's type while modifying the measure, for example
var message= "HI";
message = 100; Valid but not recommended
Description
Variables can be declared without the Var keyword, which becomes a global variable, and it is recommended to always use Var.
Global variables:
A variable declared outside the method;
Inside the method, there are no variables declared with the VAR keyword.
Local variables:
Inside the method, variables declared with Var
2. By convention, the marker is in hump format
3. Notes: Single-line and block-level
Description: Block-level comments in the middle of the * non-mandatory, recommended addition, improve readability.
4. Statements
To End. Best practice: Always use code blocks in control statements to improve readability.
Basic concept data typesIn ECMAScript, data types include 5 basic types and 1 complex types.
Base data type: Number, Boolean, String, Undefined, Null
Number includes: Integers and decimals (highest precision 17 decimal places), NaN, Infinity,-infinity
Attention:
For number,
1. In addition to the 10 binary, it can also be expressed in 8 and 16 binary literals,
If 070 means 56, 0xA means 10.
2. Decimal is a floating-point type, if (0.1+0.2 = = 0.3)//Do not do such a test, because the highest precision floating point value is 17 bits, is 0.300000000000000004
Description of the other two special basic types
Undefined: Represents a variable declaration but is not assigned a value.
Null: Represents an empty object reference (that is, the assignment is null)
Complex data Type-Object, this follow-up article is specifically re-introduced.
typeof operatorWhen you view a type, you often use the typeof operator, such as typeof (10), to return the number type.
Full list of returns
return value |
Description |
Undefined |
Not defined |
Boolean |
Boolean value |
String |
String |
Number |
Numerical |
Object |
object or null |
function |
Function |
Description
1. Note that there is a special: typeof (NULL) returns an object
From a logical point of view, a null value represents an empty object pointer, so typeof returns an object
2. Undefined type has only one value, i.e. undefined
Declaration not defined is not the same as an undeclared variable
A variable that has not been declared can only perform one operation, even if a typeof detects its type
Theoretical practiceFollow me to do the experiment below.
Basic typeThere are a total of the following.
For integers, one of our common operations is to turn a string into an integer.
Two examples of parseint
parseint ("10"); Returns 10
var n11 = parseint (' ab '); NaN
var n12 = parseint (' 11ab '); 11
The following defines the string type, undefined type, and null type, respectively
/* String type of basic data type */
var str = "String type";
alert (str);
/* Undefined type of basic data type */
var N21; Indicates that the variable was declared but was not assigned a value
alert (N21);
/* NULL type of base data type */
var n31 = null; Represents an empty object reference (Assignment is null)
alert (N31);
Reference type/* Reference Data type Example */
var obj = {}; Object
var arr = [1, 2, 3]; Array
var date = new Date (); Current date
alert (date);
Description
Reference types are more complex, the following are specific to the array, other reference types subsequent articles will be devoted to an article.
Array of common operations, focusing onThe array itself is an object, and the array in JS is not the same as C #.
The length changes arbitrarily, each item can be a different type.
The following is an example of an array operation.
DefinedArrays can also be defined in the form of new or literal.
var arr1 = new Array ();
var arr2 = [1, 2, ' AA ', New Date (), true];
alert (arr1.length);
alert (ARR2); is automatically converted to string, and the effect is equivalent to arr2.tostring ()
Adding and removing elementsfrom the tail :
Push and pop
var arr3 = [New Date (), false];
var res = Arr3.push (1, 2, true); The push method appends elements like an array (the return value is the new array length)
alert (ARR3); 1, 2, true three elements added in ARR3
Alert (res); Returns the length of the new array 5
var res2 = Arr3.pop (); Removes an element from the end of the data, with the returned value being the removed element
alert (ARR3);
alert (RES2); The return value is the removed element
from the head :
Shift and Unshift
var arr4 = [1, 2, True, New Date ()];
var res4 = Arr4.shift (); Removes an element from the head (returns the removed element)
var res5 = Arr4.unshift (n, false); Inserts multiple elements from the head, returning the number of new array elements
alert (RES5);
Intercept/*
Splice and Slice (interception related), returning the deleted element
The splice method operates the array itself
Slice does not manipulate the array itself
*/
var ARR5 = [1, 2, 3, 4, 5];
Splice (starting position, number of interception, third parameter and later representation: new element inserted into the Intercept position)
var res6 = Arr5.splice (1, 2, 3, 4, 5);
alert (ARR5); 1,3,4,5,4,5
alert (RES6); Returns the deleted element 2,3
var arr6 = [1, 2, 3, 4, 5];
var res7 = Arr6.slice (2, 4); Left close right open, grammar arrayobject.slice (start,end)
alert (ARR6); Same as it used to be.
alert (RES7); Returns the deleted element 3,4
StitchingThe Concat () method is used to concatenate two or more arrays.
The method does not alter the existing array, but only returns a copy of the concatenated array.
Syntax: Arrayobject.concat (Arrayx,arrayx,......, Arrayx)
Concat and join do not change the original array
var arr7 = [1, 2, 3];
var arr8 = [True, 4, 5];
var res8 = Arr7.concat (ARR8); Merge operation, do not manipulate the original array itself
alert (RES8); Returns the merged array
var res9 = Arr7.join ("-"); The join () method is used to put all the elements in an array into a string. Do not pass parameters with commas separated
alert (RES9); The
Sort语法：arrayObject.sort(sortby)，sortby可选，规定排序顺序，必须是函数。
/*
Sort positive Order
Reverse reverse order (reversed in the original sequence)
*/
var arr9 = [1, 2, 4, 3, 5];
var arr10 = [1, 10, 2, 5, 3];
Arr10.sort (); are sorted alphabetically by 1,10,2,3,5
Arr9.reverse (); Reverse in the original order
document.write (arr10 + "<br/>");
The default sort is sorted alphabetically so that 10 is ranked in front of 2.
We need to customize a comparison function as a parameter to sort by numerical size.
As follows:
function Sortnumber (A, b) {
Return A-B
}
var arr = new Array (6)
Arr[0] = "10"
ARR[1] = "5"
ARR[2] = "40"
ARR[3] = "25"
Arr[4] = "1000"
ARR[5] = "1"
document.write (arr + "<br/>")//10,5,40,25,1000,1
document.write (Arr.sort (Sortnumber))//1,5,10,25,40,1000
Description
The comparison function Sortnumber (A, B) has two parameters A and B, and returns a number that describes the relative order of the two values. The return value is as follows:
If a is less than B, a value that is less than 0 is returned if a should appear before B in the sorted array.
If a equals B, 0 is returned.
If a is greater than B, a value greater than 0 is returned.
ECMAScript5 new Features/* ECMASCRIPT5 array new feature additions
Location method: IndexOf lastIndexOf
Iterative method: Every filter ForEach some map
Reduction method: Reduce Reduceright
*/
var arr = [1, 2, 3, 4, 2, 1];
Location method: IndexOf lastIndexOf A parameter that represents the element to be searched for
var index=arr.indexof (2);
document.write (index);
Two parameters (the element to be searched, starting position)
var index = Arr.indexof (2, 2);
document.write (index);
LastIndexOf, the use is exactly the same, but from the tail to search forward
var index = Arr.lastindexof (2, 4);
document.write (index);
Iterative method : Every filter ForEach some map
Every, with operations, all true for true
var res = arr.every (function (item, index, array) {
return item > 0;
})
Some, or operation, has a true return True
var res = arr.some (function (item, index, array) {
return item > 3;
})
document.write (RES);
Filter to return the filtered results
var res = Arr.filter (function (item, index, array) {
return item > 2;
})
ForEach, traversing each execution method
Arr.foreach (function (item, index, array) {
document.write (item+ "<br/>");
})
Map, each execution method of the element, returns the new result
var res= arr.map (function (item, index, array) {
return item * 2;
})
Combination of left and right methods: reduce Reduceright
var res = arr.reduce (function (Prev,cur,index,array) {
return prev + cur;
})
document.write (RES);
SummarizeThis article first introduced the JS related common sense, as the study preparation.
Next, we explain the JS data type.
Data types are basic concepts that must be mastered in any language.
The concept, characteristics and common methods of arrays in reference types are emphatically explained.
An array is one of the most commonly used data types.
Be familiar with the definition of arrays, add and remove (from tail push and pop; from head unshift and shift), intercept (splice and slice), splice (concat and join), sort (sort,reverse) common operations.
Have questions welcome to direct comment on questions, wish Learning progress:)
JS Getting Started basics
Start building with 50+ products and up to 12 months usage for Elastic Compute Service
1 on 1 presale consultation
24/7 Technical Support 6 Free Tickets per Quarter Faster Response
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.
A comprehensive suite of global cloud computing services to power your business
Payment Methods We Support
