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.一个浏 ...
随机推荐
- TEXT、TINYTEXT、MEDIUMTEXT、LONGTEXT选择 和 char varchar varchar2 的区别
TEXT.TINYTEXT.MEDIUMTEXT.LONGTEXT选择: 储存不区分大小写的字符数据 TINYTEXT 最大长度是 255 (2^8 - 1) 个字符. TEXT 最大长度是 6553 ...
- HDU 3966:Aragorn's Story(树链剖分)
http://acm.hdu.edu.cn/showproblem.php?pid=3966 题意:有n个点n-1条边,每个点有一个权值,有两种操作:询问一个点上权值是多少和修改u到v这条链上的权值. ...
- ACM题目————放苹果
Description 把M个同样的苹果放在N个同样的盘子里,允许有的盘子空着不放,问共有多少种不同的分法?(用K表示)5,1,1和1,5,1 是同一种分法. Input 第一行是测试数据的数目t(0 ...
- C#的OpenFileDialog和SaveFileDialog的常见用法(转)
OpenFileDialog openFileDialog1 = new OpenFileDialog(); openFileDialog1.InitialDirectory = ...
- Winform中如何实现子窗体刷新父窗体
原理:利用委托和事件,本文将以图文并茂的例子讲述,告诉我们So Easy --------------------------------------------------------------- ...
- phpcms常用函数
1../libs/functions/global.func.php --------------------------------------------------字符串安全处理函数--- ...
- Android开发:ScrollView嵌套GridView的解决办法
Android开发:ScrollView嵌套GridView的解决办法 前些日子在开发中用到了需要ScrollView嵌套GridView的情况,由于这两款控件都自带滚动条,当他们碰到一起的时候便 ...
- 周赛-Clique in the Divisibility Graph 分类: 比赛 2015-08-02 09:02 23人阅读 评论(3) 收藏
Clique in the Divisibility Graph time limit per test1 second memory limit per test256 megabytes inpu ...
- Behavior Designer中的内置消息机制
最近在用Behavior Designer,其中需要用到消息机制,看了一下其中自带了这套东西 注册 Owner.RegisterEvent<string>("Message&qu ...
- qbxt十一系列二
PA[题目描述]汉诺塔升级了:现在我们有N个圆盘和N个柱子,每个圆盘大小都不一样,大的圆盘不能放在小的圆盘上面,N个柱子从左到右排成一排.每次你可以将一个柱子上的最上面的圆盘移动到右边或者左边的柱子上 ...