JavaScript 对象

JavaScript 对象简介

JavaScript 是面向对象的编程语言 (OOP)。

OOP 语言使我们有能力自定义对象和变量类型。

面向对象编程

JavaScript 是面向对象的编程语言 (OOP)。OOP 语言使我们有能力定义自己的对象和变量类型。

别着急,我们会在高级 JavaScript 的部分讲解如何创建自己的对象。现在,我们要开始学习内建的 JavaScript 对象,以及如何使用它们。从下一节开始,我们将具体地依次讲解的这些内建的 JavaScript 对象。

注意:对象只是一种特殊的数据。对象拥有属性和方法。

属性

属性指与对象有关的值。

在下面的例子中,我们使用字符串对象的长度属性来计算字符串中的字符数目。

<script type="text/javascript">

var txt="Hello World!"
document.write(txt.length)

</script>

上面的代码输出为:

12

方法

方法指对象可以执行的行为(或者可以完成的功能)。

在下面的例子中,我们使用字符串对象的 toUpperCase() 方法来显示大写字母文本。

<script type="text/javascript">

var str="Hello world!"
document.write(str.toUpperCase())

</script>

上面的代码输出为:

HELLO WORLD!
 

JavaScript 字符串(String)对象

String 对象用于处理已有的字符块。

JavaScript String(字符串)对象 实例

计算字符串的长度
如何使用长度属性来计算字符串的长度。
为字符串添加样式
如何为字符串添加样式。
indexOf() 方法
如何使用 indexOf() 来定位字符串中某一个指定的字符首次出现的位置。
match() 方法
如何使用 match() 来查找字符串中特定的字符,并且如果找到的话,则返回这个字符。
如何替换字符串中的字符 - replace()
如何使用 replace() 方法在字符串中用某些字符替换另一些字符。

完整的 String 对象参考手册

请查看我们的 JavaScript String 对象参考手册,其中提供了可以与字符串对象一同使用的所有的属性和方法。

这个手册包含的关于每个属性和方法的用法的详细描述和实例。

字符串对象

字符串对象用于处理已有的字符块。

例子:

下面的例子使用字符串对象的长度属性来计算字符串的长度。

var txt="Hello world!"
document.write(txt.length)

上面的代码输出为:

12

下面的例子使用字符串对象的toUpperCase()方法将字符串转换为大写:

var txt="Hello world!"
document.write(txt.toUpperCase())

上面的代码输出为:

HELLO WORLD!
 

JavaScript Date(日期)对象

日期对象用于处理日期和时间。

JavaScript Date(日期)对象 实例

返回当日的日期和时间
如何使用 Date() 方法或者当日的日期。
getTime()
使用 getTime() 计算从 1970 年到今天有多少年。
setFullYear()
如何使用 setFullYear() 得到精确的日期。
toUTCString()
如何使用 toUTCString() 将当日的日期(根据 UTC)转换为字符串。
getDay()
如何使用 getDay() 来显示星期,而不仅仅是数字。
显示一个钟表
如何在网页上显示一个钟表。

完整的 Date 对象参考手册

我们提供 JavaScript Date 对象参考手册,其中包括所有可用于日期对象的属性和方法。

该手册包含了对每个属性和方法的详细描述以及相关实例。

定义日期

Date 对象用于处理日期和时间。

可以通过 new 关键词来定义 Date 对象。以下代码定义了名为 myDate 的 Date 对象:

var myDate=new Date() 

注释:Date 对象自动使用当前的日期和时间作为其初始值。

操作日期

通过使用针对日期对象的方法,我们可以很容易地对日期进行操作。

在下面的例子中,我们为日期对象设置了一个特定的日期 (2008 年 8 月 9 日):

var myDate=new Date()
myDate.setFullYear(2008,7,9)

注意:表示月份的参数介于 0 到 11 之间。也就是说,如果希望把月设置为 8 月,则参数应该是 7。

