Conquer Ajax and JavaScript Object-Oriented Design

Source: Internet
Author: User
Tags setcookie
Javascript object-oriented Program Design

I. Define classes by defining functions
Function class1 (){
Class member definition and constructor
}
Class1 is both a function and a class. As a function, it can be understood as a class constructor responsible for initialization.

Ii. Use the new operator to obtain an instance of a class
New Date () indicates creating a date object, and date indicates the date class, but this class is provided internally by JavaScript,
Not user-defined.
The new operator is not only effective for internal classes, but also for user-defined classes.
You can also use new to obtain an instance:
VaR obj1 = new class1 ();
Aside from the concept of classes, class1 is a function. Can all functions be operated using new? The answer is yes,
In JavaScript, functions and classes are a concept. When a new function is used, an object is returned. If this function does not contain
Initialize a class member and an empty object is returned.
In fact, when a new function is used, this function is the constructor of the class, and allCodeCan be considered as initialization.
Work as an object.

3: Use square brackets [] to reference object attributes and methods
in Javascript, [each object can be considered as a combination of multiple attributes (methods ], it is easy to reference an attribute, that is, the
Object Name. attribute (method) name
can also be referenced in square brackets:
Object Name ["attribute (method) Name"], the method name and attribute name here are a string instead of the symbol after the first vertex
var arr = new array ();
arr [0] = "3333333";
arr [2] = "4444444";
alert (ARR. length); 3
alert (ARR ["length"]); 3
arr. push ("ddddd");
arr ["push"] ("eeeee");
alert (ARR. length); 5

Method of the category class: class name ["property name"] or class name. property name
Function user ()
{
This. Age = 21;
This. Name = "Jun ";
}
Function VAD (o)
{
VaR user = new user ();
If (O. selectedindex! = 0)
{
Alert (User [O. value]);
}
}
4. dynamically add and modify deletion attributes and Methods
First, use the object to create an empty Object User; var user = new object ();
1. Add the property user. Name = "dddddddddd ";
2. Add method user. Alert = function () {alert ("dddddddd ")};
3. modify attributes
Replace the old property with the new property.
4. Delete attributes
The process of deleting an attribute is also very simple, that is, setting it
Undefined;
5. Deletion Method
Also set to undefined
This method also has an additional feature, that is, you can use a non-identifier string as the property name, for example, the identifier is not allowed
It must start with a number or contain spaces, but can be used in the square brackets ([]) syntax;

6: Use the braces {} syntax to create a non-typed object
objects in JavaScript are actually a combination of attributes (methods) and do not have a strict class concept, therefore, he provides another
simple method to create objects.
var u = {
name: 'jasc',
Age: '21',
Hello: function () {alert ('ddddddd') ;},

Sex: 'nan ',
"001": "ggggg" ------ no type object
};

Alert (U. Age );
U. Hello ();
Alert (U. Sex );
Alert (U ["001"]);

7. Prototype prototype
Each function object has a sub-object prototype, which represents the prototype of the function, and the function is also a class, prototype
Actually represents a set of classes. When a class object is obtained through new, all prototype object members become instantiated.
Object.

Class1.prototype. method = function () {alert ("dddddddddddd ");};


VaR CLS = new class1 ();
Cls. Method ();

In-depth understanding of functions in Javascript
As an object, a function can have some methods and attributes, and adding attributes and methods to a function requires the Function
Type

VaR I = function (a, B) {alert ();};

I (5 );
The relationship between function objects and other class objects.

========================================================== ========================================================== ====
Processing cookies using object-oriented ideas
1. Create a cookie object
Because it is used as a class name or namespace, it is similar to the math object. Here, cookie is used to represent this object.
VaR cookie = new object ();
2. Implement the cookie setting method. name indicates the name of the cookie to be set; value indicates the cookie value. option includes
Is an object as a parameter.
/* Use an object-oriented method to process cookies */

/* If the cookie already exists, adding this cookie is equivalent to modifying this cookie */

VaR cookie = new object ();
Cookie. setcookie = function (name, value, option)
{
// Stores the string assigned to document. Cookie.
VaR STR = Name + "=" + escape (value );
If (option)
{
// If the expiration time is set
If (option. expiredays)
{
VaR date = new date ();
VaR MS = option. expiredays * 24*60*60*1000;
Date. settime (date. gettime () + MS );
STR + = "; expires =" + date. togmtstring ();

}
If (option. Path)
STR + = "; Path =" + path;
If (option. domain)
STR + = "; doman =" + domain;
If (option. Secure)
STR + = "; true ";
}
Document. Cookie = STR;
}
Cookie. getcookie = function (name)
{
VaR cookiearray = Document. Cookie. Split (";");
For (VAR I = 0; j = cookiearray. length; I <j; I ++)
{
VaR arr = cookiearray [I]. Split ("= ");
If (ARR [0] = Name)
Return Unescape (ARR [1]);
}
Return "";
}
Cookie. deletecookie = function (name)
{
This. setcookie (name, "", {expiredays:-1 });
}
VaR cookie = {
Setcookie = function (){},
Getcookie = function (){},
Deletecookie = function (){}
};


}
========================================================== ========================================================== ====
Javascript Advanced Programming
Framework programming. Cookie technology. Regular Expression. Window object. Exception Handling

