变量声明总结
首先，我们知道在学习javascript的过程中，学习到了多种 声明变量的方式，那它们有什么不同呢？
总共有下面这些:
ES5
var 关键字
function 关键字
ES6
let 关键字
const // 声明常量
class // 声明类
import // 导入模块
ok ,暂时只有这些了
var
var 是一开始，我们就接触的声明变量的方式，由于javascript是基于对象的弱类型语言，所以
变量储存的是什么数据类型由值来决定
语法 ：
var 变量名 = 值;
① 允许重复声明
var a = 10;
var a = 100;
console.log(a) // 100
这种情况，后面会覆盖前面的，因为变量名相同，而且这种写法极其不合理
变量声明了，干嘛还有声明一次，并且还允许，假设在一种环境下，不小心将前面声明过的变量覆盖了在怎么办?
② 作用域
我们知道使用var 声明的变量在全局作用域下是全局变量，在局部声明是局部变量
<script>
var a = 10; // 全局变量
function dome(){
var a = 20; // 局部变量
console.log(a) // 20
}
<//script>
③ 变量提升
使用 var 声明变量 会存在变量声明提升的问题，我们声明部分，会提升到当前作用域的最顶端 【只提升变量，不提升值】
console.log(a) // undefind
var a = 20;
// 局部作用域中也是一样
隐式声明
我们说，任何变量，未经声明就赋值，此变量为全局所有，
也就是说任何变量，不管你在何处，只要是没有声明就赋值，此变量就归全局
a = 20; //
console.log(a) // 20
console.log(window.a) // 20
function
function 是我们用来声明函数的一种方式，其本质上也是一种变量声明，
函数名就是变量名，只能声明函数的这种数据类型是 function类型，
用function声明的是函数对象，作用域与var一样，是函数作用域。
function dome(a){
// 函数作用域
}
① 函数提升
在预编译的过程中，会发生两种情况，① 变量声明提升 ② 函数声明整体提升
<script>
dome();
function dome(){ // 全局函数
var a = 20;
console.log(a) // 20
dome1();
function dome1(){
}
}
<//script>
我们知道js是一种解释性语言，通俗来说就是，解析一行代码，执行一行代码，并且是按照顺序执行的
我们也可以称之为 循序结构, 但是上面 函数调用写在了函数的前面，竟然也能调用，是因为js在执行前会把函数整体提升到作用域的
最顶端
let ES6+
let 声明变量是ES6才有的，它对比var,有几个特点
- ① 不允许重复声明
- ② 没有变量提升
- ③ let声明的变量可以具有块级作用域
- ⑤ let声明的全局变量不在是 顶层对象的属性【window】
通过代码我们来看一下
// ① 不允许重复声明
let a = 10;
let a = 20 // SyntaxError: 语法错误
// ② 没有变量提升
console.log(a); // ReferenceError : 非法的错误
let a = 10;
// ③ let声明的变量可以具有块级作用域
{
// 块级作用域
let a = 10;
}
console.log(a) // ReferenceError: a is not defined
// ⑤ let声明的全局变量不在是 顶层对象的属性
let name = '张三'；
console.log(window.name) // undefind
const ES6+
const 一般我们是用来声明常量，这里我顺带提一下
使用const 声明的常量，与 let 基本相同 唯一的不同点就是【不能被修改值】
const PI = 3.14;
PI = 3.15; // TypeError: Assignment to constant variable.
class ES6+
ES6引入了类的概念，有了class这个关键字，当然，类只是基于原型的面向对象模式的语法糖，
为了方便理解和开发而已，类的实质还是函数对象，类中的方法和对象其实都是挂在对应的函数对象的prototype属性下。
class Person{
// 预先定义属性
name = null;
age = null;
// 构造器
constructor(name,age){
this.name = name;
this.age = age;
}
say(){
console.log('我叫'+this.name+',我的年龄'+this.age)
}
}
// 实例化
let p = new Person('小丽丽', 18);
p.say() // 我叫小丽丽,我的年龄18
// 通过new 关键字后， name 与 age 会成为实例的属性，而方法会自动跑到实例的原型上
//--------------------------------
// 还有这种形式
let Person = class Me {
getClassName() {
return Me.name;
}
};
其实就相当于
var Person = function test(){}
// Class其实就是一个function，但是有一点不同，Class不存在变量提升，也就是说Class声明定义必须在使用之前。
Class不存在变量提升，也就是说Class声明定义必须在使用之前
import
ES6采用import来代替node等的require来导入模块。
import {$} from './jquery.js'
$对象就是jquery中export暴露的对象。
import接受一个对象，所以我们使用对象的解构赋值方式来结构到 jquery暴露的对象
注意，import命令具有提升效果，会提升到整个模块的头部，首先执行。