JavaScript-关于JavaScript对定义函数在不同浏览器下的区别

JavaScript-关于JavaScript对定义函数在不同浏览器下的区别

清晨说ぺ晚安 发布于 2017-05-19 字数 294 浏览 1150 回复 3

为什么以下这段代码,在IE下输出false, 在firefox下却输出true?

<script language="javascript">
if (true) {
function foo () { alert('true'); }
} else {
function foo () { alert('false'); }
}

foo();
</script>

如果你对这篇文章有疑问,欢迎到本站 社区 发帖提问或使用手Q扫描下方二维码加群参与讨论,获取更多帮助。

扫码加入群聊

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(3

夜无邪 2017-10-16 3 楼

所以最后的结论就是,不同的用户代理对未进入规范的函数声明在条件语句内解释不一样,可能是当初FE来解释,也可能是当成FD来解释。

甜柠檬 2017-06-11 2 楼

终于找到是什么原因造成了的。

函数声明在条件语句内虽然可以用,但是没有被标准化,也就是说不同的环境可能有不同的执行结果,所以这样情况下,最好使用函数表达式:

if (true) {
function foo () { alert('true'); }
} else {
function foo () { alert('false!'); }
}
foo();

函数声明的实际规则如下:
函数声明只能出现在程序或函数体内。从句法上讲,它们 不能出现在Block(块)({ ... })中,例如不能出现在 if、while 或 for 语句中。因为 Block(块) 中只能包含Statement语句, 而不能包含函数声明这样的源元素。另一方面,仔细看一看规则也会发现,唯一可能让表达式出现在Block(块)中情形,就是让它作为表达式语句的一部分。但是,规范明确规定了表达式语句不能以关键字function开头。而这实际上就是说,函数表达式同样也不能出现在Statement语句或Block(块)中(因为Block(块)就是由Statement语句构成的)。

函数语句
在ECMAScript的语法扩展中,有一个是函数语句,目前只有基于Gecko的浏览器实现了该扩展,所以对于下面的例子,我们仅是抱着学习的目的来看,一般来说不推荐使用(除非你针对Gecko浏览器进行开发)。
1.一般语句能用的地方,函数语句也能用,当然也包括Block块中:

 if (true) {
function foo(){ }
} else {
function foo(){ }
}

2.函数语句可以像其他语句一样被解析,包含基于条件执行的情形

 if (true) {
function foo(){ alert('true'); }
}
else {
function foo(){ alert('false'); }
}
foo();
// 注:其它客户端会将foo解析成函数声明
// 因此,第二个foo会覆盖第一个,结果返回false,而不是true

3.函数语句不是在变量初始化期间声明的,而是在运行时声明的——与函数表达式一样。不过,函数语句的标识符一旦声明能在函数的整个作用域生效了。标识符有效性正是导致函数语句与函数表达式不同的关键所在,例如:

 // 此刻,foo还没用声明
typeof foo; // "undefined"
if (true) {
// 进入这里以后,foo就被声明在整个作用域内了
function foo(){ alert('true'); }
} else {
// 从来不会走到这里,所以这里的foo也不会被声明
function foo(){ alert('false'); }
}
typeof foo; // "function"

不过,我们可以使用下面这样的符合标准的代码来模式上面例子中的函数语句:

 var foo;
if (true) {
foo = function foo(){ alert('true'); };
} else {
foo = function foo() { alert('false'); };
}

4.函数语句和函数声明(或命名函数表达式)的字符串表示类似,也包括标识符:

 if (true) {
function foo(){ alert('true'); }
}
String(foo); // function foo() { alert('true'); }

上面这些例子只是在某些浏览器支持,所以推荐大家不要使用这些,除非你就在特性的浏览器上做开发。

夜无邪 2017-06-04 1 楼

搜了半天资料,貌似是函数和函数表达式的问题,具体原理也没找到解释的地方,给你两个参考地址吧,也许会有用
深入理解JavaScript系列(2):揭秘命名函数表达式
Named function expressions demystified III