在下面的例子中,我们将日期对象设置为 5 天后的日期:

var myDate=new Date()
myDate.setDate(myDate.getDate()+5)

注意:如果增加天数会改变月份或者年份,那么日期对象会自动完成这种转换。

比较日期

日期对象也可用于比较两个日期。

下面的代码将当前日期与 2008 年 8 月 9 日做了比较:

var myDate=new Date();
myDate.setFullYear(2008,7,9);

var today = new Date();

if (myDate>today)
{
alert("Today is before 9th August 2008");
}
else
{
alert("Today is after 9th August 2008");
}
 

JavaScript Array(数组)对象

数组对象的作用是:使用单独的变量名来存储一系列的值。

实例

创建数组
创建数组,为其赋值,然后输出这些值。
For...In 声明
使用 for...in 声明来循环输出数组中的元素。
合并两个数组 - concat()
如何使用 concat() 方法来合并两个数组。
用数组的元素组成字符串 - join()
如何使用 join() 方法将数组的所有元素组成一个字符串。
文字数组 - sort()
如何使用 sort() 方法从字面上对数组进行排序。
数字数组 - sort()
如何使用 sort() 方法从数值上对数组进行排序。

完整的 Array 对象参考手册

我们提供 JavaScript Array 对象参考手册,其中包括所有可用于数组对象的属性和方法。

该手册包含了对每个属性和方法的详细描述以及相关实例。

定义数组

数组对象用来在单独的变量名中存储一系列的值。

我们使用关键词 new 来创建数组对象。下面的代码定义了一个名为 myArray 的数组对象:

var myArray=new Array()

有两种向数组赋值的方法(你可以添加任意多的值,就像你可以定义你需要的任意多的变量一样)。

1:

var mycars=new Array()
mycars[0]="Saab"
mycars[1]="Volvo"
mycars[2]="BMW"

也可以使用一个整数自变量来控制数组的容量:

var mycars=new Array(3)
mycars[0]="Saab"
mycars[1]="Volvo"
mycars[2]="BMW"

2:

var mycars=new Array("Saab","Volvo","BMW")

注意:如果你需要在数组内指定数值或者逻辑值,那么变量类型应该是数值变量或者布尔变量,而不是字符变量。

访问数组

通过指定数组名以及索引号码,你可以访问某个特定的元素。

下面是代码行:

document.write(mycars[0])

下面是输出:

Saab

修改已有数组中的值

如需修改已有数组中的值,只要向指定下标号添加一个新值即可:

mycars[0]="Opel";

现在,以上代码:

document.write(mycars[0]);

将输出:

Opel

 

 

 

JavaScript Boolean(逻辑)对象

Boolean(逻辑)对象用于将非逻辑值转换为逻辑值(true 或者 false)。

实例

检查逻辑值
检查逻辑对象是 true 还是 false。

完整的 Boolean 对象参考手册

我们提供 JavaScript Boolean 对象参考手册,其中包括所有可用于数组对象的属性和方法。

该手册包含了对每个属性和方法的详细描述以及相关实例。

Boolean 对象

您可以将 Boolean 对象理解为一个产生逻辑值的对象包装器。

Boolean(逻辑)对象用于将非逻辑值转换为逻辑值(true 或者 false)。

使用关键词 new 来定义 Boolean 对象。下面的代码定义了一个名为 myBoolean 的逻辑对象:

var myBoolean=new Boolean()

注释:如果逻辑对象无初始值或者其值为 0、-0、null、""、false、undefined 或者 NaN,那么对象的值为 false。否则,其值为 true(即使当自变量为字符串 "false" 时)!

下面的所有的代码行均会创建初始值为 false 的 Boolean 对象。

var myBoolean=new Boolean()
var myBoolean=new Boolean(0)
var myBoolean=new Boolean(null)
var myBoolean=new Boolean("")
var myBoolean=new Boolean(false)
var myBoolean=new Boolean(NaN)

