JavaScript 入门教程

JavaScript是一门Web编程语言，用来实现网页的交互功能，它和HTML、CSS共同组成了个Web开发的基础工具集合，也是前端开发者必备的技能；学习JavaScript教程可以了解它在网页开发中的所有特性和相关概念，让我们能够更加快速的去开发Web应用。

W3CAPI
1
2025-06-20 21:42:07
文档目录
我的书签
请登录
 

Object

JavaScript 对象 Object - 属性与方法

详细说明

所有JavaScript对象的父级。它是一种原生JavaScript对象类型。

可通过Object构造函数创建，例如new Object()。

JavaScript 对象属性

Name详细说明版本实现
constructor指定用于创建对象原型的函数。实现于JavaScript 1.2
prototype用于向对象添加新属性和方法。实现于JavaScript 1.2

JavaScript 对象方法

Name详细说明版本实现
tosource用于获取对象的字符串表示（源代码）。实现于JavaScript 1.2
tostring呈现指定对象的源代码。实现于JavaScript 1.2
valueof返回指定对象的原始值。实现于JavaScript 1.2
watch用于监听对象的特定属性。实现于JavaScript 1.2
unwatch用于移除通过watch()方法设置的特定属性的监视点。实现于JavaScript 1.2

JavaScript constructor 属性：Object对象

指定用于创建对象原型的函数。

语法说明

Object.constructor
执行一下

Object：对象的名称（必填）。

示例：

以下网页文档演示了构造器属性的应用方法。

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<meta http-equiv="content-type" content="text/html; charset=iso-8859-1" />
<title>JavaScript Object constructor Property :  Example-1</title>
</head>
<body><h1 style="color: red">JavaScript Object constructor Property</h1>
<hr />
<script type="text/javascript">
//This is done to make the following JavaScript code compatible to XHTML. <![CDATA[
myarray = new Array("Orange", "Apple", "Banana", "Cherry", "Mango");
if(myarray.constructor == Array){
document.write("Object is created...");
}
//]]>
</script>
</body>
</html>
执行一下

在浏览器中查看示例

JavaScript prototype 属性：Object对象

原型属性用于向对象添加新属性和方法。

语法说明

object.prototype.property 
object.prototype.method
执行一下

示例：

以下网页文档演示了如何应用prototype属性。

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<meta http-equiv="content-type" content="text/html; charset=iso-8859-1" />
<title>JavaScript object prototype property :  Example-1</title>
</head>
<body><h1 style="color: red">JavaScript object prototype property</h1>
<hr />
<script type="text/javascript">
//This is done to make the following JavaScript code compatible to XHTML. <![CDATA[
var mynum = new Number();
function square(x,y){
var numsqr;
numsqr = (x*x + 2*x*y + y*y);
return numsqr;
}
Number.prototype.sqrcal = square;
document.write("sqaure of (4+3) is  " +mynum.sqrcal(4,3) + "<br>");
//]]>
</script>
</body>
</html>
执行一下
在浏览器中查看示例

JavaScript toSource 方法：Object对象

toSource()方法用于获取对象的字符串表示（源代码）。

注意，Object对象的toSource方法属于非标准实现。

语法说明

toSource()
执行一下

代码说明

None

示例：

在下列网页文档中，tosource()方法返回给定对象的源代码。

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<meta http-equiv="content-type" content="text/html; charset=iso-8859-1" />
<title>JavaScript Object object - toSource() method example</title>
</head>
<body>
<h1 style="color: red">JavaScript object : toSource() method</h1>
<hr />
<script type="text/javascript">
//This is done to make the following JavaScript code compatible to XHTML. <![CDATA[
function student(name,class,rollno,sex)
{
this.name = name
this.class = class
this.rollno = rollno
tis.sex = sex
}
student1 = new student('Subhasish Chatterjee','VI',10,'M')
//Calling the toSource method of student1 displays the source which defines in the object.
document.write(student1.toSource());
//]]>
</script>
</body>
</html>
执行一下

支持的浏览器

IE浏览器7火狐3.6谷歌Chrome 7Safari 5.0.1 版Opera 10
YesYesYesYesYes

JavaScript toString 方法：Object对象

toString() 方法返回一个字符串，该字符串表示指定对象的源代码。

语法说明

Object.toString()
执行一下

代码说明

None

示例：

