同名函数，但基于条件执行

Question

不知道为什么会发生这种情况

例如，我创建了一个同名的alert函数，然后将其设置为条件语句，如果为真或为假，则执行两个不同的条件。

在桌面上，我看到"SEE THIS ALERT"，这是我所期望的，因为条件为真。

但是在手机上，我看到了"不应该看到这个警告"。，这是意料之外的，因为该条件为假。

为什么同名函数出现在"test_two_condition"条件在移动设备上执行，即使它的条件是假的，但在桌面上的表现是你所期望的?

var test_one_condition=true;
var test_two_condition=false;

if(test_one_condition) {
function SameName() {
alert('SEE THIS ALERT');
}
}

if(test_two_condition) {
function SameName() {
alert('SHOULD NOT SEE THIS ALERT');
}
}
SameName();

Answer 1

因为范围。这个问题与它是桌面还是移动设备没有任何关系——例如，我只是在同一台计算机上在Firefox、Safari和Chrome上运行相同的代码，并在Safari上得到SHOULD NOT SEE THIS ALERT。你在全局作用域中有两个同名的函数，所以哪个函数实际上是SameName可能取决于JS引擎的实现细节。

如果你想以一种不污染全局作用域(或父作用域，如果它在另一个函数中)的方式定义这些函数，你可以使用const或let绑定，但这样你就不能调用函数了，因为它们使用块作用域而不是函数作用域:

if (test_one_condition) {
const SameName = () => {
alert('SEE THIS ALERT');
}
}

if (test_two_condition) {
// or with `let`
let SameName = () => {
alert('SHOULD NOT SEE THIS ALERT');
}
}
SameName();
// SameName is not defined

如果你想改变同名函数的结果，你可以用let或var声明它，然后在条件语句中赋值:

let SameName
if (test_one_condition) {
SameName = () => {
alert('SEE THIS ALERT');
}
}

if (test_two_condition) {
SameName = () => {
alert('SHOULD NOT SEE THIS ALERT');
}
}
SameName();

如果有人在某些时候遇到这个问题，并得到基于使用全局作用域中的名称的条件定义函数将是一种好方法的印象，那么决定在函数中采取什么操作当然是一种更好的方法:

const sameName = (cond) => {
const msg = cond ? 'SEE THIS ALERT' : 'SHOULD NOT SEE THIS ALERT'
alert(msg)
}
sameName(someCondition)