当前位置:
首页 > 网站开发 > JavaScript >
-
JavaScript教程之在JavaScript中创建新对象 二
二、创建对象实例
一旦对象定义完成后,就可以为该对象创建一个相关javascript教程实例了:
NewObject=New object();
其中Newobjet是新的对象,Object已经定义好的对象。例:
三、对象方法的使用
在对象中除了使用属性外,有时还需要使用方法。在对象的定义中,我们看到This.meth=FunctionName语句,那就是为定义对象的方法。实质对象的方法就是一个函数FunctionName,通过它实现自己的意图。
例在university对象中增加一个方法,该方法是显示它自己本身,并返回相应的字串。
function university(name,city,createDate,URL)
This.Name=Name;
This.city=city;
This.createDate=New Date(creatDate);
This.URL=URL;
This.showuniversity=showuniversity;
其中This.showuniversity就是定义了一个方法---showuniversity()。
而showuniversity()方法是实现university对象本身的显示。
function showuniversity()
For (var prop in this)
alert(prop+="+this[prop]+"");
其中alert是JavaScript中的内部函数,显示其字符串。
四、JavaScript中的数组
使用New创建数组
JavaScript中没有提供像其它语言具有明显的数组类型,但可以通过function定义一个数组,并使用New对象操作符创建一个具有下标的数组。从而可以实现任何数据类型的存储。
a、定义对象的数组
Function arrayName(size){
This.length=Size;
for(var X=; X<=size;X++)
this[X]=0;
Reture this;
}
其中arrayName是定义数组的一个名子,Size是有关数组大小的值(1-size),即数组元素的个数。通过for循环对一个当前对象的数组进行定义,最后返回这个数组。
从中可以看出,JavaScript中的数组是从1到size,这与其它0到size的数组表示方法有所不同,当然你可根据需要将数组的下标由1到size调整到0到size-1,可由下列实现:
Function arrayName (size)
For (var X=0; X<=size;X++)
this[X]=0;
this.lenght=size;
Return this;
从上面可以看出该方法是只是调整了this.lenght的位置,该位置是用于存储数组的大小的。从而调整后的数组的下标将与其它语言一致。但请读者注意正是由于数组下标顺序由1到size,使得JavaScript中的对象功能更加强大。
b、创建数组实例
一个数组定义完成以后,还不能马上使用,必须为该数组创建一个数组实例:
Myarray=New arrayName(n);
并赋于初值:
Myarray[1]=“字串1”;
Myarray[2]=“字串2”;
Myarray[3]=“字串3”;
...
Myarray[n]=“字串n”;
一旦给数组赋于了初值后,数组中就具有真正意义的数据了,以后就可以在程序设计过程中直接引用。
创建多维数组
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();
之后可通过myMArray[11]、myMArray[12]、myMArray[13]、myMArray[21]、myMArray[22]、myMArray[23]、
…来引用。
内部数组
在Java中为了方便内部对象的操作,可以使用窗体(Forms)、框架(Frames)、元素(element)、链接(links)和锚(Anchors)数组实现对象的访问。
anchors[]:使用《A name=“anchorName“》标识来建立锚的链接。
links[]: 使用<A href=”URL”>来定义一个越文本链接项。
Forms[]: 在程序中使用多窗体时,建立该数组。
Elements[]:在一个窗口中使用从个元素时,建立该数组。
Frames[]:建立框架时,使用该数组
anchors[]用于窗体的访问(它是通过《form name=“form1”》所指定的),link[]用于被链接到的锚点的访问(它是通过《a href=URL》所指定的)。Forms[]反映窗体的属性,而anchors[]反映Web页面中的链接属性。
有关锚数组的文档:
<HTML>
<HEAD>
<BODY>
<A NAME=”MyAnchorsName1”> 定义第一个锚名
HTML Code
<A NAME=”MyAnchorsName2”> 定义第二个锚名
HTML Code
<A HREF=”#MyAnchorsName1”>建立锚的链接
<A HREF=”#MyAnchorsName2?gt; 建立锚的链接
….
该文档段建立了两面全锚的链接,可通过Anchors[]访问这些锚。document.Anchors[0]反映第一个锚,而document.Anchors[1]反映第二个锚的有关信息。
五、范例
范例1:一个动态文字滚动的例子。
test5_1.htm
范例2:颜色变化的例子。
test5_2.htm
本讲介绍了用户自行创建对象的方法, 用户可根据需要创建自己的对象。并介绍了JavaScript中建数组的方法
一旦对象定义完成后,就可以为该对象创建一个相关javascript教程实例了:
NewObject=New object();
其中Newobjet是新的对象,Object已经定义好的对象。例:
U1=New university(“云南省”,“昆明市”,"January 05,199712:00:00","http://www.YN.KM") U2=New university(“云南电子科技大学”,“昆明”,"January 07,1997 12:00:00","htlp://www.YNKJ.CN") |
在对象中除了使用属性外,有时还需要使用方法。在对象的定义中,我们看到This.meth=FunctionName语句,那就是为定义对象的方法。实质对象的方法就是一个函数FunctionName,通过它实现自己的意图。
例在university对象中增加一个方法,该方法是显示它自己本身,并返回相应的字串。
function university(name,city,createDate,URL)
This.Name=Name;
This.city=city;
This.createDate=New Date(creatDate);
This.URL=URL;
This.showuniversity=showuniversity;
其中This.showuniversity就是定义了一个方法---showuniversity()。
而showuniversity()方法是实现university对象本身的显示。
function showuniversity()
For (var prop in this)
alert(prop+="+this[prop]+"");
其中alert是JavaScript中的内部函数,显示其字符串。
四、JavaScript中的数组
使用New创建数组
JavaScript中没有提供像其它语言具有明显的数组类型,但可以通过function定义一个数组,并使用New对象操作符创建一个具有下标的数组。从而可以实现任何数据类型的存储。
a、定义对象的数组
Function arrayName(size){
This.length=Size;
for(var X=; X<=size;X++)
this[X]=0;
Reture this;
}
其中arrayName是定义数组的一个名子,Size是有关数组大小的值(1-size),即数组元素的个数。通过for循环对一个当前对象的数组进行定义,最后返回这个数组。
从中可以看出,JavaScript中的数组是从1到size,这与其它0到size的数组表示方法有所不同,当然你可根据需要将数组的下标由1到size调整到0到size-1,可由下列实现:
Function arrayName (size)
For (var X=0; X<=size;X++)
this[X]=0;
this.lenght=size;
Return this;
从上面可以看出该方法是只是调整了this.lenght的位置,该位置是用于存储数组的大小的。从而调整后的数组的下标将与其它语言一致。但请读者注意正是由于数组下标顺序由1到size,使得JavaScript中的对象功能更加强大。
b、创建数组实例
一个数组定义完成以后,还不能马上使用,必须为该数组创建一个数组实例:
Myarray=New arrayName(n);
并赋于初值:
Myarray[1]=“字串1”;
Myarray[2]=“字串2”;
Myarray[3]=“字串3”;
...
Myarray[n]=“字串n”;
一旦给数组赋于了初值后,数组中就具有真正意义的数据了,以后就可以在程序设计过程中直接引用。
创建多维数组
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();
之后可通过myMArray[11]、myMArray[12]、myMArray[13]、myMArray[21]、myMArray[22]、myMArray[23]、
…来引用。
内部数组
在Java中为了方便内部对象的操作,可以使用窗体(Forms)、框架(Frames)、元素(element)、链接(links)和锚(Anchors)数组实现对象的访问。
anchors[]:使用《A name=“anchorName“》标识来建立锚的链接。
links[]: 使用<A href=”URL”>来定义一个越文本链接项。
Forms[]: 在程序中使用多窗体时,建立该数组。
Elements[]:在一个窗口中使用从个元素时,建立该数组。
Frames[]:建立框架时,使用该数组
anchors[]用于窗体的访问(它是通过《form name=“form1”》所指定的),link[]用于被链接到的锚点的访问(它是通过《a href=URL》所指定的)。Forms[]反映窗体的属性,而anchors[]反映Web页面中的链接属性。
有关锚数组的文档:
<HTML>
<HEAD>
<BODY>
<A NAME=”MyAnchorsName1”> 定义第一个锚名
HTML Code
<A NAME=”MyAnchorsName2”> 定义第二个锚名
HTML Code
<A HREF=”#MyAnchorsName1”>建立锚的链接
<A HREF=”#MyAnchorsName2?gt; 建立锚的链接
….
该文档段建立了两面全锚的链接,可通过Anchors[]访问这些锚。document.Anchors[0]反映第一个锚,而document.Anchors[1]反映第二个锚的有关信息。
五、范例
范例1:一个动态文字滚动的例子。
test5_1.htm
<html> <head> <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 = "这是一个动态JavaScript文字显示的例子"; 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> </head> <body onload="scroller()" 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="40" style="background-color: rgb(192,192,192)"></p> </form> </td> </tr> </table> </center></div> </body> </html> |
范例2:颜色变化的例子。
test5_2.htm
<html> <head> <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 < 10; 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> </html> |
栏目列表
最新更新
nodejs爬虫
Python正则表达式完全指南
爬取豆瓣Top250图书数据
shp 地图文件批量添加字段
爬虫小试牛刀(爬取学校通知公告)
【python基础】函数-初识函数
【python基础】函数-返回值
HTTP请求:requests模块基础使用必知必会
Python初学者友好丨详解参数传递类型
如何有效管理爬虫流量?
SQL SERVER中递归
2个场景实例讲解GaussDB(DWS)基表统计信息估
常用的 SQL Server 关键字及其含义
动手分析SQL Server中的事务中使用的锁
openGauss内核分析:SQL by pass & 经典执行
一招教你如何高效批量导入与更新数据
天天写SQL,这些神奇的特性你知道吗?
openGauss内核分析:执行计划生成
[IM002]Navicat ODBC驱动器管理器 未发现数据
初入Sql Server 之 存储过程的简单使用
这是目前我见过最好的跨域解决方案!
减少回流与重绘
减少回流与重绘
如何使用KrpanoToolJS在浏览器切图
performance.now() 与 Date.now() 对比
一款纯 JS 实现的轻量化图片编辑器
关于开发 VS Code 插件遇到的 workbench.scm.
前端设计模式——观察者模式
前端设计模式——中介者模式
创建型-原型模式