JavaScript 入门教程

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

W3CAPI
1
2020-06-18 07:05:48
文档目录
我的书签
请登录
 

Function

JavaScript 函数（Function）对象——属性与方法

详细说明

JavaScript 函数对象用于定义一段JavaScript代码。该代码可在JavaScript程序中按需调用。

可通过函数构造器创建。

由函数定义的代码可通过：函数名() 的形式调用。

JavaScript 函数对象属性

Name详细说明版本实现
arguments与传入函数参数相对应的数组。于JavaScript 1.1中实现
arguments.callee引用当前正在执行的函数。于JavaScript 1.1中实现
arguments.length表示函数定义的形参数量。于JavaScript 1.1中实现
constructor指定用于创建对象的函数。于JavaScript 1.1中实现
length函数定义的参数数量。于JavaScript 1.1中实现
prototype允许向函数对象添加属性。于JavaScript 1.1中实现

JavaScript 函数对象方法

Name详细说明版本实现
call允许在另一对象（即调用对象）的上下文中调用其他对象的方法。于JavaScript 1.1中实现
toSource返回该函数的源代码。于JavaScript 1.1中实现
toString返回表示该函数源代码的字符串。于JavaScript 1.1中实现
valueOf返回表示该函数源代码的字符串。于JavaScript 1.1中实现

JavaScript arguments 属性：函数对象

arguments数组是作为函数参数存在于所有函数对象内部的局部变量；函数的arguments属性已不再使用。
该数组包含传递给函数的每个参数对应的条目。


例如，若某函数接收三个参数，可通过如下方式引用这些参数：
arguments[0]
arguments[1]
arguments[2]

arguments数组亦可随函数名声明：
myfunc.arguments[0]
myfunc.arguments[1]
myfunc.arguments[2]
其中 myfunc 为函数名称。

arguments 数组仅在函数体内可用。在函数声明之外尝试访问 arguments 数组将导致错误。

若调用函数时传递的参数数量超过其正式声明接收的参数参数，可以使用arguments数组。该技术特别适用于处理可变数量参数的函数。通过arguments.length可确定实际传递给函数的参数数量，并利用arguments数组对各个参数进行逐一处理。

arguments 数组包含三个属性：arguments.callee、arguments.caller 和 arguments.length。

注释：arguments.caller 属性用于指定调用当前正在执行函数的函数名称。该属性已被弃用。

JavaScript arguments.callee 属性：函数对象

这个arguments.callee属性指代当前正在执行的函数。仅在函数体内可用。

语法说明

arguments.callee
执行一下

示例：

在以下网页文档中arguments.callee属性用于通过调用factorial()函数计算数值的阶乘。

<!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 Function object - arguments.callee property example</title>
</head>
<body>
<h1 style="color: red">JavaScript Function object : arguments.callee property</h1>
<hr />
<script type="text/javascript">
//This is done to make the following JavaScript code compatible to XHTML. <![CDATA[
function factorial(n){
if (n <= 0)
return 1;
else
return arguments.callee(n - 1)
}
document.write(factorial(4));
//]]>
</script>
</body>
</html>
执行一下

在浏览器中查看示例

支持的浏览器

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

JavaScript arguments.length 属性：函数对象

这个arguments.length指定函数定义时声明的参数数量。

语法说明

arguments.length
执行一下

函数对象示例：arguments.length 属性

以下网页文档演示了arguments.length 属性的用法。

<!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 Function object - arguments.length property example</title>
</head>
<body>
<h1 style="color: red">JavaScript Function object : arguments.length property</h1>
<hr />
<script type="text/javascript">
//This is done to make the following JavaScript code compatible to XHTML. <![CDATA[
function rglength(x,y,z)
{
return ;
}
alert('No. of arguments passed in the function : '+rglength.length)
//]]>
</script>
</body>
</html>
执行一下

在浏览器中查看示例

支持的浏览器

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

JavaScript constructor 属性：函数对象

constructor属性指定了创建该对象的构造函数。

语法说明

constructor
执行一下

参数说明

MyFunction.constructor

MyFunction：函数名称（必填）。

示例：

以下网页文档演示了constructor属性的使用方式。

<!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 Function object - constructor property example</title>
</head>
<body>
<h1 style="color: red">JavaScript Function object : constructor property</h1>
<hr />
<script type="text/javascript">
//This is done to make the following JavaScript code compatible to XHTML. <![CDATA[
myfunction = new Function("Orange", "Apple", "Banana");
document.write("The object is constructed from : "+myfunction.constructor); 
//]]>
</script>
</body>
</html>
执行一下

在浏览器中查看示例

支持的浏览器

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

JavaScript length 属性：函数对象

这个length属性标识当前函数所定义的参数数量。

语法说明

length
执行一下

参数说明

MyFunction.length

MyFunction：函数名称（必填）。

示例：

以下网页文档展示了如何使用length属性。

