The Javascript| tutorial uses JavaScript to create your own objects. Although the functionality within JavaScript and the browser itself is already powerful, JavaScript provides a way to create a new object. So that it does not need to be like Hypertext Markup Language, or other multimedia tools, can do a lot of complex work.
Creating a new object in JavaScript is very simple. First it must define an object and then create an instance for that object. This example is a new object that has the basic characteristics of the object definition.
I. Definition of the object
A JavaScript object is defined as the following basic format:
Function Object (property sheet)
This.prop1=prop1
This.prop2=prop2
...
this.meth=functionname1;
this.meth=functionname2;
...
In the definition of an object, you can specify its properties and methods for that object. An instance of an object is formed by means of properties and methods. As follows is a definition of the University object:
Function University (Name,city,creatdate URL)
This.name=name
This.city=city
This.creatdate=new Date (creatdate)
This.url=url
The basic meaning is as follows:
name-Specifies a "unit" name.
city-"unit" in the city.
creatdate-records the update date of the University object.
Url-the object points to a URL.
second, create an object instance
Once the object definition is complete, you can create an instance of the object:
Newobject=new object ();
Where Newobjet is a new object, an object that has already been defined. Cases:
U1=new University ("Yunnan province", "Kunming", "January 05,199712:00:00", "Http://www.YN.KM")
U2=new University ("Yunnan", "Kunming", "January 07,1997 12:00:00", "htlp://www.ynkj.cn") |
third, the use of object methods
In addition to using attributes in an object, you sometimes need to use a method. In the definition of an object, we see the This.meth=functionname statement, which is the method for defining the object. The method of the substance object is a function functionname, through which it realizes its own intention.
Example adds a method to the University object that displays itself and returns the corresponding string.
Function University (Name,city,createdate,url)
This.name=name;
this.city=city;
This.createdate=new Date (creatdate);
This.url=url;
this.showuniversity=showuniversity;
Where this.showuniversity is defined as a method---showuniversity ().
The Showuniversity () method is to implement the display of the university object itself.
function showuniversity ()
For (Var prop in this)
Alert (prop+= "+this[prop]+");
Where alert is an intrinsic function in JavaScript, displays its string.
four, the array in JavaScript
Create an array using new
JavaScript does not provide a distinct array type like other languages, but can define an array by function, and use the new object operator to create an array with subscript. This enables the storage of any data type.
A, an array of defined objects
Function arrayname (size) {
This.length=size;
for (Var x=; x<=size; X + +)
this[x]=0;
Reture this;
}
Where Arrayname is a name that defines the array, the size is the value of the array (1-size), that is, the number of elements in the array. Defines an array of the current object through a for loop, and returns the array at the end.
As you can see, the arrays in JavaScript are from 1 to size, which is different from the other 0 to size array representations, but you can adjust the array's subscript from 1 to size to 0 to size-1 as needed, as follows:
Function arrayname (size)
for (Var x=0; x<=size; X + +)
this[x]=0;
This.lenght=size;
return this;
As you can see from the above, the method is simply to adjust the this.lenght position, which is used to store the size of the array. The subscript of the adjusted array will therefore be consistent with the other languages. But let the reader note that because the array subscript order is 1 to size, the objects in JavaScript are more powerful.
B, creating an array instance
After an array definition is complete, you cannot use it immediately, you must create an array instance for the array:
Myarray=new arrayname (n);
and assigns the initial value:
myarray[1]= "String 1";
Myarray[2]= "String 2";
Myarray[3]= "String 3";
...
Myarray[n]= "String n";
Once the array has been assigned to the initial value, the array has the real meaning of the data, in the future can be directly referenced in the design process.
To create a multidimensional array
Function Creatmarray (Row,col) {
var indx=0;
This.length= (row*10) +col
for (Var x=1;x<=row;x++)
for (Var y=1;y<=col;y++)
indx= (x*10) +y;
This[indx]= "";
}
Mymarray=new Creatmarray ();
Then through MYMARRAY[11], mymarray[12], mymarray[13], mymarray[21, mymarray[22], mymarray[23],
... To reference.
Internal array
In Java, you can use form (forms), frames (Frames), elements (Element), link (links), and anchor (anchors) arrays to implement object access in order to facilitate internal object manipulation.
Anchors[]: Use the "A name=" Anchorname "logo to establish a link to the anchor.
Links[]: Use <a href= "URL" > to define a more text link entry.
Forms[]: When you use multiple forms in your program, you create the array.
Elements[]: The array is created when the element is used from within a window.
Frames[]: When you build a frame, use the array
Anchors[] is used for access to a form (which is specified through the form name= "Form1"), link[] for access to the anchor point being linked (it is specified through the "a Href=url"). Forms[] reflects the properties of the form, and anchors[] reflects the link properties in the Web page.
Documents about anchor Arrays:
<HTML>
<HEAD>
<BODY>
<a name= "MyAnchorsName1" > define the first anchor name
HTML Code
<a name= "MyAnchorsName2" > Define a second anchor name
HTML Code
<a href= "#MyAnchorsName1" > Establish anchor Links
<a href= "#MyAnchorsName2? gt; Establish anchor Links
....
The document section establishes a link to both sides of the anchor, which can be accessed through anchors[]. Document. Anchors[0] reflects the first anchor, while the document. ANCHORS[1] Reflects information about the second anchor.
v. Examples
Example 1: an example of dynamic text scrolling.
Test5_1.htm
<title></title>
<script language= "JavaScript" >
With (top.window.location)
{BaseURL = href.substring (0,href.lastindexof ("/") + 1)}
Total_toc_items = 0;
Current_overid = "";
Last_overid = "";
browser = navigator.appname;
Version = parseint (navigator.appversion);
Client=null;
loaded = 0;
if (browser = "Netscape" && version >= 3) client = "NS3";
function Toc_item (img_name,icon_col,width,height) {
if (client = = "Ns3") {
Img_prefix = BaseURL + img_name;
This.icon_col = Icon_col;
This.toc_img_off = new Image (width,height);
THIS.TOC_IMG_OFF.SRC = Img_prefix + "_off.gif";
this.toc_img_on = new Image (width,height);
THIS.TOC_IMG_ON.SRC = Img_prefix + "_on.gif";
}
}
function New_toc_item (img_name,icon_row,width,height) {
Toc_item [Img_name] = new Toc_item (img_name,icon_row,width,height);
}
function Toc_mouseover (ItemID) {
if (client = = "Ns3") {
Current_overid = ItemID;
if (Current_overid!= last_overid) {
Document [CURRENT_OVERID].SRC = Toc_item [Current_overid].toc_img_on.src;
if (Last_overid!= "") {
document.images [LAST_OVERID].SRC = TOC_ITEM[LAST_OVERID].TOC_IMG_OFF.SRC;
}
Last_overid = Current_overid;
}
}
}
function Toc_mouseout () {
if (client = = "Ns3") {
if (Current_overid!= "") {
document.images [CURRENT_OVERID].SRC = Toc_item [Current_overid].toc_img_off.src;
}
Current_overid = "";
Last_overid = "";
}
}
New_toc_item ("1", 2,120,20);
<!--Begin
function Bannerobject (p) {
THIS.MSG = Message
This.out = ""
This.pos = POSITION
This.delay = delay
THIS.I = 0
This.reset = Clearmessage}
function Clearmessage () {
This.pos = POSITION}
var POSITION = 50;
var DELAY = 150;
var message = "This is an example of dynamic JavaScript text display";
var scroll = new Bannerobject ();
function Scroller () {
Scroll.out + = "";
if (scroll.pos>0)
for (scroll.i = 0; scroll.i < Scroll.pos; scroll.i++) {scroll.out = "";}
if (scroll.pos>= 0)
Scroll.out + + scroll.msg
Else
Scroll.out = scroll.msg.substring (-scroll.pos,scroll.msg.length)
Document.noticeForm.notice.value = Scroll.out
Scroll.out = "";
scroll.pos--;
scroll.pos--;
if (Scroll.pos <-(scroll.msg.length)) {Scroll.reset ();} settimeout
(' Scroller () ', Scroll.delay);}
</script>
<body bgcolor= "#000000" link= "#C0C0C0" vlink= "#C0C0C0"
alink= "#008080"
text= "#C0C0C0" >
<table border= "0" cellspacing= "0" cellpadding= "0" >
<tr>
<TD width= "100%" ><form name= "Noticeform" >
<p><input type= "text" name= "notice" size= "" style= "Background-color:rgb" (192,192,192) "></p>
</form>
</td>
</tr>
</table>
</center></div>
</body>
|
Example 2: Examples of color changes.
Test5_2.htm
<script>
<!--
function Makearray (n) {
This.length = n;
for (var i = 1; I <= n; i++)
This[i] = 0;
return this;}
Hexa = new Makearray (16);
for (var i = 0; i < i++)
Hexa[i] = i;
Hexa[10]= "a";
Hexa[11]= "B";
Hexa[12]= "C";
hexa[13]= "D";
Hexa[14]= "E";
Hexa[15]= "F";
function Hex (i) {
if (I < 0)
return "00";
else if (i > 255)
return "FF";
else return "" + Hexa[math.floor (I/16)] + hexa[i%16];}
function Setbgcolor (R, G, b) {
var hr = hex (r);
var hg = Hex (g);
var HB = hex (b);
Document.bgcolor = "#" +HR+HG+HB;}
Function Fade (SR, SG, SB, er, eg, EB, step) {
for (var i = 0; I <= step; i++) {
Setbgcolor Math.floor (SR * (step-i)/step) + er * (i/step)),
Math.floor (SG * ((step-i)/step) + eg * (i/step)), Math.floor (SB *
((step-i)/step) + EB * (i/step)); }}
function Fadein () {
Fade (255,0,0,0,0,255,100);
Fade (0,0,255,0,255,0,100);
Fade (0,255,0, 0,0,0, 100);}
Fadein ();
-->
</script>
<body>
</body>
|
This lecture introduces the way users create their own objects, and users can create their own objects as needed. The method of building arrays in JavaScript is also introduced.
