js 函数-Tom
函数类型
在ECMAScript 中有三种函数类型:函数声明,函数表达式和函数构造器创建的函数。每一种都有自己的特点。
函数声明
函数声明(缩写为FD)是这样一种函数:
- 有一个特定的名称
- 在源码中的位置:要么处于程序级(Program level),要么处于其它函数的主体(FunctionBody)中
- 在进入上下文阶段创建
- 影响变量对象
- 以下面的方式声明
function exampleFunc() {
...
}
这种函数类型的主要特点在于它们仅仅影响变量对象(即存储在上下文的VO中的变量对象)。该特点也解释了第二个重要点(它是变量对象特性的结果)——在代码执行阶段它们已经可用(因为FD在进入上下文阶段已经存在于VO中——代码执行之前)。
例如(函数在其声明之前被调用)
foo(); function foo() {
alert('foo');
}
另外一个重点知识点是上述定义中的第二点——函数声明在源码中的位置:
// 函数可以在如下地方声明:
// 1) 直接在全局上下文中
function globalFD() {
// 2) 或者在一个函数的函数体内
function innerFD() {}
}
只有这2个位置可以声明函数,也就是说:不可能在表达式位置或一个代码块中定义它。
另外一种可以取代函数声明的方式是函数表达式,解释如下:
函数表达式
函数表达式(缩写为FE)是这样一种函数:
- 在源码中须出现在表达式的位置
- 有可选的名称
- 不会影响变量对象
- 在代码执行阶段创建
这种函数类型的主要特点在于它在源码中总是处在表达式的位置。最简单的一个例子就是一个赋值声明:
var foo = function () {
...
};
该例演示是让一个匿名函数表达式赋值给变量foo,然后该函数可以用foo这个名称进行访问——foo()。
同时和定义里描述的一样,函数表达式也可以拥有可选的名称:
var foo = function _foo() {
...
};
需要注意的是,在外部FE通过变量“foo”来访问——foo(),而在函数内部(如递归调用),有可能使用名称“_foo”。
如果FE有一个名称,就很难与FD区分。但是,如果你明白定义,区分起来就简单明了:FE总是处在表达式的位置。在下面的例子中我们可以看到各种ECMAScript 表达式:
// 圆括号(分组操作符)内只能是表达式
(function foo() {}); // 在数组初始化器内只能是表达式
[function bar() {}]; // 逗号也只能操作表达式
1, function baz() {};
表达式定义里说明:FE只能在代码执行阶段创建而且不存在于变量对象中,让我们来看一个示例行为:
// FE在定义阶段之前不可用(因为它是在代码执行阶段创建) alert(foo); // "foo" 未定义 (function foo() {}); // 定义阶段之后也不可用,因为他不在变量对象VO中 alert(foo); // "foo" 未定义
相当一部分问题出现了,我们为什么需要函数表达式?答案很明显——在表达式中使用它们,”不会污染”变量对象。最简单的例子是将一个函数作为参数传递给其它函数。
function foo(callback) {
callback();
} foo(function bar() {
alert('foo.bar');
}); foo(function baz() {
alert('foo.baz');
});
在上述例子里,FE赋值给了一个变量(也就是参数),函数将该表达式保存在内存中,并通过变量名来访问(因为变量影响变量对象),如下:
var foo = function () {
alert('foo');
}; foo();
另外一个例子是创建封装的闭包从外部上下文中隐藏辅助性数据(在下面的例子中我们使用FE,它在创建后立即调用):
var foo = {}; (function initialize() { var x = 10; foo.bar = function () {
alert(x);
}; })(); foo.bar(); // 10; alert(x); // "x" 未定义
我们看到函数foo.bar(通过[[Scope]]属性)访问到函数initialize的内部变量“x”。同时,“x”在外部不能直接访问。在许多库中,这种策略常用来创建”私有”数据和隐藏辅助实体。在这种模式中,初始化的FE的名称通常被忽略:
(function () {
// 初始化作用域
})();
还有一个例子是:在代码执行阶段通过条件语句进行创建FE,不会污染变量对象VO。
var foo = 10;
var bar = (foo % 2 == 0 ? function () { alert(0); } : function () { alert(1); });
bar(); //
通过函数构造器创建的函数
既然这种函数对象也有自己的特色,我们将它与FD和FE区分开来。其主要特点在于这种函数的[[Scope]]属性仅包含全局对象:
var x = 10; function foo() { var x = 20;
var y = 30; var bar = new Function('alert(x); alert(y);'); bar(); // 10, "y" 未定义 }
我们看到,函数bar的[[Scope]]属性不包含foo上下文的Ao——变量”y”不能访问,变量”x”从全局对象中取得。顺便提醒一句,Function构造器既可使用new 关键字,也可以没有,这样说来,这些变体是等价的。
js 函数-Tom的更多相关文章
- js函数的伪重载
这也是今天写东西是遇到的一个问题,导致我联想起了函数重载的问题. 在javascript中是没有函数重载机制的,对于用惯了java开发的同学可能就表示吃惊了,我屮艸芔茻,函数 没有重载?那怎么搞?!! ...
- (day65、66)Vue基础、指令、实例成员、JS函数this补充、冒泡排序
目录 一.Vue基础 (一)什么是Vue (二)为什么学习Vue (三)如何使用Vue 二.Vue指令 (一)文本指令 (二)事件指令v-on (三)属性指令v-bind (四)表单指令v-model ...
- 3.3 js函数
1.函数语法: 函数声明的方式:function 函数名(参数1,参数2-){//函数体;}函数调用:函数名(参数1,参数2-); 函数内不一定都指定返回值. 如果需要指定返回值,可用 return ...
- Js函数function基础理解
正文:我们知道,在js中,函数实际上是一个对象,每个函数都是Function类型的实例,并且都与其他引用类型一样具有属性和方法.因此,函数名实际上是指向函数对象的指针,不与某个函数绑定.在常见的两种定 ...
- js函数表达式和函数声明的区别
我们已经知道,在任意代码片段外部添加包装函数,可以将内部的变量和函数定义"隐 藏"起来,外部作用域无法访问包装函数内部的任何内容. 例如: var a = 2; function ...
- 通用js函数集锦<来源于网络> 【二】
通用js函数集锦<来源于网络> [二] 1.数组方法集2.cookie方法集3.url方法集4.正则表达式方法集5.字符串方法集6.加密方法集7.日期方法集8.浏览器检测方法集9.json ...
- 通用js函数集锦<来源于网络/自己> 【一】
通用js函数集锦<来源于网络/自己>[一] 1.返回一个全地址2.cookie3.验证用户浏览器是否是微信浏览器4.验证用户浏览器是否是微博内置浏览器5.query string6.验证用 ...
- 100多个基础常用JS函数和语法集合大全
网站特效离不开脚本,javascript是最常用的脚本语言,我们归纳一下常用的基础函数和语法: 1.输出语句:document.write(""); 2.JS中的注释为//3.传统 ...
- JS函数
1.document.write(""); 输出语句2.JS中的注释为//3.传统的HTML文档顺序是:document->html->(head,body)4.一个浏 ...
随机推荐
- JavaEE基础(二十五)/多线程、GUI
1.多线程(单例设计模式) 单例设计模式:保证类在内存中只有一个对象. 如何保证类在内存中只有一个对象呢? (1)控制类的创建,不让其他类来创建本类的对象.private (2)在本类中定义一个本类的 ...
- ecshop后台增加模块菜单详细教程(图)
我们有时候针对ecshop如此开发,想在后台加一些菜单,最模板以前提供过教程,但是并非很系统,今天最模板抛砖引玉图文教程告诉大家:如何在ecshop后台增加模块菜单! 首先需要修改四个文件:inc_p ...
- Ajax的基本语法
//声明XMLHttpRequest var xmlHttp = null; // 创建XMLHttpRequest对象兼容所有浏览器 function createXMLHttpR ...
- python中split函数的使用
最近学习python,对split函数做了下总结,内容如下:
- linux正则表达式使用
首先介绍下正则表达式,它是由一串字符和元字符构成的字符串,简称RE(Regular Expression),它的主要功能是文本查询和字符串操作,它可以匹配一个文本的字符和字符集,达到数据过滤的效果. ...
- mybatis+springMVC新感悟
一直以为按照例子里写的.先编写User实体类,之后在编写User.xml之后在配置文件里指明接口文件.然后在controller中就可以通过就可以通过定义接口,在取值 IUserOperation u ...
- 使用自定义材质球,实现NGUI屏幕溶解和灰显
UITexture实现的溶解: 重设UITeture的材质球实现上述效果,把当前屏幕渲染的Texture2D丢给UITexture,即可实现UI屏幕特效,背景模糊等都可以. 难点主要是实时刷新问题 解 ...
- E: Sub-process /usr/bin/dpkg returned an error code (1) 解决方案
转载自:http://www.cnblogs.com/eddy-he/archive/2012/06/20/2555918.html cd /var/lib/dpkg sudo mv info inf ...
- wamp安装完更改关联浏览器
"wampmanager.conf"文件修改的是关于中到官网的链接打开方式. "wampmanager.ini"修改的是左键菜单的打开方式. 修改完无效的话重启 ...
- 2016 Al-Baath University Training Camp Contest-1 A
Description Tourist likes competitive programming and he has his own Codeforces account. He particip ...