`
isiqi
  • 浏览: 16481396 次
  • 性别: Icon_minigender_1
  • 来自: 济南
社区版块
存档分类
最新评论

Javascript 自定义对象[转载]

阅读更多
Javascript 自定义对象
-、创建自定义对象
要创建自己的对象实例,必须首先为其定义一个构造函数。构造函数创建一个新对象,赋予对象属性,并在合适的时候赋予方法。例如,下面的示例为 pasta 对象定义了构造函数。注意 this 关键字的使用,它指向当前对象。
// pasta 是有四个参数的构造器。
function pasta(grain, width, shape, hasEgg)
{
// 是用什么粮食做的?
this.grain = grain;
// 多宽?(数值)
this.width = width;
// 横截面形状?(字符串)
this.shape = shape;
// 是否加蛋黄?(boolean
this.hasEgg = hasEgg;
}
定义了对象构造器后,用 new 运算符创建对象实例。
var spaghetti = new pasta("wheat", 0.2, "circle", true);
var linguine = new pasta("wheat", 0.3, "oval", true);
可以给对象实例添加属性以改变该实例,但是用相同的构造器生成的其他对象定义中并不包括这些属性,而且除非你特意添加这些属性那么在其他实例中并不显示出来。如果要将对象所有实例的附加属性显示出来,必须将它们添加到构造函数或构造器原型对象(原型在创建高级对象中讨论)中。
// spaghetti 的附加属性。
spaghetti.color = "pale straw";
spaghetti.drycook = 7;
spaghetti.freshcook = 0.5;
var chowFun = new pasta("rice", 3, "flat", false);
// chowFun 对象或其他现有的 pasta 对象
// 都没有添加到 spaghetti 对象
// 的三个新属性。
// 将属性‘foodgroup’加到 pasta 原型对象
// 中,这样 pasta 对象的所有实例都可以有该属性,
// 包括那些已经生成的实例。
pasta.prototype.foodgroup = "carbohydrates"
// 现在 spaghetti.foodgroupchowFun.foodgroup,等等
// 均包含值“carbohydrates”
在定义中包含方法
可以在对象的定义中包含方法(函数)。一种方法是在引用别处定义的函数的构造函数中添加一个属性。例如,下面的示例扩充上面定义的 pasta 构造函数以包含 toString 方法,该方法将在显示对象的值时被调用。
// pasta 是有四个参数的构造器。
// 第一部分与上面相同。
function pasta(grain, width, shape, hasEgg)
{
// 用什么粮食做的?
this.grain = grain;
// 多宽?(数值)
this.width = width;
// 横截面形状?(字符串)
this.shape = shape;
// 是否加蛋黄?(boolean
this.hasEgg = hasEgg;
// 这里添加 toString 方法(如下定义)。
// 注意在函数的名称后没有加圆括号;
// 这不是一个函数调用,而是
// 对函数自身的引用。
this.toString = pastaToString;
}
// 实际的用来显示 past 对象内容的函数。
function pastaToString()
{
// 返回对象的属性。
return "Grain: " + this.grain + "\n" +
"Width: " + this.width + "\n" +
"Shape: " + this.shape + "\n" +
"Egg?: " + Boolean(this.hasEgg);
}
var spaghetti = new pasta("wheat", 0.2, "circle", true);
// 将调用 toString() 并显示 spaghetti 对象
// 的属性(需要 Internet 浏览器)。
window.alert(spaghetti);
二、创建高级对象
构造函数是一个函数,调用它来例示并初始化特殊类型的对象。可以使用 new 关键字来调用一个构造函数。下面给出了使用构造函数的新示例。
var myObject = new Object(); // 创建没有属性的通用对象。
var myBirthday = new Date(1961, 5, 10);// 创建一个 Date 对象。
var myCar = new Car(); // 创建一个用户定义的对象,并初始化其属性。
通过构造函数将一个参数作为特定的 this 关键字的值传递给新创建的空对象。然后构造函数负责为新对象执行适应的初始化(创建属性并给出其初始值)。完成后,构造函数返回它所构造的对象的一个参数。
编写构造函数
可以使用 new 运算符结合像 Object()Date() Function() 这样的预定义的构造函数来创建对象并对其初始化。面向对象的编程其强有力的特征是定义自定义构造函数以创建脚本中使用的自定义对象的能力。创建了自定义的构造函数,这样就可以创建具有已定义属性的对象。下面是自定义函数的示例(注意 this 关键字的使用)。
function Circle (xPoint, yPoint, radius) {
this.x = xPoint;// 圆心的 x 坐标。
this.y = yPoint;// 圆心的 y 坐标。
this.r = radius;// 圆的半径。
}
调用 Circle 构造函数时,给出圆心点的值和圆的半径(所有这些元素是完全定义一个独特的圆对象所必需的)。结束时 Circle 对象包含三个属性。下面是如何例示 Circle 对象。
var aCircle = new Circle(5, 11, 99);
使用原型来创建对象
在编写构造函数时,可以使用原型对象(它本身是所有构造函数的一个属性)的属性来创建继承属性和共享方法。原型属性和方法将按引用复制给类中的每个对象,因此它们都具有相同的值。可以在一个对象中更改原型属性的值,新的值将覆盖默认值,但仅在该实例中有效。属于这个类的其他对象不受此更改的影响。下面给出了使用自定义构造函数的示例,Circle(注意 this 关键字的使用)。
Circle.prototype.pi = Math.PI;
function ACirclesArea () {
return this.pi * this.r * this.r; // 计算圆面积的公式为 Πr²
}
Circle.prototype.area = ACirclesArea; // 计算圆面积的函数现在是 Circle Prototype 对象的一个方法。
var a = ACircle.area(); // 此为如何在 Circle 对象上调用面积函数。
使用这个原则,可以给预定义的构造函数(都具有原型对象)定义附加属性。例如,如果想要能够删除字符串的前后空格(与 VBScript Trim 函数类似),就可以给 String 原型对象创建自己的方法。
// 增加一个名为 trim 的函数作为
// String 构造函数的原型对象的一个方法。
String.prototype.trim = function()
{
// 用正则表达式将前后空格
// 用空字符串替代。
return this.replace(/(^\s*)|(\s*$)/g, "");
}
// 有空格的字符串
var s = " leading and trailing spaces ";
// 显示 " leading and trailing spaces (35)"
window.alert(s + " (" + s.length + ")");
// 删除前后空格
s = s.trim();
// 显示"leading and trailing spaces (27)"
window.alert(s + " (" + s.length + ")");
分享到:
评论

相关推荐

    转载40种转载40种网页常用小技巧(javascript)--备不时之需(javascript)--备不时之需

    这些对象可以用来控制浏览器窗口的状态,如最小化、最大化和关闭等。 以上技巧涵盖了从简单的HTML标签到较为复杂的JavaScript函数,适用于不同水平的开发者。这些技巧不仅能够提升网页的用户体验,还能够帮助开发者...

    Javascript - 全面理解 caller,callee,call,apply (转载)

    在JavaScript的函数对象中,`caller`属性表示调用当前函数的那个函数,而`callee`属性则是指代当前正在执行的函数本身。这两个属性在处理递归或者动态调用链时特别有用,因为它们可以提供关于调用栈的信息。 `...

    天地图JavaScript使用说明

    天地图JavaScript API允许开发者在网页中嵌入天地图服务,提供用户友好的交互接口,通过编程实现地图功能的扩展和自定义。用户可以通过API提供的接口与地图进行交互,添加各类信息内容,例如标注点、线、面等。 ###...

    Javascript 判断 object 的特定类转载

    然而,`typeof`并不适用于所有类型的对象,例如,它无法区分Array、Date或其他自定义构造函数创建的对象,因为它们都被视为"object"类型。这是因为JavaScript的设计原理,它将特定的类如Array、Date等都视作是Object...

    (转载文章)jquery日期显示中文

    3. 自定义格式化:由于JavaScript的Date对象不直接支持中文日期格式,所以需要编写自定义函数,将日期的各个部分(年、月、日)提取并转换为中文。例如,将月份转换为“一月”、“二月”等,日期为“一日”、“二日...

    js实现的3d效果(很炫+转载)

    1. **WebGL基础**:WebGL提供了一个上下文对象,通过这个对象,开发者可以设置渲染环境、创建几何形状、定义材质和光照,以及管理渲染管线。理解顶点坐标系统、颜色、纹理、视口等基本概念是至关重要的。 2. **3D...

    华为面试试题,很经典,转载

    【标题】华为面试试题,很经典,转载 在IT行业中,华为作为全球领先的信息与通信技术(ICT)解决方案供应商,其面试题目往往被视为衡量技术能力的重要标准。这些经典的面试问题涵盖了多个领域,不仅测试候选人的专业...

    15天学会JQuery(转载)

    4. **动画效果**: jQuery的`animate()`函数允许创建自定义动画,比如改变元素的宽度、高度、透明度等。同时,`fadeIn()`, `fadeOut()`, `slideToggle()`等预定义动画可快速实现常见效果。 5. **Ajax交互**: jQuery...

    query-zTree的基本用法(转载)

    zTree允许自定义节点图标,通过在`setting.data.icon`中设置`true`,并在`zNodes`节点对象中添加`iconSkin`属性来指定图标类名。 ### 10. 兼容与优化 zTree支持IE6+及现代浏览器,但在低版本IE中可能需要处理CSS和...

    [转载]常用的三种树形菜单

    这篇【转载】的博客文章“常用的三种树形菜单”探讨了实现这种交互方式的不同技术。尽管没有提供具体的文章内容,我们可以基于这个主题来深入讨论树形菜单的基本概念、实现方式以及相关的编程技术和工具。 1. **...

    javascript AutoScroller 函数类

    JavaScript AutoScroller是一个JavaScript类,用于在浏览器窗口中自动滚动元素,帮助开发者在Web页面上实现自动滚动效果。通过定义AutoScroll类,我们可以方便地将页面元素按设定的规则进行滚动。 AutoScroller类的...

    复制文章自动加上版权的功能实现方法(代码)

    3. **创建临时数据存储**:然后,我们需要创建一个新的`DataTransfer`对象,用于存储我们自定义的复制内容: ```javascript var data = new ClipboardEvent.clipboardData; ``` 4. **添加版权信息**:将原始内容与...

    xml 解析,下边是位哥们的全新奉献,这里我转载了,谢谢这位哥们。。

    在客户端,JavaScript可以使用XMLHttpRequest对象加载XML文件,然后使用DOM或SAX解析数据,实现动态更新页面。 总结起来,XML解析是理解和处理结构化数据的关键技能,无论是在服务器端还是客户端,都有广泛的应用。...

    被别人复制内容时加自己网址

    通过监听此事件,开发者可以实现对复制行为的自定义处理逻辑,例如修改复制到剪贴板的内容。 #### 1.2 使用场景 - **版权声明**:在博客或新闻网站上,为了保护原创内容并鼓励合法引用,可以在文章中加入这样的...

    GT-Grid 1.0 基础教程(一)转载

    数组中的每一项为一个JS对象或JS数组,每项代表单条数据(我们称之为“record”)。 **示例数据**: ```javascript var data1 = [ {no: 1, name: 'aaa', age: 12, gender: 'M', english: 76.5, math: 80}, {no: 2...

    【转载】去掉jquery menu plugin 的“No back link”

    3. JavaScript函数和对象:菜单功能通常通过函数实现,需要理解函数调用和作用域。 4. DOM遍历:熟悉如何在DOM树中移动,如`parent()`, `children()`, `siblings()`等方法。 5. 事件处理:如何绑定和触发事件,以及...

    转载 xStream完美转换XML、JSON

    JSON(JavaScript Object Notation)则是轻量级的数据交换格式,易于人阅读和编写,同时也易于机器解析和生成。在Web服务和前后端交互中,JSON应用广泛。 xStream的核心在于它的“Homoiconic”设计,即代码结构与...

    这个事ajax日历代码,希望对大家有帮助

    - XMLHttpRequest对象:是Ajax的核心,用于创建与服务器的通信连接并发送请求。 - `open()`方法:初始化请求,定义HTTP方法(GET、POST等)、URL和是否异步。 - `send()`方法:向服务器发送请求。如果是GET请求,...

    我的世界2D项目

    开发者可以通过JavaScript控制Canvas的上下文对象,绘制像素、线条、形状和图像,构建游戏世界的视觉元素。Canvas允许实时绘制和更新,非常适合游戏场景的动态变化。 另外,为了实现3D到2D的转换,项目可能使用了...

Global site tag (gtag.js) - Google Analytics