下面的所有的代码行均会创初始值为 true 的 Boolean 对象:

var myBoolean=new Boolean(true)
var myBoolean=new Boolean("true")
var myBoolean=new Boolean("false")
var myBoolean=new Boolean("Richard")

 

JavaScript Math(算数)对象

Math(算数)对象的作用是:执行常见的算数任务。

实例

round()
如何使用 round()。
random()
如何使用 random() 来返回 0 到 1 之间的随机数。
max()
如何使用 max() 来返回两个给定的数中的较大的数。
min()
如何使用 min() 来返回两个给定的数中的较小的数。

完整的 Math 对象参考手册

我们提供 JavaScript Math 对象的参考手册,其中包括所有可用于数组对象的属性和方法。

该手册包含了对每个属性和方法的详细描述以及相关实例。

Math 对象

Math(算数)对象的作用是:执行普通的算数任务。

Math 对象提供多种算数值类型和函数。无需在使用这个对象之前对它进行定义。

算数值

JavaScript 提供 8 种可被 Math 对象访问的算数值:

  • 常数
  • 圆周率
  • 2 的平方根
  • 1/2 的平方根
  • 2 的自然对数
  • 10 的自然对数
  • 以 2 为底的 e 的对数
  • 以 10 为底的 e 的对数

这是在 Javascript 中使用这些值的方法:(与上面的算数值一一对应)

  • Math.E
  • Math.PI
  • Math.SQRT2
  • Math.SQRT1_2
  • Math.LN2
  • Math.LN10
  • Math.LOG2E
  • Math.LOG10E

算数方法

除了可被 Math 对象访问的算数值以外,还有几个函数(方法)可以使用。

函数(方法)实例:

下面的例子使用了 Math 对象的 round 方法对一个数进行四舍五入。

document.write(Math.round(4.7))

上面的代码输出为:

5

下面的例子使用了 Math 对象的 random() 方法来返回一个介于 0 和 1 之间的随机数:

document.write(Math.random())

上面的代码输出为:

0.9370844220218102

下面的例子使用了 Math 对象的 floor() 方法和 random() 来返回一个介于 0 和 10 之间的随机数:

document.write(Math.floor(Math.random()*11)) 

上面的代码输出为:

3

JavaScript RegExp 对象

RegExp 对象用于规定在文本中检索的内容。

什么是 RegExp?

RegExp 是正则表达式的缩写。

当您检索某个文本时,可以使用一种模式来描述要检索的内容。RegExp 就是这种模式。

简单的模式可以是一个单独的字符。

更复杂的模式包括了更多的字符,并可用于解析、格式检查、替换等等。

您可以规定字符串中的检索位置,以及要检索的字符类型,等等。

定义 RegExp

RegExp 对象用于存储检索模式。

通过 new 关键词来定义 RegExp 对象。以下代码定义了名为 patt1 的 RegExp 对象,其模式是 "e":

var patt1=new RegExp("e");

当您使用该 RegExp 对象在一个字符串中检索时,将寻找的是字符 "e"。

RegExp 对象的方法

RegExp 对象有 3 个方法:test()、exec() 以及 compile()。

test()

test() 方法检索字符串中的指定值。返回值是 true 或 false。

例子:

var patt1=new RegExp("e");

document.write(patt1.test("The best things in life are free")); 

由于该字符串中存在字母 "e",以上代码的输出将是:

true

TIY

exec()

exec() 方法检索字符串中的指定值。返回值是被找到的值。如果没有发现匹配,则返回 null。

例子 1:

var patt1=new RegExp("e");

document.write(patt1.exec("The best things in life are free")); 

由于该字符串中存在字母 "e",以上代码的输出将是:

e

TIY

例子 2:

您可以向 RegExp 对象添加第二个参数,以设定检索。例如,如果需要找到所有某个字符的所有存在,则可以使用 "g" 参数 ("global")。

如需关于如何修改搜索模式的完整信息,请访问我们的 RegExp 对象参考手册

