基础篇:javascript 变量声明

这篇文章是对基础的复习,有这样一道面试题

var a = 10;
(function () {
    console.log(a); 
    var a = 20;
})()
  • 短短 5 行代码 console.log(a) 的结果是什么?
  • 如果把 var a = 20; 和 console.log(a) 语句顺序对调呢?

这道题目的答案是 undefined。不是 10。

关键在于 javascript 的变量声明有一个 hoisting 机制,变量声明永远都会被提升至作用域的最顶端(注意测试还只是声明,还没有赋值)。

其实上面的语句相当于:

var a = 10;
(function () {
    var a; // 在这里对变量hoisting,先声明
    console.log(a); 
    a = 20; // 再赋值
})()

我们来小分析一下,在匿名函数(function(){})()中,准确点称为自执行函数表达式,作用域会自成一个小世界,这样防止全局作用域的污染。

上面的a变量会提前声明,但是未赋值,所以此时输出的undefined。懂了吧。

我们在来知识延伸一下,记得在前端群里,有人问过,函数的级别高还是变量的级别高。你的理解呢?

其实是这样的,变量和函数在进入上下文,所以的声明都在执行代码之前都已经完成了。但是,函数声明会覆盖变量声明,但不会覆盖变量赋值。

注意上面红色文字,是什么意思呢,你去执行一下下面的代码就清楚了。

var a;
function a(){};
//---------------------------------------华丽的分割线
var b = 1;
function b(){};

所以大家在写代码的时候得注意一下。

最佳实践:推荐最好在函数的顶端把需要使用的变量首先声明一遍。

上面只是延伸一下和函数相关的知识点。

---------------------------------------------------------------------------------------------------------------------------------

下章预告:函数 

     函数在javascript函数是非常强大的,说到这里,我们扯远点,Javascript 模块化编程,为什么会提到这个东西呢,

     因为随着网站逐渐变成"互联网应用程序",嵌入网页的 Javascript 代码越来越庞大,越来越复杂。

网页越来越像桌面程序,需要一个团队分工协作、进度管理、单元测试等等......开发者不得不使用软件工程的方法,管理网页的业务逻辑。

     Javascript 模块化编程,已经成为一个迫切的需求。理想情况下,开发者只需要实现核心的业务逻辑,其他都可以加载别人已经写好的模块。

     但是,Javascript 不是一种模块化编程语言,它不支持""(class),更遑论"模块"(module)了。(正在制定中的 ECMAScript 标准第六版,将正式支持"类"和"模块",但还需要很长时间才能投入实用。)

     对于模块来说,原始的理解就是,模块就是实现特定功能的一组方法。只要把不同的函数(以及记录状态的变量)简单地放在一起,就算是一个模块。其实不尽如此,目前先说到这里。提供相关的几个词,大家可以先去搜索了解,CommonJS、AMD

 

从上面看出模块化编程异常重要,学会函数则非常重要,下章讲到函数就会牵连到作用域概念等等,大家先去复习。

今天冬至,大家记得吃饺子哦。

 以上内容如果有什么问题,大家尽可以提出来。。。
原文地址:https://www.cnblogs.com/TimJs/p/3485848.html