在如下网页文档中，toString() 方法返回给定对象的字符串表示形式。

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<meta http-equiv="content-type" content="text/html; charset=iso-8859-1" />
<title>JavaScript object - toString() method example</title>
</head>
<body>
<h1 style="color: red">JavaScript object : toString() method</h1>
<hr />
<script type="text/javascript">
//This is done to make the following JavaScript code compatible to XHTML. <![CDATA[
<script type="text/javascript">
function Student(name,standard,rollno,sex) {
this.name=name;
this.standard=standard;
this.rollno=rollno;
this.sex=sex;
}
theStudent = new Student("Subhasish Chatterjee","VI",10,"Male");
document.write(theStudent.toString());
</script>
//]]>
</script>
</body>
</html>
执行一下

在浏览器中查看示例

支持的浏览器

IE浏览器7火狐3.6谷歌Chrome 7Safari 5.0.1 版Opera 10
YesYesYesYesYes

JavaScript valueOf方法：Object对象

valueOf() 方法返回指定对象的原始值。

语法说明

valueOf()
执行一下

代码说明

None

示例：

在下列网络文档中，valueOf()方法用于获取数值对象的原始值。

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<meta http-equiv="content-type" content="text/html; charset=iso-8859-1" />
<title>JavaScript object - valueOf() method example</title>
</head>
<body>
<h1 style="color: red">JavaScript object : valueOf() method</h1>
<hr />
<script type="text/javascript">
//This is done to make the following JavaScript code compatible to XHTML. <![CDATA[
var x = Number(201);
document.write(x.valueOf());
//]]>
</script>
</body>
</html>
执行一下

在浏览器中查看示例

支持的浏览器

IE浏览器7火狐3.6谷歌Chrome 7Safari 5.0.1 版Opera 10
YesYesYesYesYes

JavaScript watch() 方法：Object对象

这个watch() 方法用于监视对象的特定属性。当该属性被修改时，watch()方法将被触发并执行相应的函数。

语法说明

watch(prop, handler)
执行一下

代码说明

prop: 对象属性的名称。
handler: 待调用的函数。

示例：

以下网页文档演示了如何使用watch()方法。

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<meta http-equiv="content-type" content="text/html; charset=iso-8859-1" />
<title>JavaScript Object - watch () method example</title>
</head>
<body>
<h1 style="color: red">JavaScript Object : watch() method</h1>
<hr />
<script type="text/javascript">
//This is done to make the following JavaScript code compatible to XHTML. <![CDATA[
o = {x:10}
o.watch("x",
function (id,oldvalue,newvalue) {
document.writeln("o." + id + " changed from " 
+ oldvalue + " to " + newvalue+"<br />")
return newvalue
})
o.x = 20
o.x = 30
o.x = 40
//]]>
</script>
</body>
</html>
执行一下

在浏览器中查看示例

支持的浏览器

IE浏览器7火狐3.6谷歌Chrome 7Safari 5.0.1 版Opera 10
YesYesYesYesYes

JavaScript unwatch() 方法：Object对象

对象的unwatch()方法用于移除通过watch()方法为特定属性设置的观察点。

语法说明

unwatch(prop)
执行一下

代码说明

prop: 对象属性的名称。

示例：

下述网页文档演示了如何运用unwatch()方法。

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<meta http-equiv="content-type" content="text/html; charset=iso-8859-1" />
<title>JavaScript Object - unwatch () method example</title>
</head>
<body>
<h1 style="color: red">JavaScript Object : unwatch() method</h1>
<hr />
<script type="text/javascript">
//This is done to make the following JavaScript code compatible to XHTML. <![CDATA[
a = {x:10}
a.watch("x",
function (id,oldvalue,newvalue) {
document.write("a." + id + " changed from " 
+ oldvalue + " to " + newvalue+"<br />")
return newvalue
})
a.x = 20
a.x = 30
a.x = 40
// start unwatch from here
a.unwatch('x')
a.x = 100
document.write("Current value of x is : "+a.x)
//]]>
</script>
</body>
</html>
执行一下

在浏览器中查看示例

支持的浏览器

IE浏览器7火狐3.6谷歌Chrome 7Safari 5.0.1 版Opera 10
YesYesYesYesYes

另请参阅：
JavaScript 核心对象、方法及属性。

上一篇：JavaScript valueOf 方法：数值对象
下一篇：JavaScript：正则表达式

作者文档
相关提问
敬请期待
W3CAPI 在线教程 | 菜鸟教程_LOGO
以API的视角诠释计算机技术
W3CAPI 在线教程 | 菜鸟教程 © 2018 版权所有 / 豫ICP备18043494号-2
W3CAPI 在线教程 | 菜鸟教程_微信公众号
扫一扫关注官方微信公众号
友情提示