理解JavaScript函数(函数和对象的区别和联系)

简介:

函数对象和其他内部对象的关系

 


除了函数对象,还有很多内部对象,比如:Object、Array、Date、RegExp、Math、Error。这些名称实际上表示一个类型,可以通过new操作符返回一个对象。然而函数对象和其他对象不同,当用typeof得到一个函数对象的类型时,它仍然会返回字符串“function”,而typeof一个数组对象或其他的对象时,它会返回字符串“object”。下面的代码示例了typeof不同类型的情况:

以下是引用片段:

1
2
3
4
5
6
7
alert( typeof (Function)));
alert( typeof ( new  Function()));
alert( typeof (Array));
alert( typeof (Object));
alert( typeof ( new  Array()));
alert( typeof ( new  Date()));
alert( typeof ( new  Object()));


运行这段代码可以发现:前面4条语句都会显示“function”,而后面3条语句则显示“object”,可见new一个function实际上是返回一个函数。这与其他的对象有很大的不同。其他的类型Array、Object等都会通过new操作符返回一个普通对象。尽管函数本身也是一个对象,但它与普通的对象还是有区别的,因为它同时也是对象构造器,也就是说,可以new一个函数来返回一个对象,这在前面已经介绍。所有typeof返回“function”的对象都是函数对象。也称这样的对象为构造器(constructor),因而,所有的构造器都是对象,但不是所有的对象都是构造器。

  既然函数本身也是一个对象,它们的类型是function,联想到C++、Java等面向对象语言的类定义,可以猜测到Function类型的作用所在,那就是可以给函数对象本身定义一些方法和属性,借助于函数的prototype对象,可以很方便地修改和扩充Function类型的定义,例如下面扩展了函数类型Function,为其增加了method1方法,作用是弹出对话框显示"function":

以下是引用片段:

1
2
3
4
5
6
7
8
Function.prototype.method1= function (){
       alert( "function" );
}
function  func1(a,b,c){
       return  a+b+c;
}
func1.method1();
func1.method1.method1();


注意最后一个语句:func1.method1.mehotd1(),它调用了method1这个函数对象的method1方法。虽然看上去有点容易混淆,但仔细观察一下语法还是很明确的:这是一个递归的定义。因为method1本身也是一个函数,所以它同样具有函数对象的属性和方法,所有对Function类型的方法扩充都具有这样的递归性质。

  Function是所有函数对象的基础,而Object则是所有对象(包括函数对象)的基础。在JavaScript中,任何一个对象都是Object的实例,因此,可以修改Object这个类型来让所有的对象具有一些通用的属性和方法,修改Object类型是通过prototype来完成的:

以下是引用片段:

1
2
3
4
5
6
7
8
9
Object.prototype.getType= function (){
        return  typeof ( this );
}
var  array1= new  Array();
function  func1(a,b){
       return  a+b;
}
alert(array1.getType());
alert(func1.getType());


上面的代码为所有的对象添加了getType方法,作用是返回该对象的类型。两条alert语句分别会显示“object”和“function”。

      将函数作为参数传递

  在前面已经介绍了函数对象本质,每个函数都被表示为一个特殊的对象,可以方便的将其赋值给一个变量,再通过这个变量名进行函数调用。作为一个变量,它可以以参数的形式传递给另一个函数,这在前面介绍JavaScript事件处理机制中已经看到过这样的用法,例如下面的程序将func1作为参数传递给func2:

以下是引用片段:

1
2
3
4
5
6
7
function  func1(theFunc){
       theFunc();
}
function  func2(){
       alert( "ok" );
}
func1(func2);

  在最后一条语句中,func2作为一个对象传递给了func1的形参theFunc,再由func1内部进行theFunc的调用。事实上,将函数作为参数传递,或者是将函数赋值给其他变量是所有事件机制的基础。

例如,如果需要在页面载入时进行一些初始化工作,可以先定义一个init的初始化函数,再通过window.onload=init;语句将其绑定到页面载入完成的事件。这里的init就是一个函数对象,它可以加入window的onload事件列表。








本文转自豪情博客园博客,原文链接:http://www.cnblogs.com/jikey/archive/2010/04/28/1722971.html,如需转载请自行联系原作者


目录
相关文章
|
1天前
|
设计模式 JavaScript 前端开发
JS 代码中变量和函数的正确写法总结
**代码规范与最佳实践摘要** 1. 使用可读性强的变量名,如`currentDate`代替`yyyymmdstr`。 2. 对同一类型变量使用相似命名,如`getUser()`代替`getUserInfo()`。 3. 变量名应具有描述性,避免使用难以理解的数字,如`MILLISECONDS_IN_A_DAY`代替`86400000`。
13 2
|
1天前
|
JavaScript
js 判断对象内所有值为空
js 判断对象内所有值为空
|
1天前
|
JavaScript 前端开发
JavaScript进阶-模板字符串与增强的对象字面量
【6月更文挑战第19天】ES6的模板字符串和增强对象字面量提高了JavaScript的易读性和效率。模板字符串(` `)支持变量嵌入和多行,简化了字符串处理;增强对象字面量允许简写属性与方法,以及动态属性名。注意模板字符串的闭合和性能影响,以及对象字面量的简写语法和计算属性名的恰当使用。通过实例展示了这两项特性的应用,助力编写更优雅的代码。
|
1天前
|
JavaScript 前端开发
js数组包对象格式怎么根据不同的键值使用sort排序一组数组
js数组包对象格式怎么根据不同的键值使用sort排序一组数组
|
1天前
|
JavaScript 前端开发 容器
JavaScript函数学习
JavaScript函数学习
|
1天前
|
JavaScript 前端开发 API
ECMAScript vs JavaScript: 理解两者间的联系与区别
ECMAScript vs JavaScript: 理解两者间的联系与区别
|
2天前
|
JavaScript 前端开发 开发者
【JavaScript】JavaScript中call、apply与bind的区别:进阶特性与应用场景
【JavaScript】JavaScript中call、apply与bind的区别:进阶特性与应用场景
7 0
|
2天前
|
SQL 自然语言处理 前端开发
【JavaScript】ECMAS6(ES6)新特性概览(一):变量声明let与const、箭头函数、模板字面量全面解析
【JavaScript】ECMAS6(ES6)新特性概览(一):变量声明let与const、箭头函数、模板字面量全面解析
7 2
|
2天前
|
设计模式 存储 JavaScript
【JavaScript】JavaScript对象设计哲学:八种模式塑造高效代码
【JavaScript】JavaScript对象设计哲学:八种模式塑造高效代码
14 5
|
2天前
|
JavaScript 前端开发
JavaScript 数组的函数 map/forEach/reduce/filter
JavaScript 数组的函数 map/forEach/reduce/filter