在使用 "g" 参数时,exec() 的工作原理如下:

  • 找到第一个 "e",并存储其位置
  • 如果再次运行 exec(),则从存储的位置开始检索,并找到下一个 "e",并存储其位置
var patt1=new RegExp("e","g");
do
{
result=patt1.exec("The best things in life are free");
document.write(result);
}
while (result!=null) 

由于这个字符串中 6 个 "e" 字母,代码的输出将是:

eeeeeenull

TIY

compile()

compile() 方法用于改变 RegExp。

compile() 既可以改变检索模式,也可以添加或删除第二个参数。

例子:

var patt1=new RegExp("e");

document.write(patt1.test("The best things in life are free"));

patt1.compile("d");

document.write(patt1.test("The best things in life are free"));

由于字符串中存在 "e",而没有 "d",以上代码的输出是:

truefalse

TIY

完整的 RegExp 对象参考手册

如需可与 RegExp 对象一同使用所有属性和方法的完整信息,请访问我们的 RegExp 对象参考手册

这个参考手册包含了对 RegExp 对象中每个属性和方法的详细描述,以及使用的例子。

 

JavaScript HTML DOM 对象

除了内置的 JavaScript 对象以外,你还可以使用 JavaScript 访问并处理所有的 HTML DOM 对象。

更多 JavaScript 对象

点击以下链接,可以获得以下对象的更多信息,包括它们的集合、属性、方法以及事件。

对象描述
WindowJavaScript 层级中的顶层对象。Windows 对象会呈现 (represent) 一个浏览器窗口。每当 <body> 或者 <frameset> 标签出现,Window 对象就会被自动创建。
Navigator包含客户端浏览器的信息。
Screen包含客户端显示屏的信息。
History包含了浏览器窗口访问过的 URL。
Location包含了当前URL的信息。

HTML DOM

HTML DOM 是 W3C 标准(是 HTML 文档对象模型的英文缩写,Document Object Model for HTML)。

HTML DOM 定义了用于 HTML 的一系列标准的对象,以及访问和处理 HTML 文档的标准方法。

通过 DOM,可以访问所有的 HTML 元素,连同它们所包含的文本和属性。可以对其中的内容进行修改和删除,同时也可以创建新的元素。

HTML DOM 独立于平台和编程语言。它可被任何编程语言诸如 Java、JavaScript 和 VBScript 使用。

点击下面的链接,可获得更多关于如何使用 JavaScript 来访问和处理 DOM 对象的知识:

对象描述
Document代表整个 HTML 文档,用来访问页面中的所有元素。
Anchor代表 <a> 元素。
Area代表图像地图中的 <area> 元素。
Base代表 <base> 元素。
Body代表图像地图中的 <body> 元素。
Button代表 <button> 元素。
Event代表事件的状态
Form代表 <form> 元素
Frame代表 <frame> 元素
Frameset代表 <frameset> 元素
Iframe代表 <iframe> 元素
Image代表 <img> 元素
Input button代表 HTML 表单中的按钮
Input checkbox代表 HTML 表单中的选择框
Input file代表 HTML 表单中的 fileupload 。
Input hidden代表 HTML 表单中的隐藏域。
Input password代表 HTML 表单中的密码域。
Input radio代表 HTML 表单中的单选框。
Input reset代表 HTML 表单中的重置按钮。
Input submit代表 HTML 表单中的确认按钮。
Input text代表 HTML 表单中的文本输入域。
Link代表 <link> 元素
Meta代表 <meta> 元素
Object代表一个 <Object> 元素
Option代表 <option> 元素
Select代表 HTML 表单中的选择列表。
Style代表某个单独的样式声明。
Table代表 <table> 元素。
TableData代表 <td> 元素。
TableRow代表 <tr> 元素。
Textarea代表 <textarea> 元素。
posted @ 2009-05-30 22:26  minmin8110  阅读(222)  评论(0)    收藏  举报