JS Learning Summary

Transfer from http://blog.sina.com.cn/s/blog_75cf5f3201011csu.html

one: About the basic data types in the relationship between stack memory and heap memory

The basic data for the stack memory and heap memory can be copied, you can assign the data in a variable to b variables in the stack memory for each variable to save an object, changing the value of one other variable will not affect the value of other variables.

1:var NUM1 = 6;

var num2 = NUM1;

The same values are stored in this num1 with num2, but they are completely independent and do nothing to each other.

2:var obj1 = new Object ();

var obj2 = obj1;

Obj1.name = ' Nicholas ';

alert (obj2.name); ' Nicholas '

In this obj1 and obj2 save the same values, they are actually a pointer to the heap in the memory of an object, so they are mutually affected, change one, will affect the other.

Two: about complex data types in the relationship between stack memory and heap memory

Complex data for stack memory and heap memory they point only to the same object, not because multiple variables in the heap memory are assigned to multiple objects in the stack memory, where changing the value of a variable will affect the value of other variables, only create a new object, and the original object's properties are traversed with a for in statement to assign to the new object. There are two objects in the stack memory, and changing one of the objects does not affect the other object.

Three: About objects

There are two ways to create new objects: 1 var a = new object (); 2 var a = {};

We can also add properties and methods to new objects that we create: A.name = ' attributively ';

alert (a.name); (Result)//attributively

Access properties: 1 object. Property = property Value (the property of the object is accessed by point) 2 object = {property: Property value}; (Access property by colon);

An object has the concept of an indexed value that resembles an array's subscript, and also accesses its index value in the form of an access array subscript, such as: classes[' today '; This is the Today property in the Access classes object.

Classes[topclass] This form is generally used when the properties of an object are mutable and are dynamically accessed or changed in this form ...

Modify property Default attributes (These properties are not supported by the low-version browser):

var Ceshi = {};

Ceshi.name = 10;

Object.defineproperty (Ceshi, ' name ', {writable:false});//Set the object property value cannot be modified Object.defineproperty (Ceshi, ' name ', { Configurable:false});//Set properties of this object cannot be deleted

Four: Create an array:

There are two ways to create an array: 1 var = a = new Array (); 2 var a = [];

The sorting method of the array is the number of the first, the second letter, the third and sequential arrangement of the text;

Five: Literal concept:

String literals are objects that you do not need to create a procedure to use, so it does not have a declaration or definition of a variable (the string literal is a nameless object), nor does it need to be dynamically allocated as if it were a dynamically allocated object. For this reason, the type qualifier used to qualify the variable (such as const, volatile) and the storage class indicator (such as extern, static, auto, register) cannot be used on the decorated string literal.

Six: There are related concepts about how to search for variable environment

1. All global variables and functions are created as properties and methods of the Window object.

2, each environment can shrink the scope chain up to query the variable name and function name, but no environment more than the search for the scope chain down into another execution environment.

3.

Valid variable names follow the rules: 1 The first character must be an ASCII letter (either uppercase or lowercase), or an underscore (_). Note that the first character must not be a number.

2: Subsequent characters must be letters, numbers, or underscores.

3: The variable name must not be a reserved word.

Seven: Parameters of the function concept:

Define the parameters of a function we can think of it as a local variable, a local variable that will be destroyed when he finishes, and the global variable will be destroyed only if you close the page.

parameter is divided into formal parameters and arguments, which is equivalent to a local variable of the current function, when the argument is called,

The arguments that are passed,

Must be a valued variable or constant or a string.

Eight: function-related issues

More than 1 identical elements can create an array to save 2 different then create an object to save.

3, assign a function to a variable, the result is to assign the result of the function returned to this variable.

Nine: The design of the object of the physiognomy:

Some basic points about object-oriented programming: 1 to have the concept of a class, the same kind of things like the property method.

2: Class inheritance 3: Attribute methods inside a class can be changed individually,

Ten: By defining a method with a function and invoking it in the same effect

When we do the JS effect often encounter many situations is to do the same effect, so the JS code is similar, can be said to be the same.

In this case, some people will write more in each function to show the effect of the method, including myself, so, if a lot of the appearance of this effect, then our JS will write a lot of code. When I was working on a file column yesterday, every column was the same event, and occasionally I thought of using a function to define the same number of events in each column as a function.

This is where this effect is needed, the function is called, and there is a lot of code that can be saved.

Defines a function that changes the class name method of an onclick click event:

var Djshijian = function (DJs, CLSL) {

if (Djs.classname = = ") {

AddClass (DJs, CLSL);

}else if (djs.classname = = CLSL) {

Removeclass (DJs, CLSL);

}

}

