A carding of JS knowledge system

Today simply summed up some of the JS things, combing the whole system, each time the summary will have a different harvest;
JS Summary One
first, "get the Element":

1, through Id:var Obtn=document.getelementbyid (' btn1 ');
var Odiv=document.getelementbyid (' Div1 ');

2, through the tag: var adiv=document.getelementsbytagname (' Div ');
A loop is used to manipulate a set of elements:
For (initial value; loop condition; self-increment-subtract Condition) {} has length with for loop
Initial value, while (loop Condition) {code; self-increment self-decrement condition;} With a while loop without length;
For in Loop: used in the object: JSON arr arr generally uses the upper for loop performance high;

3, through the class name: var adiv=document.getelementsbyclassname (' div1 ');
Problem with compatibility: solve by encapsulating function:
Getbyclass (oBox, ' Div1 ');
function Getbyclass (obj,sname) {
var aobj=obj.getelementsbytagname (' * ');
var arr2=[];
For (var I=0;i<aobj.length;i++) {
var str=aobj[i].classname;
var arr=str.split (');
If (findinarr (sname,arr)) {
Arr2.push (aobj[i]);
};
}
Return arr2;
}
Note: by ID is obtained to an element, the other two get is a set of elements,
ID can only be obtained under document, the other two methods can be obtained under the parent level;
ID and tagname are fully compatible, get compatibility issues through class name
Gets a set of other methods with an array of elements that are aware of the use of length adiv.length and subscript adiv[0] that are not used by an array of classes;

second, "event":

System Event: Onload\domcontentloaded\onreadystatechange\onscroll\onresize
Mouse Events: onclick\onmouseover\onmouseout\onmousedown\onmouseup\onmousemove\onmousewheel\dommousescroll\ Oncontextmenu\
Keyboard Events: Onkeydown\onkeyup\
Oninput\onpropertychange\

Event Object: Stores details of event occurrences; declare var oevent=ev| | Event

Event Delegates: Add events to the parent, judge the event source, execute a code, and add events to future elements;

Event Bindings: Obj.addeventlistener (' event name without on ', fn,false), Advanced Browser compatible
DOM events must be bound, and DOM events can only be compatible in advanced browsers;
Obj.attachevent (' event name with on ', fn), IE browser compatible;
Event Bubbling: the flow of events from bottom to top level, generally does not prevent bubbling, there is a problem to prevent;
oevent.cancelbubble=true;
Event Sinking: an event stream that is opposite to the event bubbling, from the top down to the next level;

Common Object Information Oevent.target| | oevent.srcelement;
oevent.clientx;/oevent.clienty;
oevent.keycode/oevent.shiftkey/oevent.altkey/oevent.ctrlkey;
Oevent.wheeldelta/oevent.detail

three, "function":

1. named function: functions show () {} appears show ();
2, anonymous function: Functionz () {}; When parentheses are executed, such as enclosing space;
Closed space: (function (index) {}) (i); 1) resolve the variable conflict, 2) solve the problem of i, 3) do not have to name alone;
3. Event function: obj.onclick=function () {}; Executes when the event is triggered;

Note: The return value of the function: return can write not write, need to write, see return directly out of the code behind the function is not executed, if the function does not write the return value; the return is undefined;
The definition of a function is pre-parsed: the function cannot be defined directly in the IF and for loops;

Iv. "process control":

1, if () {}else if () {}else{}; Only the first if is necessary behind the need is used;
2. Switch (condition) {
Case Condition One:
Code
Break
Case Condition Two:
Code
Break
Default
Code
Break

};

V. "circulation":

1, for (initial value; cyclic condition; self-increment self-reduction condition) {} has length with for loop; Note that variables cannot be the same when a For loop is set directly in a For loop
2, initial value, while (loop Condition) {code; self-increment self-decrement condition;} With a while loop without length;
3. For in loop: used in object: JSON arr arr generally uses the upper for loop for high performance;

Note: If there is a problem with I in the event event in the loop, use this or the enclosing space to resolve (i have a problem as long as the time difference between the assignment and the call time Exists)
Break/continue: most are used in the loop, break is a direct jump out of the loop, continue is to skip the second cycle;
Application: tab Simple calendar 99 multiplication table

V. "operation Properties and Styles":

