JavaScript高级程序设计读书笔记之八 Function类及闭包

更新时间：2012年02月27日 23:48:59 作者：

Function类及闭包，学习js的朋友可以参考下

Function类

定义
　　Function类可以表示开发者定义的任何函数，用Function类直接创建函数的语法如下：

var function_name=new Function(agrument1,agrument2,...,argumentN,function_body);
　　每个argument都是一个参数，最后一个参数是函数主体(要执行的代码)。

　　示例：

复制代码代码如下:

 
function sayHi(sName,sMessage){ 
alert("Hello "+sName+","+sMessage); 
} 

还可以如下定义它：
var sayHi=new Function("sName","sMessage","alert(\"Hello\"+sName+\",\"+sMessage);");
　　注：尽管可用Function构造函数创建函数，但最好不要使用它，因为用它定义函数比用传统方式要慢得多。不过，所有函数都应看作是Function类的实例。
属性和方法
　　因为函数是引用类型，所以它们也有属性和方法，ECMAScript定义的属性length声明了函数期望的参数个数，例如：

复制代码代码如下:

 
function doAdd(iNum){ 
alert(iNum+10); 
} 
function sayHi(){ 
alert("Hi"); 
} 
alert(doAdd.length);//outpus 1 
alert(sayHi.length);//outpus 0 

Function对象也有与所有对象共享的标准valueOf()方法和toString()方法，这两个方法返回的都是函数的源代码，在调试时尤其有用。
　　例如：

复制代码代码如下:

 
function doAdd(iNum){ 
alert(iNum+10); 
} 
alert(doAdd.toString()); 

这段代码输出了doAdd()函数的文本。
闭包
定义
　　所谓闭包，是指词法表示包括不必计算的变量的函数，也就是说，该函数能使用函数外定义的变量。在ECMAScript中使用全局变量是一个简单的闭包实例。
　　示例：

复制代码代码如下:

 
var sMessage="Hello World"; 
function sayHelloWold(){ 
alert(sMessage); 
} 
sayHelloWorld(); 

在一个函数中定义另一个函数会使闭包变得更复杂，如：

复制代码代码如下:

 
var iBaseNum=10; 
function addNumbers(iNum1,iNum2){ 
function doAddtion(){ 
return iNum1+iNum2+iBaseNum; 
} 
return doAddtion(); 
} 

这里函数addNumbers()包括函数doAddtion()（闭包）。内部函数是个闭包，因为它将获取外部函数的参数iNum1和iNum2以及全局变量iBaseNum的值。addNumbers()的最后一步调用了内部函数，把两个参数和全局变量相加，并返回它们的和。这里要掌握的重要概念是doAddtion()函数根本不接受参数，它使用的是从执行环境中获取的。
　　可以看到，闭包是ECMAScript中非常强大多用的一部分，可以用于执行复杂的计算。就像使用任何高级函数一样，在使用闭包时要当心，因为它们可能会变得非常复杂。
本文示例代码

复制代码代码如下:

 
<!DOCTYPE html> 
<html> 
<head> 
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/> 
<title>《JavaScript高级程序设计》读书笔记之八：Function类及闭包</title> 
<script type="text/javascript"> 
function doAdd(iNum){ 
alert(iNum+10); 
} 
function sayHi(){ 
alert("Hi"); 
} 
function lengthProperty(){ 
alert(doAdd.length); 
alert(sayHi.length); 
} 
function valueOfMethod(){ 
alert(doAdd.valueOf()); 
} 
function toStringMethod(){ 
alert(doAdd.toString()); 
} 
var sMessage="Hello World"; 
function sayHelloWorld(){ 
alert(sMessage); 
} 
function demoOne(){ 
sayHelloWorld(); 
} 
var iBaseNum=10; 
function addNumbers(iNum1,iNum2){ 
function doAddtion(){ 
return iNum1+iNum2+iBaseNum; 
} 
return doAddtion(); 
} 
function demoTwo(){ 
alert(addNumbers(1,2)); 
} 
</script> 
</head> 
<body> 
<h1>Length:</h1> 
<input type="button" onclick="lengthProperty()" value="LengthProperty"/> 
<h1>valueOf()/toString():</h1> 
<input type="button" onclick="valueOfMethod()" value="ValueOfMethod"/> 
<input type="button" onclick="toStringMethod()" value="ToStringMethod"/> 
<h1>闭包:</h1> 
<input type="button" onclick="demoOne()" value="Demo One"/> 
<input type="button" onclick="demoTwo()" value="Demo Two"/> 
</body> 

您可能感兴趣的文章:

前端图片懒加载的原理与3种实现方式举例
图片懒加载又称图片延时加载、惰性加载,即在用户需要使用图片的时候加载,这样可以减少请求,节省带宽,提高页面加载速度,相对的,也能减少服务器压力,下面这篇文章主要给大家介绍了关于前端图片懒加载的原理与3种实现方式的相关资料,需要的朋友可以参考下
2023-03-03
纯编码实现微信小程序弹幕效果(非视频底)
这篇文章主要介绍了微信小程序弹幕纯编码实现,这种效果是非视频底，代码简单易懂，对大家的学习或工作具有一定的参考借鉴价值，需要的朋友可以参考下
2022-05-05
js光标定位文本框回车表单提交问题的解决方法
这篇文章主要介绍了js光标定位文本框回车表单提交问题的解决方法,涉及javascript阻止浏览器默认事件的方法,需要的朋友可以参考下
2015-05-05
微信小程序实现简单评论功能
这篇文章主要为大家详细介绍了微信小程序实现简单评论功能，具有一定的参考价值，感兴趣的小伙伴们可以参考一下
2018-11-11
javascript测试题练习代码
javascript测试题练习代码，需要的朋友可以参考下
2012-10-10
javascript 数据结构的题
面试题是3个数据结构的题，可以用java/c/c++/python实现，靠，js也能实现，鄙视js？我上机就用js写的，虽说肯定没戏，但js我挺。
2008-07-07
layui动态设置单选按钮选中效果实例
最近在使用layui前端框架,在使用单选按钮、下拉菜单select、checkbox等控件的时候,往往遇到一些初始化的东西,下面这篇文章主要给大家介绍了关于layui动态设置单选按钮选中效果的相关资料,需要的朋友可以参考下
2023-06-06
JavaScript实现的仿新浪微博原生态输入字数即时检查功能【兼容IE6】
这篇文章主要介绍了JavaScript实现的仿新浪微博原生态输入字数即时检查功能,涉及javascript事件响应及字符串的遍历、转换、判断等相关操作技巧,需要的朋友可以参考下
2017-09-09
js实现倒计时秒杀效果
这篇文章主要为大家详细介绍了js实现倒计时秒杀效果，文中示例代码介绍的非常详细，具有一定的参考价值，感兴趣的小伙伴们可以参考一下
2019-12-12
js+canvas实现可自动吸附闭合的鼠标绘制多边形
这篇文章主要为大家详细介绍了js+canvas实现可自动吸附闭合的鼠标绘制多边形，文中示例代码介绍的非常详细，具有一定的参考价值，感兴趣的小伙伴们可以参考一下
2022-07-07