javascript 函数声明与函数表达式的区别
先看一段代码
var f = function g() {
return 1;
};
if (false) {
f = function g(){
return 2;
};
}
alert(g());
你知道在不同浏览器中的输出结果是什么吗?
把这段代码放到IE 6 和chorme,firefox里面是完全不同的效果,ie6里面会输出2,chorm以及firefox会输出g没有定义,这是JScript的bug(微软给自己的javascript起名为JScript),IE6未能正确区分哪个是函数声明,哪个是函数表达式,那么何为声明,何为函数表达式呢?
在ECMAScript中,创建函数最常用的两个方法是函数表达式和函数声明:函数声明必须带有标示符(Identifier)(就是大家常说的函数名称),而函数表达式则可以省略这个标示符:
函数声明:
function 函数名称 (参数:可选){ 函数体 }
函数表达式:
function 函数名称(可选)(参数:可选){ 函数体 }
所以,可以看出,如果不声明函数名称,它肯定是表达式,可如果声明了函数名称的话,如何判断是函数声明还是函数表达式呢?ECMAScript是通过上下文来区分的,如果function fn(){}是作为赋值表达式的一部分的话,那它就是一个函数表达式,如果function foo(){}被包含在一个函数体内,或者位于程序的最顶部的话,那它就是一个函数声明。
还有一种函数表达式不太常见,就是被括号括住的(function fn(){}),他是表达式的原因是因为括号 ()是一个分组操作符,它的内部只能包含表达式。
知道了什么是函数声明/函数表达式,他们的区别是什么呢?最大的区别在于javascript代码初始化阶段
来看一段函数声明示例:
function fn () {
console.log('fn 函数执行..');
// code..
}
这样我们就声明了一个名称为fn的函数,这里出个思考题,如果在这个函数的上面来调用他的话会执行吗?
fn();
function fn () {
console.log('fn 函数执行..');
// code..
}
控制台输出结果为
此时fn函数是可以被调用到的,总结如下:
1、fn函数调用前,已经被声明,默认存储在全局上下文的变量中(可用 window.函数名 来验证)
2、此方式为函数声明,在进入全局上下文阶段创建,代码执行阶段,它们已经可用。ps:javaScript在每次进入方法时都会先初始化上下文环境(由全局 → 局部)
3、它可以影响变量对象(仅影响存储在上下文中的变量)
function g(){
return 1;
}
if(false){
function g(){
return 2;
};
}
alert(g()); // 2
此时运行的结果就是2,而不是1,函数已经被提前声明了,而不是等到if语句符合条件时再声明
再来看一段函数表达式示例:
var fn = function () {
console.log('fn 函数【表达式】声明执行..')
// code..
}
这是一个函数表达式,如果在这个函数的上面来调用他的话会执行吗?

