JavaScript的变量的彻底理解

变量

变量是一个用来存储具体值的容器。

创建变量的方式：var、let、const、function、import、class……

/* 语法：
    var 变量名 = 值;
    let 变量名 = 值;
    const 常量名 = 值;
    function 函数名 () {    // 函数体    };   
*/

变量命名规范

• 严格区分大小写

• 遵循驼峰命名法：按照数字、字母、下划线或者$来命名（数字不能作为开头），命名的时候基于英文单词拼接成一个名字（第一个单词字母小写，其余每一个有意义单词的首字母都大写）

• 不能使用关键字和保留字：在 js 中有特殊含义的叫做关键字，未来都可能成为关键字的叫做保留字

var n = 12;
var N = 12; // 变量 n 和变量 N 不是同一个变量
var studentInfo = 'xyz'; // 驼峰命名法

// 变量要具有语义化
add / create / insert
del (delete) / update / remove(rm)
info / detail
log

变量的数据类型

• 基本类型：number、string、boolean、Symbol、null、undefined(四基两空)

• 引用数据类型：object(普通对象、数组、正则、函数……)

// [基本数据类型]
var n = 13; 
var s = ''; 
var b = true;
var empty = null; 
var notDefined = undefined;
var s1 = Symbol('炒面熊');// Symbol: 用来创建一个唯一值 s1 和 s2 变量代表两个不同的值。
var s2 = Symbol('炒面熊');

// [引用数据类型]
// 普通对象
var obj = {name: '炒面熊', age: 9}; //（name 叫做属性名(key)，'炒面熊'叫做属性值(value)）

//  数组
var ary = [1, 2, 3, 4, 5];

// => 正则：用来匹配字符串的规则
var reg = /^abc$/;  

// => 函数：需要多次重复使用的代码或者有特定功能的代码可以封装成一个函数；
function 函数名 () {    // 函数体    };  

变量提升

在 js 代码执行之前，会对所有声明的变量进行提前

1、var 声明的变量 => 提前声明，不赋值

console.log(num); // undefined 
// 代码执行到这里时，num 只是经过了变量提升，但是没有完成赋值，所以是 undefined；

var num = 100; // 代码执行过这一行后完成了赋值，所以 num 是100
console.log(num);  // 100

2、function 声明的变量 => 提前声明，并且赋值

console.log(fe); // 函数体本身
//因为 fe 这个变量在函数执行时就已经赋值完成了，所以无论在函数声明前还是后使用都是函数本身

fe(); // 因为 fe 在变量提升阶段就已经完成了赋值，所以 fe 是一个函数，所以可以成功执行

function fe() {
    console.log('We are Front-end Engineer');
}

3、变量提升的优先级

//function 的优先级高于普通变量
console.log(fe); // 函数体
function fe() { 
    console.log('我是炒面熊');
}
var fe = 123; // 代码执行到这一行时，将变量 fe 的值修改为123

变量的重复声明

var num;
var num;
var num; // 这些语句没有赋值操作，当代码执行时会略过
var num = 100; // num 虽然 var 了4次，但是并不会声明4次，只会声明一次，同时只有这一次才会将 num 的值赋值成100；