./[] Point can operate the square brackets can be manipulated, after the point can not follow the variable, the square brackets in the addition of variables, the operation is the row style;

GetAttribute (' attribute name ')/setattribute (' attribute name ', ' attribute value ');

Application: Lazy Loading

Vi. "variables":
1, declaring variables: var variable name = ' Variable value '; There is a pre-resolved problem; the definition is placed at the front of the scope; interview frequently
Strict mode: the definition of a variable must be added Var
2, Non-strict mode: var a=b=c=8; The first variable is a local variable and two is a global variable;
3, the use of variables without quotation marks; strings quoted;

Vii. "data type":
1. String string using quotation marks; concatenation of strings ' string ' + variable + ' string ' + variable;

Method of String:
Str.charat (subscript): Find the corresponding string of subscript;
Str.indexof (' string '): looks for the subscript of the string from left to right, and returns 1 when not found;
Str.lastindexof (' string ') to find the subscript corresponding to the string from right to left;
Str.split (' Cutting Method '): The string is cut into the array in parentheses;
Str.substring (start position, End position): intercepts the string from the beginning to the end position;
Str.touppercase (); All letters in the string are converted to uppercase;
Str.tolowercase (); All letters in the string are converted to lowercase;

String to Number: parseint (); convert to an integer number followed by a string
parsefloat (); Convert a decimal number followed by a string;
Number (); only the numbers are used in strictly converting strings;
The conversion failed to return Nan Nan means that the meaning is not a letter, but its data type is Numbernan not equal to anything including its own
Judging is not nan with isNaN ();

Compare Size:
1) Two is a normal comparison of numbers;
2) A number a numeric type of string; the first implicit type conversion is then compared by the number size
3) two strings that are numeric types are compared from left to right for example ' 2 ' > ' 12 ';
4) two are full strings, then one from left to right compares a<z;a<a;

Application: capitalize the first letter of the string to determine the browser type

2. number

1) numbers plus numbers are arithmetic operations; numbers plus strings are string concatenation; + no implicit type conversion;
2) in the operator except for + = = = = =, Most of the other exist hermit type conversions
3) Common Mathematical Methods
Math.random () Random Number
Math.Abs () Absolute Value
Math.sqrt () Prescribe
Math.pow (n,m) N's m-th Square
Math.ceil () rounding up
Math.floor () Down rounding
Math.Round () Rounding
Math.max () Maximum Value
Math.min () Minimum value
4) operator:
Arithmetic operators: + 、-、 *,/,%;
Assignment operators: =, + =,-=, *=,/=,%=;
Comparison operators: = =, >, >=, <, <=, = = =,! =,!==
Logical operators:&&, | |,!
Application: Calculator random number to get waterfall stream

3, Boolean Boolean value

True: except that false is true;
False:false\0\ ' \undefined\nan\null; It's all Fake.

4. Object Objects

Array:
disclaimer: var arr=[]/var arr=new Arrey (); Any data type can be placed in an array, ordered, with length
Add and replace of array items: arr[1]= ' Blablabla ';
Array of Methods:
Arr.push () Add one item backwards;
Arr.unshift () Add an item forward;
Arr.pop () Deletes an item from behind;
Arr.shift () Delete one item from the front;
Arr.splice (start position, Number of deletions, add item);
Arr.reverse () flip;
Arr.join (' Stitching mode ') stitching each item in the array into a string;
Arr.sort (function (n,m) {return n-m}); The order in which the parameters and return values are the same is from small to large, and Vice Versa.
Concatenation of Arr.concat (arr1,arr2) arrays;

Note: arrays can be used for loops or can be used for loops in the general case with a high performance for the loop;

Apply: string Flip sort data store call

Json:
disclaimer: var json={': ', ': ', ', ': '}, unordered, no length, value used json.name;
Add the JSON to the item json.name= ' Val '/json[' name ']= ' Val ';
Replace the same method as above: use the same key name
Delete item Delete json.name/delete json[' name '];
The JSON loop can only represent the key name with a for in for (name in Json) {} name;
Application: JSON array to re-json[arr[i]]= ' Luanqibazao ';
SetStyle ();
GetPos ();
Data storage and invocation; interactive eval (' (' +json+ ') ');

A carding of JS knowledge system