A function that defines an onclick click event to change the IMG attribute value method:

var Htshijian = function (gHs) {

if (Ghs.getattribute ("src") = = ". /img/tp7.gif ") {

Ghs.setattribute ("src", ".. /img/bjt1.gif ");

}else if (Ghs.getattribute ("src") = = ". /img/bjt1.gif ") {

Ghs.setattribute ("src", ".. /img/tp7.gif ");

}

}

Call the defined function directly when you need this effect:

function Zhankai (Htu) {

Djshijian (dul[0], ' LB ');

Htshijian (Htu);

}

This way, even if you need this kind of effect to look more, just call the defined function, the parameter is OK.

11 Creating an element createelement_x_x_x_x_x_x_x_x_x_x_x_x_x_x_x_x_x_x_x_x_x_x_x_x_x_x_x_x_x_x_x_x_x_x_x_x_x_x_x_x_x_x_x_x_x_ X_x_x_x_x_x_x_x_x_x_x_x ():

Use this method to create a new element grams. This method accepts only one argument, which is to create the tag name of the element.

12 Operation Node A () and insertbefore () Usage:

Appendchiild () Adds a node to the end of the specified element.

InsertBefore () is used to add a node within a specified element, which takes two parameters: the node to be inserted and the node to be referenced. When the node is inserted, the inserted node becomes the previous sibling of the reference node and is returned by the method.

13 Sets or gets the HTML InnerHTML in the start and end tags of the object

A property is a property that is basically a lot of each tag object, which is used to add HTML code or text to a tag. and replace all the child nodes in the current tag, which is the code.

14 Math Object

The Math object provides computer functionality.

The random () method returns an arbitrary number, syntax: "Math.random () * The total number of possible values + the first possible value. 】

XV parseint () method:

The parseint () method returns an integer converted from a string.

16 parameters of function functions return statement:

1, an important feature of the function: named parameters are only convenient, but not necessary. is equivalent to a temporary variable.

2. Return statement: Exits from the current function and returns a value.

function sum (NUM1, num2) {

Xnum1 + num2;

}

17 TagName Property toLowerCase () method:

1. The TagName property is used to get the label of the object.

2. The toLowerCase () method is used to return a string in which the letters in the string are converted to lowercase letters

IE6 does not support uppercase, and in order to be compatible with IE6, it is generally converted to lowercase.

18 JS Handbook's Own method

1, the indexOf () method returns the character position of the first substring within a string (string) object. (Queries whether the object has this specified string.) ）

2. The LastIndexOf () method returns the position of the last occurrence of a substring of a string object.

For example, when the path of a picture is relative to the path, the IE6 gets the path of the picture is the absolute path, other standard browsers get the relative path.

This situation when writing the JS code, especially when the IF judgment statement is very easy to encounter this problem, the result is not equal, because the path is different from the relative path string. This time we're going to use indexof to solve this problem.

Case: if (huantuimgjihe[0].getattribute (' src '). IndexOf (' 5.png ') >-1), here is the same as long as the image address has a 5.png.

The 2:if ($ (' P ')). Get (0). Innerhtml.indexof (' Qwer ') >-1)//What you need to remember here is that IndexOf is a method of character-swapping. however. The dot operator is typically used for objects. Point properties. So the right side of the point is the property, and the left is the object. So a lot of time to pay attention to. The properties and methods on the right side of the dot are not. The properties or methods of the left object. For instance, the above example begins with a tagged object we get. The label object does not have a indexof method, so you have to use innerHTML to get the string inside the line ...

3, the CharAt () method is used to get the specified position of the string, the position of the string is the default starting from 0, that is, to get the first character of a string to be accessed with subscript zero .

The following: var Zifushuzi = dradio[i].value.charat (0); Gets the first character of the value of input.

4, the substr () method can get a character anywhere in a string, or you can get all the characters between some strings.

In the following: var dname = $ (' div '). attr (' name '). substr (0,1); Get the Name property value of the DIV tag inside the first and second characters.

4, the IsNaN () method is used to indicate whether the resulting value is a number or a character, and if it is a number then return False, or return true

The following: Alert (IsNaN (1651651)); Returns false

19: Note What to keep in mind when writing code:

1, for something with a function to define a method, the function if there are parameters then his parameters to be used in the function body, it is necessary to note that in the function body with this parameter directly with the function of parameter name, you can not change the parameter into a string in the form of the inside and so on 、、、、。

2, + + increment operator Keep in mind that it is often used when writing code, which means that the expression is incremented by 1 for each execution of the variable until the expression does not run.

3, in writing code should pay attention to: the idea to clear, the thought of thinking with comments written in the code, so will not forget.

