解释奇怪的var范围行为

Question

更新：Tushar和Dmitri已经回答了。请参阅前2个对此问题的评论，上下文是变量范围，答案是变量提升。

这是非常自我解释的

var snack = 'Meow Mix';
function getFood(food) {
  if (food) {
    snack = 'Friskies';
  }
  return snack;
}
getFood(false)
"Meow Mix"
getFood(true)
"Friskies"

snack会向上移动一个范围以检查var是否存在。

这也很合乎逻辑：

let snack = 'Meow Mix';

function getFood(food) {

    if (food) {
        let snack = 'Friskies';
        return snack;
    }
    return snack;
}

getFood(false); 

但是，我没有得到这一部分。有人可以解释一下吗？

var snack = 'Meow Mix';
function getFood(food) {
  if (!!food) {
    var snack = 'Friskies';
  }
  return snack;
}
getFood(false)
undefined
getFood(true)
"Friskies"
getFood(false)
undefined

为什么getFood(false)未定义？ 我认为它应该上升到一个范围。

来源：如this slide

所示