I. Framework programming includes self-control of the framework and mutual access between the frameworks, for example, referencing
Javascript variables, calls functions in other frameworks, controls the form behavior of another framework, and so on.

All frames on a page are provided as properties of Windows objects in the form of collections;
For example, window. Frames indicates the combination of all frames on the page, which is consistent with form objects, link objects, and image objects.
Similarly, the difference is that these sets are the attributes of document.

To reference a framework, you can use the following syntax:
Window. Frames ["framename"]
Window. frames. framesname
Window. Frames [Index]

Windows can also be replaced or omitted with self. If framename is the first frame on the page
Is equivalent:
Self. Frames ["framename"]
Self. Frames [0]
Frames [0]
Framename

The reference to the framework refers to the reference to the window object. For example, you can use the window metadata Doc ument object to write data to the page and use
Window. locaiton attribute to change pages in the framework.

1. Reference from parent framework to Child Framework
Window. Frames ["framename"] references the framename sub-framework on the page.
If you want to reference the child frame of the child frame in the page, window. Frames ["framename1"]. Frames ["framename2"]

2. references from the Child Framework to the parent framework
Each window object has a parement attribute, indicating its parent framework. If the framework is already a top-level framework,
Window. Parent also indicates the framework itself.

3. Reference between sibling frameworks
If the two frameworks are the same as the Child frameworks of a framework, they can be indirectly referenced through the parent framework.
Self. Parent. Frames ["frame2"]

4. Mutual reference between frameworks at different layers
The methods 1 and 3 can be used.

5. Reference to the top-level framework
Similar to the parent attribute, the window object also has a top attribute that indicates a reference to the top-level framework. This can be used to determine
Whether the framework itself is a top-level framework.
If (Self = Top ){}

The reference to the framework refers to the reference to the window object. Using the location attribute of the Windows Object, you can change the navigation of the framework.
Registry.frames%0%.location%1.html

Reference JavaScript variables and functions in other frameworks

JS full screen
<Script language = "JavaScript">
If (this. Name! = 'Fullwnd ')
{
Window. Open (location. href, 'fullwnd', 'fullscreen, scrollbars = no ');
This. Parent. Opener = NULL;
This. Parent. Close ();
}
</SCRIPT>

Regular Expression
Use Regexp object to perform String Matching
Regexp is a regular expression object in Javascript. It can be used to complete
String Matching operations ..
VaR objregexp =/pattern */[flag];
VaR objregexp = new Regexp ("pattern" [, "flag"]);
Pattern: The pattern to be matched. flag indicates the search mode. There are two optional parameters.
G, I, G indicates global search, and I indicates case-insensitive. The default value is
Case Sensitive,
// This Character Sequence starting with/and ending with/is called a regular expression.
/* → The Regular Expression Function and C # Have a big difference in usage.
Regexp contains the regular expression object in cirpt, which can be used to perform various operations on string matching.
VaR objregexp =/regularexpression/[G | I]
VaR objregexp = new Regexp (/regularexpression/[G | I]);

Description: G | I (Optional). G indicates global search. I indicates case-insensitive. It is useful in the replace method.

→ Method:
Exec (STR) returns an array
Test (STR) returns the bool value.

→ Static attribute: it is best not to use it (it is dizzy by him)
Regexp. Input: String saved by -- Search ---
Regexp. Index stores the position of the matched first character (starting from 0)
Regexp. lastindex stores the location of the next character matching the string
Regexp. lastmatch Save the matched string (including the outer brackets)
Regexp. lastparen save the last matched string (content of the last parenthesis)
Regexp. leftcontext: Save the content on the left of the matching string
Regexp. rightcontext: Save the content on the right of the matching string

Regexp. $1 ~ $9 Save the first nine matching items (Content in brackets)


→ Extract string

String. Search (regularexpression) returns the index location of the first character. Otherwise,-1 is returned, which is similar to the index function.
String. Replace (regularexpression, replacestring) returns a new string, which is commonly used to delete HTML tags.
String. Match (regularexpression) returns an array, similar to Regexp.

Note: hrefurl = $ ("# textarea1" ).html () + alert (hrefurl); printed strings, HTML tags are replaced, miracle
Hrefurl = $ ("# textarea1" ).html () + Regexp =/href = (. *)> <B> (\ W +) <\/B>/zookeeper regexp.exe C (hrefurl );
+ Hrefstr = "Regexp. Input:" + Regexp. input; = The result is # textarea1.

*/
// Hrefurl = $ ("# textarea1"). Val ();
//
// Regexp =/A +? /G;
//
/// Var arr = hrefurl. Match (Regexp );
//// Alert (ARR [5]);
// Arr=regexp.exe C (hrefurl );
// Hrefbool = Regexp. Test (hrefurl );
//
// Alert (Regexp. lastindex );

Related Article

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.