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


Posted in Javascript onFebruary 27, 2012

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>
Javascript 相关文章推荐
jquery 简单图片导航插件jquery.imgNav.js
Mar 17 Javascript
jQuery1.4.2与老版本json格式兼容的解决方法
Feb 12 Javascript
再说AutoComplete自动补全之实现原理
Nov 05 Javascript
jquery基础教程之deferred对象使用方法
Jan 22 Javascript
Javascript中的apply()方法浅析
Mar 15 Javascript
JavaScript引用类型和基本类型详解
Jan 06 Javascript
JS中的进制转换以及作用
Jun 26 Javascript
Express下采用bcryptjs进行密码加密的方法
Feb 07 Javascript
vue2之简易的pc端短信验证码的问题及处理方法
Jun 03 Javascript
vue+element获取el-table某行的下标,根据下标操作数组对象方式
Aug 07 Javascript
解决vue watch数据的方法被调用了两次的问题
Nov 07 Javascript
vue如何实现关闭对话框后刷新列表
Apr 08 Vue.js
JavaScript高级程序设计 阅读笔记(七) ECMAScript中的语句
Feb 27 #Javascript
JavaScript高级程序设计阅读笔记(六) ECMAScript中的运算符(二)
Feb 27 #Javascript
JavaScript高级程序设计阅读笔记(五) ECMAScript中的运算符(一)
Feb 27 #Javascript
JavaScript高级程序设计 阅读笔记(四) ECMAScript中的类型转换
Feb 27 #Javascript
《JavaScript高级程序设计》阅读笔记(三) ECMAScript中的引用类型
Feb 27 #Javascript
《JavaScript高级程序设计》阅读笔记(二) ECMAScript中的原始类型
Feb 27 #Javascript
《JavaScript高级程序设计》阅读笔记(一) ECMAScript基础
Feb 27 #Javascript
You might like
PHP strtotime函数详解
2009/12/18 PHP
19个Android常用工具类汇总
2014/12/30 PHP
键盘控制事件应用教程大全
2006/11/24 Javascript
jQuery.extend 函数详解
2012/02/03 Javascript
js获取键盘按键响应事件(兼容各浏览器)
2013/05/16 Javascript
jQuery插件 selectToSelect使用方法
2013/10/02 Javascript
JS对象转换为Jquery对象实现代码
2013/12/29 Javascript
node.js中的fs.readFileSync方法使用说明
2014/12/15 Javascript
JS动态修改图片的URL(src)的方法
2015/04/01 Javascript
jQuery遍历json的方法(推荐)
2016/06/12 Javascript
结合代码图文讲解JavaScript中的作用域与作用域链
2016/07/05 Javascript
BootStrap日期控件在模态框中选择时间下拉菜单无效的原因及解决办法(火狐下不能点击)
2016/08/18 Javascript
Javascript 正则表达式校验数字的简单实例
2016/11/02 Javascript
JS常用算法实现代码
2016/11/14 Javascript
React Native预设占位placeholder的使用
2017/09/28 Javascript
vue用递归组件写树形控件的实例代码
2018/07/19 Javascript
解决Vue.js由于延时显示了{{message}}引用界面的问题
2018/08/25 Javascript
简单介绍Python中利用生成器实现的并发编程
2015/05/04 Python
Django配置celery(非djcelery)执行异步任务和定时任务
2018/07/16 Python
python实现彩色图转换成灰度图
2019/01/15 Python
python3 map函数和filter函数详解
2019/08/26 Python
python 实现turtle画图并导出图片格式的文件
2019/12/07 Python
python实例化对象的具体方法
2020/06/17 Python
序列化Python对象的方法
2020/08/01 Python
用HTML5.0制作网页的教程
2010/05/30 HTML / CSS
欧洲最大的预定车位市场:JustPark
2020/01/06 全球购物
新东网科技Java笔试题
2012/07/13 面试题
.TTL是什么?有什么用处,通常那些工具会用到它?(ping? traceroute? ifconfig? netstat?)
2016/05/09 面试题
公司员工检讨书
2014/02/08 职场文书
教师个人自我评价范文
2014/04/13 职场文书
让世界充满爱演讲稿
2014/05/24 职场文书
毕业典礼邀请函
2015/01/31 职场文书
销售经理助理岗位职责
2015/04/13 职场文书
Java Socket实现Redis客户端的详细说明
2021/05/26 Redis
python 多态 协议 鸭子类型详解
2021/11/27 Python
天谕手游15杯全调酒配方和调酒券的获得方式
2022/04/06 其他游戏