Each part of the code is used to do more to use comments to write clearly, so convenient to find later.

It is also important to make a Web page to write code: the name is to be understood, which shows what the name is for.

4, Write code good debugging method is very important, JS debugging method to make full use of alert statement debugging, such as a condition is not set up, we want to know why he is not set up, this time can then if the conditions in front of the print out this condition is what, sometimes Firefox is not very accurate.

5, when we hear to repeat the group, look for an array to think of the loop statement:

fon loop fon in loop while loop do While loop 、、、

6, when writing code to define a global variable to save the currently selected node object this idea is very common, remember.

7, JS inside each method or attribute inside there are a lot of words, each word of the first letter to capitalize.

8. There are two ways to access an object's properties: one is. The dot operator, and another is the [] bracket.

22 Event object usage and properties that block event bubbling

The event object must be written in the handler to make sense, or the handler invokes the event object, because the browser will only pass in the event and attributes when you trigger the handler.

Block event bubbling: Prevents the event from bubbling up on the label object when an event is triggered on it.

Get the tag object you want to block with the target property of the event object:

The ReturnValue property is a property of the event object that is used to block the default action in IE.

The Cancelbubble property is also a property of the event object that is used to cancel the bubbling event in IE.

23 the way to add an event to a tag in JS:

Standard browser methods for adding events: AddEventListener (event name, function, false bubbling stage);//If the function has been declared elsewhere, then fill in the declared function name directly.

Standard browser methods for deleting events: RemoveEventListener (event name, function name, false);

Methods for adding events to non-standard browsers: Attavhevent (event name, function);

Non-standard method of deleting events by browser: DetachEvent (event name, variable to save function);

Note Adding or removing events from non-standard browsers it only supports bubbling events, so do not add false, there is a non-standard browser method inside the first event name to be added in front, and the standard browser does not need to add on.

24: About Mouse coordinates

The ALT key sets or retrieves a value that indicates the state of the ALT key.

Altleft Gets or sets a value that indicates the state of the left ALT key.

The cancelbubble set or retrieves whether the current event should be bubbling for the hierarchy of event handlers.

Clientx Sets or gets the x-coordinate of the position of the mouse pointer relative to the client area of the window, except for window decorations and scroll bars.

Clienty Sets or gets the y-coordinate of the mouse pointer position relative to the client area of the window, with the exception of window decorations and scroll bars.

The Ctrlkey property sets or retrieves the state of the CTRL key.

Ctrlleft Sets or gets the state of the left CTRL key.

DataTransfer provides drag-and-drop operations to access using predefined clipboard formats.

OffsetX Sets or gets the x-coordinate of the position of the mouse pointer relative to the object that triggered the event.

OffsetY Sets or gets the y-coordinate of the position of the mouse pointer relative to the object that triggered the event.

The returnvalue Sets or retrieves the return value from the event.

Screenx retrieves the x-coordinate of the relative position of the mouse pointer on the user's screen.

Screeny Sets or gets the y-coordinate of the mouse pointer position relative to the user's screen.

Shiftleft gets the state of the left SHIFT key.

Srcelement Sets or gets the object that triggered the event.

Type Sets or retrieves the name of the event from the event object.

X Sets or retrieves the relative position of the x-coordinate, in pixels, of a relative location of the mouse pointer to the parent element.

Sets or retrieves the relative position of the parent element of the y-coordinate, in pixels, of a relative position of the mouse pointer.

25 an easy way to add an event handler:

Add an event handler above the parent element of the tag that adds the event, and in the handler use the judgment statement to determine which event target the user is triggering and what needs to be done for it.

Judging method: Standard browser: if (Event.target = = Event target) {}

IE browser: if (event.srcelement = = Event target) {}

This method of adding events can be used directly with this

Compatible with all browser event targets: var target = Ev.target | | Ev.srcelement;

26: Return value and drag effect

1, a return value is basically used to do the comparison operation or assignment operation. The properties and property values inside the custom object are separated by colons,

2, Web page production of the drag effect is generally divided into 3 parts, onmousedown onmousemove onmouseup Drag to start dragging the end

27: How to get the event this in JS and the difference between onmousemove and Onmouseove

1, in the HTML tag with the use of attributes to add events, in the JS call if you want to use this or event object, you must first in the HTML tag in the event of the parameters in order to use in JS.

2, onmousemove events and Onmouseove are different, onmousemove refers to the object inside each move will trigger the event.

Onmouseove refers to the event that is triggered when moved into an object, triggering only once,

28: The difference between blocking browser default behavior in doing a drag event handler 、、、

In Web pages that do drag effects, there are often times when you need to block the default behavior that occurs when you drag a picture in the browser