<!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 Function object - length property example</title>
</head>
<body>
<h1 style="color: red">JavaScript Function object : length property</h1>
<hr />
<script type="text/javascript">
//This is done to make the following JavaScript code compatible to XHTML. <![CDATA[
function rglength(x,y,z)
{
return ;
}
alert('No. of arguments passed in the function : '+rglength.length)
//]]>
</script>
</body>
</html>
执行一下

在浏览器中查看示例

JavaScript 原型属性：函数对象

Prototype用于添加新properties（属性）和methods（方法）到函数对象中。

语法说明

myobj.prototype.name = value
执行一下

myobj：要修改的构造函数对象的名称。

name：要创建的属性或方法的名称。

value: 初始赋值给新属性或方法的值。

若向某个对象的原型添加一个属性，则所有通过该对象的构造函数创建的对象都将拥有该新属性，即使这些对象在新属性创建之前已存在。

示例：

在以下网页文档中，新增一个方法到函数原型中，返回个人全名的功能。

<!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 Function object - prototype  property example</title>
<script type="text/javascript">
//This is done to make the following JavaScript code compatible to XHTML. <![CDATA[
function my_name(first_name, last_name)
{
this.first_name = first_name;
this.last_name  = last_name;
}
function full_name()
{
final_name = this.first_name +'   ' + this.last_name
return  final_name;
}
//]]>
</script>
</head>
<body>
<h1 style="color: red">JavaScript Function object : prototype  property</h1>
<hr />
<script type="text/javascript">
//This is done to make the following JavaScript code compatible to XHTML. <![CDATA[
my_name.prototype.fullname = full_name;
var a = new my_name("David", "Rayy");
var b = a.fullname( );
document.write("Name : "+b); 
//]]>
</script>
</body>
</html>
执行一下

在浏览器中查看示例

JavaScript call() 方法：函数对象

函数对象的call()方法，用于调用（执行）另一个对象的方法。

语法说明

Call(this, arg1, agr2, arg3.............)
执行一下

参数说明

this：要调用的对象。

arg1、arg2……该对象的参数

示例：

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

<!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 Function object - call method example</title>
</head>
<body>
<h1 style="color: red">JavaScript Function object : call method</h1>
<hr />
<script type="text/javascript">
//This is done to make the following JavaScript code compatible to XHTML. <![CDATA[
// Create a student object.
function student(class, name)
{
this.name = name;
this.class = true;
}
// Create a class object
function class(name, rollno)
{
this.rollno = rollno;
student.call(this, name);
}
class.prototype = new student()
// Creates a new student
student1 = new class("David", 2);
//]]>
</script>
</body>
</html>
执行一下

支持的浏览器

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

JavaScript toSource() 方法：函数对象

这个toSource()方法返回表示该函数源代码的字符串。

语法说明

toSource()
执行一下

参数说明

None

示例：

在以下网页文档中toSource()方法返回 函数对象employee 的源代码。

<!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 Function object - toSource() method example</title>
</head>
<body>
<h1 style="color: red">JavaScript Function object : toSource() method</h1>
<hr />
<script type="text/javascript">
//This is done to make the following JavaScript code compatible to XHTML. <![CDATA[
function employee(name,qualification,bornyear)
{
this.name = name;
this.qualification = qualification;
this.bornyear = bornyear;
}
var emp=new employee("Arvind Murthy", "Master Degree", 1980);
document.write(emp.toSource());
//]]>
</script>
</body>
</html>
执行一下

在浏览器中查看示例

支持的浏览器

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

JavaScript toString() 方法：函数对象

这个toString() 方法返回表示该函数对象源代码的字符串。

语法说明

toString()
执行一下

参数说明

None

示例：

在以下网页文档中toString() 方法返回表示 Test()函数对象 源代码的字符串。

<!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 Function object - toString() method example</title>
</head>
<body>
<h1 style="color: red">JavaScript Function object : toString() method</h1>
<hr />
<script type="text/javascript">
//This is done to make the following JavaScript code compatible to XHTML. <![CDATA[
function Test()
{
var x;
var y;
document.write('www.w3capi.com');
}
var newfunc = Test.toString();
document.write("The source code of the function : "+newfunc );
//]]>
</script>
</body>
</html>
执行一下

在浏览器中查看示例

支持的浏览器

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

JavaScript valueOf() 方法：函数对象

这个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 Function object - valueOf() method example</title>
</head>
<body>
<h1 style="color: red">JavaScript Function object : valueOf() method</h1>
<hr />
<script type="text/javascript">
//This is done to make the following JavaScript code compatible to XHTML. <![CDATA[
document.write("Returned value from calling valueOf() on " +
"the Test function." + "<br><br>");
document.write( "<b>" + Test() );
function Test()
{
var x;
var y;
return (Test.valueOf() );
}
//]]>
</script>
</body>
</html>
执行一下

在浏览器中查看示例

支持的浏览器

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

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

上一篇：JavaScript valueOf()方法：日期（Date）对象
下一篇：JavaScript Math 对象 - 属性与方法

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