JavaScript Tutorial - from entry to the master (4)
Related Tags:
Object-based JavaScript language
JavaScript is based on the target language (Object-Based), and not the object-oriented (object-oriented). We say it is an object-based language, mainly because it did not provide as abstraction, inheritance, such as the heavy load many of the object-oriented language features. But the other languages created by the complex object unite to form a very powerful object system.
Although the JavaScript language is an object-based, but it still has some of the Basic features of object-oriented. It can be to create their own objects, thus further expanding the scope of the application JavaScript and enhance the preparation of a powerful Web documents.
First, the basic knowledge of Object
1, the basic structure of objects in the JavaScript object by the attributes (properties) and methods (methods) two basic elements of the composition. The former is targeted in the implementation of its needs in the process of loading units of information, thereby variables associated with the latter is targeted to designers in accordance with the intention of being implemented, which with specific functions associated.
2, cited a targeted way to really object to be used, the following can be obtained in several ways:
O quoted JavaScript internal objects;
O by the browser provided in the environment;
O create a new object.
This means that an object was used before, this object must exist, otherwise use will be meaningless, and a wrong message. From the above, we can see that JavaScript objects can be invoked through three access. Or create new objects, or use of the existing object.
3, the statement of the object JavaScript is not a pure object-oriented language, which provides object-oriented language with a number of features, the designers JavaScript you it is "based on object" rather than object-oriented language, JavaScript provides for the operation of several object statements and keywords and operators.
(1) For ... statement in the following form:
For (object in the known attributes of objects)
Description:
O The statement's function is used to target known to operate all the attributes of the control cycle. It is a known target of repeated buy all the attributes to a variable rather than to achieve the counter.
O The statement is not aware of the advantages of object in the number of attributes can be made.
Example: following function is an indication that the contents of the array:
Function showData (object)
For (var X = 0; X <30; X)
Document.write (object [i]);
The function through an array subscript value of the order to visit each object's properties, the use of such methods must first know that the array subscript value, or if it is out of range, the error will occur. For ... in而使statement, the fundamental attributes of the object does not need to know the number, see below:
Function showData (object)
For (var prop in object)
Document.write (object [prop]);
The use of the function, in the loop, For the attributes automatically removed, until the last for this.
(2) statements with the use of the phrase means is: in the phrase in any of the variables used to be considered is the object's properties, in order to save some of the code.
With object (
...)
All with a flower statement after the phrase in parentheses, are behind the scope of the target object.
(3) this keyword
This is the current quote, as in the JavaScript object used is a multi-level, multi-directional and often an object and the application of the need to invoke another object, and another object may also cited another object, such a may cause confusion and finally they have cited do not know that an object, this provides a JavaScript object will be designated for the current object of this statement.
(4) Although New Operators in JavaScript object function is very powerful indeed. But more powerful is to design in accordance with the needs of staff can create their own targets to meet a specific requirement. New operators can be used to create a new object. Create Object use its format is as follows:
Newobject = NEW Object (Parameters table);
Newobject creation of a new object: the object is already in existence target parameters table parameter table; new order is in the JavaScript language.
Such as the creation of a new target date
New Data newData = ()
New Data birthday = (December 12.1998)
After allowing the NewData, birthday as a new target date of the.
4, the application of object attribute object attributes cited by the realization of one of the following three ways:
(1) (.) Operators
University.Name = "Yunnan"
University.city = "Kunming"
University.Date = "1999"
Is a university which has been the object of existence, Name, City, Date is its three properties, and through the operation of its assignment.
(2) of the object of achieving quoted subscript
University [0] = "Yunnan"
University [1] = "Kunming"
University [2] = "1999"
Access through an array of forms of property, you can use the operating cycle access to its value.
Function showunievsity (object)
For (var j = 0; j <2; j)
Document.write (object [j])
For if they do not know they can ... in the number of its attributes can be achieved after:
Function showmy (object)
For (var prop in this)
Docament.write (this [prop]);
(3) strings in the form of
University [ "Name"] = "Yunnan"
University [ "City"] = "Kunming"
University [ "Date"] = "1999"
5, the application of the method of object in JavaScript object method used is very simple.
ObjectName.methods ()
Indeed methods () = FunctionName method is essentially a function. As quoted in the university object showmy () method can be used:
Document.write (university.showmy ())
Or: document.write (university)
As quoted in math internal targets cos () methods are:
With (math)
Document.write (cos (35));
Document.write (cos (80));
If use is invoked, with relatively more complicated:
Document.write (Math.cos (35))
Document.write (math.sin (80))
JavaScript has provided us with some very useful internal targets and methods used. Users do not have these functions with their feet. Object-based programming that is the real purpose.
Provide a string in JavaScript (string), math (numerical) and Date (date) of three objects, and a number of other related measures. Programming staff so as to rapidly develop powerful script provides a very favorable terms.
1, commonly used in JavaScript object within the object properties and methods of use, there are two types: One is that the object is static object, that is, to invoke the object's properties or methods, it does not need to create examples, while others invoke an object in the target or method it is necessary to create a case for it, that is, the object is a dynamic object.
JavaScript object of the internal quoted Siti tightly around its attributes and methods carried out. Thus targeted static and dynamic of the internal master and understand JavaScript object is a very important significance.
1), string object o string objects: static and internal.
O visit properties and methods, can be used (.) Operators to achieve.
O use the basic format: objectName.prop / methods
(1) String object's properties there is only one attribute of the object that length. It shows that the number of characters in the string, including all symbols.
Example:
Mytest = "This is a JavaScript"
Mystringlength = mytest.length
Finally mystringlength mytest return to the length of the string is 20.
(2) the method of object string string targeting a total of 19 methods. For the string in the main Web page display, Font size, font color, character and characters search case conversion.
The main methods are as follows:
O Anchor anchor (): The method to create documents such as html anchor in the same marker. Html such as the use of anchor (A Name = "") the same. Visit the adoption of the following format: string.anchor (anchorName).
O Display of the control method
Big fonts that Italics () italics, bold () bold, blink () scintillation characters, small () characters with the word body, fixed () fixed highlighted word, fontsize (size) control font size.
O font color; fontcolor (color)
O string conversion case
ToLowerCase () - lowercase conversion, toUpperCase () capital conversion. Following to a given string were converted into big write and lowercase format:
String = = stringValue.toLowerCase stringValue.toUpperCase and string.
O Character Search: indexOf [charactor, fromIndex]
From the specified location formIndtx charactor first began searching for the location.
Back to the string part of the string: substring (start, end)
Start from the beginning to end all of the characters in return.
2), arithmetic function of the math target function: to provide addition adds, subtracts, multiplies, in addition to more than a primer readme computing. If the number, such as the square root.
Static and dynamic: static object (1) the principal attributes math provided six attributes, which are frequently used in the mathematical constant E of 10 for the end of the natural logarithm LN10 to 2 to the end of the natural logarithm LN2, 3.14159 of PI, 1 / 2 of the square root SQRT1-2, the square root of 2 to SQRT2.
(2) the principal method of absolute value: abs ()
Sine cosine values: sin (), cos ()
Anyway, string inverse cosine: asin (), acos ()
Tangent anti-tangent: tan (), atan ()
Rounded: round ()
Square root: sqrt ()
Based on the Guinean side of the values: Pow (base, the exponent)
...
3), date and time of object function: to provide a date and time of the object.
Static and dynamic: dynamic, which must use the New operator creates an instance. Example:
MyDate = New Date ()
Date object does not provide direct access to properties. Only have to get and set the date and time method.
Starting values Date: January 1, 1770 00:00:00.
1. Dates of acquisition methods getYear (): Returns the number of years getMonth (): Returns the month, a few getDate (): Returns the day, a few getDay (): Returns a few weeks getHours (): Returns the number of hours getMintes (: Back minutes getSeconds (): Returns the number of seconds getTime (): Returns the number of milliseconds (2) the date and time settings:
SetYear (); settings, setDate (): Setting the month, a few setMonth (): Setting month shares setHours (): Setting hours setMintes (): Setting minutes setSeconds (): Setting seconds setTime (): Setting cents seconds
...
2, JavaScript function in the system JavaScript function in the system known as internal methods. It provides nothing to do with any object system functions, the use of these functions without creating any examples can be directly used.
1. Back to the value of the string expression:
Method: eval (string expression), and cases:
Test = eval ( "8 9 5 / 2");
2. Return string ASCI Code:
Method: unEscape (string)
3. Back to character encoding:
Method: escape (character)
4. Back to real:
ParseFloat (floustring);
5. Back to the different band:
ParseInt (numbestring, rad.X)
Radix which is the number of hexadecimal, numbs few strings
Third, Below is an example of the JavaScript files clock. Documents used in a lot of function.
Test4_1.htm
<html>
<head>
<style TYPE="text/css">
<style>
</ Style>
<title> Clock </ title>
<script LANGUAGE="JavaScript">
Function showClock () (
)
Function hideClock () (
)
Var timerID = null
Var timerRunning = false
Function stopClock () (
If (timerRunning)
ClearTimeout (timerID);
TimerRunning = false
Document.clock.face.value = "";
)
Function showTime () (
Var now = new Date ();
Var year = now.getYear ();
Now.getMonth var month = () 1;
Var date = now.getDate ();
Var hours = now.getHours ();
Var mins = now.getMinutes ();
Var secs = now.getSeconds ();
Var timeVal = "";
TimeVal = ((hours <= 12)? Hours: hours - 12);
TimeVal = ((mins <10)? ": 0": ":") mins;
TimeVal = ((secs <= 10)? ": 0": ":") secs;
TimeVal = ((hours <12)? "AM": "PM");
TimeVal = ((month <10)? "On 0": "on") month "-";
TimeVal = date "-" year;
Document.clock.face.value = timeVal;
TimerID = setTimeout ( "showTime ()", 1000);
TimerRunning = true
)
Function startClock () (
StopClock ();
ShowTime ();
)
Function windowOpener (indexnum) (
Var loadpos = "date.html" "#" indexnum;
ControlWindow = window.open (loadpos, "date", "toolbar = no, location = no,
Directories = no, status = no, menubar = no, scrollbars = yes, resizable = yes,
Width = 620, Height = 400 ");
)
</ Script>
</ Head>
<body OnLoad="startClock()">
<p Align="center"> <big> <span style="background-color: rgb(45,45,45)">
<font Face="Arial"> form </ font> <font face="宋体"> clock </ font>
</ Span> </ big> </ p>
<p Align="center"> </ p>
<div Align="center"> <center>
<table Border="0" cellspacing="0" cellpadding="0">
<tr>
<td Width="100%"> <form NAME="clock" onSubmit="0">
<div Align="center"> <center> <p> <input TYPE = "text" NAME = "face" size = "20"
VALUE style = "background-color: rgb (192192192)"> </ p>
</ Center> </ div>
</ Form>
</ Td>
</ Tr>
</ Table>
</ Center> </ div>
</ Body>
</ Html>
Based on the stresses on the JavaScript object used in internal object attributes, and methods of use.
- W3C school HTML help guide CHM
- XHTML + CSS + JavaScript Learning Resources (major sites, W3C School)
- CSS learning from entry to the master
- Google entry to the master
- Destination establishment - from entry to the master (thematic)
- Fast proficient in the use of master FRAME
- Destination establishment - from entry to the master - basic knowledge
- Destination establishment - from entry to the master - for articles
- Part V reference master Ajax
- Ajax master series
- Web standards: XHTML + CSS (W3C)
- W3C XHTML code norms
- WEB master HTML chapter of the courses
- GMail view from the W3C Web standards and Ajax
- Web master - page scroll Break
- W3c validator: CSS/HTML4.01/XHTML1.0 XiaoZhu.com have passed smoothly:)
- Blog.csdn.net support of the W3C CSS problems
- Destination establishment - from entry to the master - chapter details
- Fast proficient in the use of master framework
- W3c technical architecture introduced