This time to note that to drag an object there are three steps onmousedown (drag start) and onmousemove (drag) and onmouseup (drag end), and to prevent the browser default behavior is to be blocked in which event handler?

The default behavior that the standard browser prevents when dragging a picture is blocked in the onmousedown (when pressed)

Non-standard browsers are blocked in onmousemove (when moving),

29: innerHTML and Createelement_x_x_x_x_x_x_x_x_x_x_x_x_x_x_x_x_x_x_x_x_x_x_x_x_x_x_x_x_x_x_x_x_x () and the use of a ():

innerHTML is used to set (add) HTML structure or character, the value is composed of string, return is also a string.

Createelement_x_x_x_x_x_x_x_x_x_x_x_x_x_x_x_x_x_x_x_x_x_x_x_x_x_x_x_x_x_x_x_x_x () is used to add a new label object, The argument inside the parentheses is the name of the tag object to be added, often with innerHTML.

A () is used to add an element at the end of the ChildNodes collection, and the argument inside the parentheses must be a node object, which is a label object.

30: The Math object Random property creates a stochastic number, combined with the + = operator and the FOR Loop statement to create a random display of multiple strings.

Liezi:

var htmlfabric = '

' +

‘

' +

"+

"+

"+

' Video ' +

‘

' +

‘

‘;

var numeral = Math.floor (Math.random () * 9 + 2); Creates a random number.

var randomicity = '; Because this variable is not assigned, it is incremented, so it has to wait for an empty string. Or it will appear undefinde

for (var i = 0; i < numeral; i++) {

Randomicity + = Htmlfabric; As long as I is less than the random number numeral,htmlfabric will increment to randomicity how many times

}

ddiv.innerhtml = randomicity; The number of randomicity after a loop is equal to how many htmlfabric are added to the page.

Elderp.a (DDIV);//Add Ddiv to the end of Elderp.

The Math.floor () method is used to convert the value of the Math.random to an integer.

31 scrolling Event Onscroll, the entire page scrolling event, must be in window first to be compatible with all browsers.

32 about JS Changing a tag's attribute value problem:

JS changes the attribute value of a tag, which can be directly "object. Property = ' property value '"

You can also use the setattribute () method to change the property value of a tag.

But it's best to use the first method, and the second method is suitable for changing the new properties that you create.

33 About AJAX Issues:

1. The name attribute in the form is the parameter, and the Value property is the parameter values;

2, the core technology of Ajax is XMLHttpRequest

3, Ajax, get and post parameters, get and post parameters post is more secure than get, get faster than post speed;

The post parameter is linked with a & symbol for each variable: var poststr = "User_name=" + userName + "&user_age=" + userage + "&user_sex=" + usersex;

The get parameter accepts the path to the form: var url = "ajax_output2.php?" User_name= "+ userName +" &user_age= "+ userage +" &user_sex= "+ usersex;.

4、添加参数，You can add as many parameters as you want. For example, if you need to add another parameter, simply append it to the URL and separate the "and" (&) character [the first parameter is separated by a question mark (?) and a script name].

5. Several properties of XMLHttpRequest:

Open (): establishes a new request to the server.

send (): Sends a request to the server.

abort (): Exits the current request.

readystate: Provides the ready state of the current HTML.

responsetext: Request response text returned by the server

Status: HTTP status code for server (200 corresponds to ok,404 not Found (not found), etc.)

Responsexml: The response of the server, expressed as XML. This object can be parsed as a DOM object

6, XMLHttpRequest of several methods:

Abort (): Stop the current request

getAllResponseHeaders (): Returns all response headers for an HTTP request as a key/value pair

getResponseHeader ("header"): Returns the string value of the specified header

Open ("Method", "url"): establishes a call to the server. The method parameter can be a GET, post, or put. The URL parameter can be a relative URL or an absolute URL. This method also includes 3 optional parameters

Send (content): sends a request to the server

setRequestHeader ("header", "value"): Sets the specified header to the value provided. You must first call open () before setting any header

7. Because of security restrictions, the post method of Ajax is not supported across domains. So you can make cross-domain requests through the GET method. You can also pass

34: About Timestamps

The timestamp represents the total number of seconds from January 01, 1970 00:00 00 seconds (Beijing time January 01, 1970 08:00 00 seconds) up to now

The timestamp of the PHP output is the total number of seconds, and the time stamp of the JS output is the total number of milliseconds.

Get php timestamp: var endTime =;

Get JS timestamp: ar now = new Date (). GetTime ()

PHP and JS timestamp mutual transfer: var startdate = new Date (PHP timestamp *). GetTime ();//php timestamp converted to JS timestamp

JS conversion to PHP timestamp is the opposite.

JS Learning Summary