目录

• 代码规范
  • 命名规范
  • 变量规范
  • 注释规范
  • 空格规范
  • 换行规范
• 作用域
  • 全局变量
  • 局部变量
  • 块级作用域
  • 作用域链
• 预解析
  • 什么是预解析
  • 变量提升
    

    此篇木有脑图，嘻嘻

代码规范

命名规范

• 变量、函数的命名必须要有意义
• 变量一般用名词
• 函数一般用动词

变量规范

• 操作符前后要有空格

var name = 'zs';

注释规范

 // 这里是注释
 

空格规范

    if (true) {

    }

    for(var i = 0; i < n; i++ ) {

    }

换行规范

    var arr = [1, 2, 3, 4];
        if (a > b) {

        }
        for (var i = 0; i < 10; i++) {

        }
        function fn() {

        }

作用域

变量可以起作用的范围

全局变量

在任何一个地方都能访问到的变量

• 不使用 var 声明的变量就是全局变量， 但不推荐这么写

局部变量

只在固定的代码块可以访问到的变量，比如最常见的就是函数内部。对应的局部作用域

• 局部变量退出作用域之后就会被销毁，而全局变量只有在关闭网页或浏览器时才被销毁

    var arr = [1, 2, 3, 4]; // 全局变量
        if (a > b) {
          var c; //局部变量
        }
        for (var i = 0; i < 10; i++) {

        }
        function fn() {

        }

块级作用域

任何一对花括号（｛和｝）中的语句集都属于一个块，在这之中定义的所有变量在代码块外都是不可见的，我们称之为块级作用域。
在es5之前没有块级作用域的的概念,只有函数作用域，现阶段可以认为JavaScript没有块级作用域

作用域链

• 只有函数可以制造作用域结构，那么只要是代码，就至少有一个作用域,即全局作用域。凡是代码中有函数，那么这个函数就构成另一个作用域。如果函数中还有函数，那么在这个作用域中就又可以诞生一个作用域。
• 将这样的所有的作用域列出来，可以有一个结构: 函数内指向函数外的链式结构。就称作作用域链。

// 案例2
function f1() {
    var num = 123;  // 1级链
    function f2() { // 2级链
        console.log(num);
    }
    f2(); // 1级链
}
var num = 456; //0级链
f1(); //// 0级链
// 0级链表示 全局 1级链表示 局部    2级链表示局部的局部 以此类推

预解析

什么是预解析

JavaScript代码的执行是由浏览器中的JavaScript解析器来执行的。JavaScript解析器执行JavaScript代码的时候，分为两个过程：预解析过程和代码执行过程

预解析过程：

• 把变量的声明提升到当前作用域的最前面，只会提升声明，不会提升赋值。
• 把函数的声明提升到当前作用域的最前面，只会提升声明，不会提升调用。
• 先提升var，再提升function。

代码执行过程

案例

        f1();
        console.log(c);
        console.log(b);
        console.log(a);

        function f1() {
            var a = b = c = 9;
            console.log(a);
            console.log(b);
            console.log(c);
        }
        //预解析过程
        // function f1() {
        //     var a = b = c = 9;
        //     console.log(a);
        //     console.log(b);
        //     console.log(c);
        //     //function f1()内部预解析过程
        //     var a = b = c = 9;
        //     var a = 9; // a是局部变量
        //     b = 9;
        //     c = 9;  // 因为b c没有用var声明 所以 bc是全局变量
        //     console.log(a);
        //     console.log(b);
        //     console.log(c);
        // }
        // f1(); // 因为上来先调用了函数，所以要先对函数内部进行预解析
        // console.log(c);
        // console.log(b);
        // console.log(a);

变量提升

变量提升

定义变量的时候，变量的声明会被提升到作用域的最上面，变量的赋值不会提升

函数提升

javascript解析器首先会把当前作用域的函数声明提前到整个作用域的最前面

注意：先提升var，再提升function。

案例

    var a = 18;
    f1();
    function f1() {
    var b = 9;
    console.log(a);
    console.log(b);
    var a = '123';
 }
// var a;
    f1();

// f1()内的预解析
function f1() {
    var b;
    var a;
    console.log(a); // undefined  a因为变量提升，所以只被声明了，而没有被赋值
    console.log(b); // 9
    a = '123';
}
 a = 18;
 console.log(a); // 18

原文地址：https://www.cnblogs.com/1020-jj/p/10859421.html