这说明在第一次调用fn()的时候,var fn 变量没有做为全局对象的一个属性而存在,且 fn 引用的匿名函数上下文也没有被初始化,所以在他之前调用失败,同样总结如下:
1、首先变量本身不做为一个函数存在,而是一个匿名函数的引用(值类型的不属于引用)
2、在代码执行阶段,初始化全局上下文时,它没有被做为全局的一个属性而存在,所以不会造成变量对象的污染
3、该类型的声明一般在插件的开发比较常见,也可做为闭包中回调函数的调用
所以 function fn () {} 并不等于 var fn = function () {} ,他们有本质上的区别。
javascript 函数声明与函数表达式的区别的更多相关文章
- 详解Javascript 函数声明和函数表达式的区别
Javascript Function无处不在,而且功能强大!通过Javascript函数可以让JS具有面向对象的一些特征,实现封装.继承等,也可以让代码得到复用.但事物都有两面性,Javascrip ...
- javascript中函数声明与函数表达式的区别
javascript中声明函数的方法有两种:函数声明式和函数表达式.究竟他们用起来有什么区别呢? 区别如下: (1).以函数声明的方法定义的函数,函数名是必须的,而函数表达式的函数名是可选的. (2) ...
- JavaScript的函数声明与函数表达式的区别
1)函数声明(Function Declaration); // 函数声明 function funDeclaration(type){ return type==="Declaration ...
- 转载 JavaScript的函数声明与函数表达式的区别
1)函数声明(Function Declaration); // 函数声明 function funDeclaration(type){ return type==="Declaration ...
- JavaScript 函数声明与函数表达式的区别 函数声明提升(function declaration hoisting)
解析器在向执行环境中加载数据时,对函数声明和函数表达式并非一视同仁.解析器会率先读取函数声明,并使其在执行任何代码之前可用(可以访问).至于函数表达式,则必须等到解析器执行到它所在的代码行,才会真的被 ...
- Javascript函数声明与函数表达式的区别
在定义函数时,我们一般使用下面这两种方法: 使用函数声明定义: 1 2 3 function sum (a, b) { return a + b; } 使用函数表达式定义: 1 2 3 va ...
- JavaScript(js)函数声明与函数表达式的区别
在JavaScript中,函数是经常用到的,在实际开发的时候,我想很多人都没有太在意函数的声明与函数表达式的区别,但是呢,这种细节的东西对于学好js是非常重要的. 函数声明与函数表达式用代码写出来是这 ...
- JavaScript 函数声明,函数表达式,匿名函数,立即执行函数之区别
函数声明:function fnName () {-};使用function关键字声明一个函数,再指定一个函数名,叫函数声明. 函数表达式 var fnName = function () {-};使 ...
- Javascript函数声明与函数表达式
在定义函数时,我们一般使用下面这两种方法: 使用函数声明定义: function sum (a, b) { return a + b; } 使用函数表达式定义: var sum = function ...
随机推荐
- vc6.0快捷键大全
转载! 按下Alt 键不放,点击鼠标左键拖动,可以选择文本块.可选择列: ...
- Windows批处理:自动检查服务器连通性
该技术与上一篇<自动检查网络连通性>的实现原理相同,我将脚本稍微改动了下,用于检查公司服务器的连通性,简单快捷.在这里附上修改方法. @echo off color 1F title 服务 ...
- 深入理解C语言
语言只是一种工具,任何语言之间都是相通的,一通则百通,关键是要理解语言背后的思想,理解其思想,任何语言,拿来用就行了.语言没有好坏之分,任何语言既然存在自然有它存在的价值. 在一个到处是OOP的年代, ...
- java报表工具FineReport常用函数的用法总结(数学和三角函数)
ABS ABS(number):返回指定数字的绝对值.绝对值是指没有正负符号的数值. Number:需要求出绝对值的任意实数. 示例: ABS(-1.5)等于1.5. ABS(0)等于0. ABS(2 ...
- java报表工具FineReport的JS编辑框和URL地址栏语法简介
JS编辑框: 1.FineReport的js. 作为一款BS产品,browser端的JavaScript是必不可少的. FineReport中的js是已经调用了finereport.js的. 大家知道 ...
- KVM 介绍(7):使用 libvirt 做 QEMU/KVM 快照和 Nova 实例的快照 (Nova Instances Snapshot Libvirt)
学习 KVM 的系列文章: (1)介绍和安装 (2)CPU 和 内存虚拟化 (3)I/O QEMU 全虚拟化和准虚拟化(Para-virtulizaiton) (4)I/O PCI/PCIe设备直接分 ...
- [PHP]swoole_server几个进程的分工
readme.md-/Users/zjh/Documents/我的文章/[PHP]swoole_server几个进程的分工 html{font-family: sans-serif;-ms-text- ...
- Maven学习(四)Maven 命令行选项
说明: 1.使用-选项时,和后面的参数之间可以不要空格.而使用--选项时,和后面的参数之 间必须有空格.如下面的例子: $ mvn help:describe -Dcmd=compiler:co ...
- [No000052]大蒜怎么吃最美容?吃大蒜的功效及禁忌
大蒜是最常见的香辛调味料,它被称为天然抗生素,富含大蒜素等多种营养物质和抗氧化剂,具有多种美肤美容作用. 大蒜的5种美容功效 1.除皱.大蒜里的某些成分,有类似维生素E与维生素C的抗氧化.防衰老特性, ...
- 字符串截取函数substr()
substr(参数1,参数2[,参数3]); 该系统函数返回被截后的子字符串,它接受2个必选参数,参数1为要截取的字符串,参数2为截取的开始位置,参数3可选,表示截取长度. 例子:substr(&qu ...