作家
登录

Javascript 使用function定义构造函数

作者: 来源:www.28hudong.com 2013-03-30 01:50:19 阅读 我要评论

Javascript中创建对象的语法是在new运算符的后面跟着一个函数的调用。如 复制代码 代码如下: var obj = new Object(); var date = new Date(); 运算符new首先创建一个新的没有任何属性的对象,然后调用该函数,把新的对象作为this关键字的值传递。 复制代码 代码如下: var date = new Date()的伪代码的实现就是 var obj = {}; var date = Date.call(obj); 构造函数的作用就是初始化一个新创建的对象,并在使用对象前设置对象的属性。如果定义自己的构造函数,只需要编写一个为this添加属性的函数就可以了。下面的代码定义了一个构造函数: 复制代码 代码如下: function Rectangle(w, h) { this.width = w; this.height = h; } 然后,可以使用new运算符调用这个函数来创建对象的实例 复制代码 代码如下: var rect = new Rectange(4,8); 构造函数的返回值 Javascript中的构造函数通常没有返回值。但是,函数是允许有返回值的。如果一个构造函数有一个返回值,则返回的对象成为new表达式的值。在此情况下,作为this的对象将会被抛弃。 使用构造函数定义法 语法 复制代码 代码如下: var object=new objectname(); var -- 声明对象变量 object -- 对象的名称 new -- new的关键词(JavaScript关键词) objectname -- 构造函数名称 示例 复制代码 代码如下: //定义构造函数 function Site(url, name) { this.url = "www.jb51.net"; this.name ="梦之都"; } //使用构造函数产生一个JavaScript对象的实例 var mysite = new Site(); alert(mysite.url); 构造函数通常可以初始化对象中的一些内容,JavaScript内部提供的一些对象通常需要使用构造函数的方法生成。JavaScript函数的内容将在下一章介绍。 直接定义法创建JavaScript对象 复制代码 代码如下: //定义对象语法 var object={}; //对象内的属性语法(属性名(property)与属性值(value)是成对出现的) object.property=value; //对象内的函数语法(函数名(func)与函数内容是成对出现的) object.func=function(){...;}; var -- 声明对象变量 object -- 对象的名称 property -- 对象的属性名 func -- 对象的方法名 说明:对象可以包含一些属性(函数可以看作带有括号的特殊属性),每个属性有名称和值。名称可以是任何字符串甚至是空。值可以是任何javascript类型,但不能是undefined。 使用定义法定义的对象示例 复制代码 代码如下: var site = {}; site.URL = "www.jb51.net"; site.name = "脚本之家"; site.englishname = "jb51"; site.author = "脚本"; site.summary = "免费的网页设计教程"; site.pagescount = 100; site.isOK = true; site.startdate = new Date(2005, 12); site.say = function(){alert(this.englishname+" say : hello world!")}; site.age = function(){var theage=(new Date().getFullYear())-site.startdate.getFullYear();alert(this.name+"已经"+theage+"岁了!")} 使用构造函数创建JavaScript对象示例 -- 可以尝试编辑 使用构造函数创建JavaScript对象 上面的方法定义了一个site的对象,并且为其定义了七个属性,与两个个方法。 say方法会打印出jb51 say : hello world!的字符串 age方法会计算出梦之都网站的年龄 猴子提示: 注意每个属性与函数前面都要加上对象的名称,否则JavaScript无法判断它是属于那个对象的。 下面的课程将讲解直接定义法的延伸,JSON定义法。 使用构造函数创建JavaScript对象 -- JavaScript教程 构造函数法创建JavaScript对象 直接法创建JavaScript对象 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd"> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=gb2312" /> <title>使用构造函数创建JavaScript对象</title> </head> <body> <script type="text/javascript"> //定义构造函数 function Site(url, name) { this.url = "www.jb51.net"; this.name ="梦之都"; } //使用构造函数产生一个JavaScript对象的实例 var mysite = new Site(); alert(mysite.url); </script> <p>直接法创建JavaScript对象</p> <script type="text/javascript"> var site = {}; site.URL = "www.jb51.net"; site.name = "梦之都"; site.englishname = "dreamdu"; site.author = "可爱的猴子"; site.summary = "免费的网页设计教程"; site.pagescount = 100; site.isOK = true; site.startdate = new Date(2005, 12); site.say = function(){alert(this.englishname+" say : hello world!")}; site.age = function(){var theage=(new Date().getFullYear())-site.startdate.getFullYear();alert(this.name+"已经"+theage+"岁了!")} site.age(); </script> </body> </html> [Ctrl+A 全选 注:如需引入外部Js需刷新才能执行]

  推荐阅读

  基于jquery.Jcrop的头像编辑器

用过新浪微博的朋友对它的头像编辑器都有印象吧.不过人家是用flash做的. 在一个项目中,也用到了同样的东西,本来想直接用新浪微博的,但它有一部分请求路径写到FLASH里面去了,所以只好放弃. 在网上找到了jquery.Jcro>>>详细阅读


本文标题:Javascript 使用function定义构造函数

地址:http://www.17bianji.com/kaifa2/JS/27000.html

关键词: 探索发现

乐购科技部分新闻及文章转载自互联网,供读者交流和学习,若有涉及作者版权等问题请及时与我们联系,以便更正、删除或按规定办理。感谢所有提供资讯的网站,欢迎各类媒体与乐购科技进行文章共享合作。

网友点评
自媒体专栏

评论

热度

精彩导读
栏目ID=71的表不存在(操作类型=0)