var
声明一个变量，可选将其初始化为一个值。
function fn(){
var a = 1
console.log(a)
}
fn() //输出 1 。正常的
看看以下代码
注意：console.log(2)没有被执行
function fn(){
if(true){
console.log(1)
}else{
//这不会执行
console.log(2)
}
}
fn() // 1
再来看看以下代码
console.log(a)报错了
function fn(){
if(true){
console.log(a)
}else{
//这不会执行
console.log(2)
}
}
fn() //报错了 a is not defined
【var|var let const 区别（）】还得看看以下代码
function fn(){
if(true){
console.log(a) //undefined
}else{
//这不会执行
var a
console.log(2)
}
}
fn()
以上代码竟然没有报错？这....
else{}的大括号不会执行的我在
else{}的大括号中声明了a，a竟然被执行了。赶紧查MDN，原来是变量提升了。
注意：变量提升将影响变量声明，而不会影响其值的初始化。
function fn(){
console.log(a) //undefined
var a= 10
console.log(a) // 10
}
fn()
目的：只暴露frank一个全局变量
{
var a = 1
window.frank = function (){
console.log(a)
}
}以上代码不符合我的目的。var a = 1,就会不小心暴露window.a全局变量---------分割线---------改善：用函数包裹起来function fn(){
var a =1
window.frank = function (){
console.log(a)
}
}
fn()以上代码不符合我的目的。这个函数有个名字fn，也是一个全局变量---------分割线---------改善：立即执行函数。(function (){
var a =1
window.frank = function (){
console.log(a)
}
}())目的达到了。---------分割线--------- 再改善： let{
let a = 1
window.frank = function (){
console.log(a)
}
}
console.log(a) //a is not defined
console.log(window.frank) //f () {}。正常执行目的达到了。let
let语句声明一个块级作用域的本地变量，并且可选的将其初始化为一个值。let声明的变量只在它所在的代码块有效。
{
leta = 10
var b = 20
}
console.log(a) //a is not defined
console.log(b) //20if(true){
let b = 1;
console.log(1) //1
}else{
console.log(2) //2
}
console.log(b) // 报错 b is not defined说明：
let 的作用域在最近的 {} 之间
不存在变量提升。
{
let a = 1
var b = 1
{
console.log(a) //报错。a is not defined
console.log(b) // undefined
let a = 2
var b = 2
}
}-------------分割线---------------//var 的情况
console.log(x)// undefined
var x = 2;
//let的情况
console.log(y) // 报错。 y is not defined
let y = 3如果在let a之前使用a，那么会报错。不允许重复声明
//报错
function fn(){
var a = 1
let a = 2
}//报错
function f(){
let b = 1
let b = 2
}const
const声明一个只读的常量。一旦声明，常量的值就不能改变。不允许再次赋值，只有一次赋值机会
// let
{
let a= 1
console.log(a) //1
a = 2
console.log(a) // 2
}// const
{
const a= 1
console.log(a) //1
a = 2
console.log(a) // 报错
}
不能只声明，不赋值。
constb;
// 报错
console.log(b)
总结： 1、var 会变量提升，可以重复赋值。 2、var 变量提升将影响变量声明，而不会影响其值的初始化。 3、const与let的作用域是相同的：只在声明所在的块级作用域内有效。 4、const与let都是不可重复声明。 5、const与let都是不存在变量提升。 6、const只有一次赋值机会，而且必须在声明的时候立马赋值。 补充面试题：
题1：
---------var a = 11
function fn(){
console.log(a)//输出？
}
a = 22
fn()-----------------------------------------题2：
---------var a = 11
function fn(){
console.log(a)//输出？
}
fn()
a = 22-----------------------------------------答案：题1 ：输出22
题2 ：输出11
-----------------------------------------
题3：
---------for(var i = 0;
i < 6;
i++){}
console.log(i)// 输出？-----------------------------------------
解：
var i
for( i = 0;
i < 6;
i++){
//0，1，2，3，4，5
}
console.log(i)// 输出 6// var 变量提升。for循环到 i = 6 的时候，
// 不满足 i < 6 的条件，就跳到console.log(i)，
// 所以最后输出 6题4：
---------for(var i = 0;
i < 6;
i++){
function fn(){
console.log(i)// 输出？
}
fn()
}题5：
---------for(var i = 0;
i < 6;
i++){
function fn(){
console.log(i)// 输出？
}
x.onclick = fn
}答案：题3 ：输出 6
题4 ：输出 0,1,2,3,4,5
题5 ：输出 6(时机问题，刻舟求剑)-----------------------------------------
题6：
---------
- 导航1
- 导航2
- 导航3
- 导航4
- 导航5
- 导航6
var liTags = document.querySelectorAll('li')for(var i = 0;
i < liTags.length;
i++){
liTags[i].onclick = function(){
console.log(i)// 当我点击【导航3】输出？
}
}答案：题6 ：输出 6 （变量提升）
-----------------------------------------针对题6进行修改，实现点击第n个【导航】就输出n ；
如点击【导航1】 输出 0解法1：//用let就好了
var liTags = document.querySelectorAll('li')for(var i = 0;
i < liTags.length;
i++){
let j= i;
liTags[i].onclick = function(){
console.log(i)// 当我点击【导航3】输出 2
}
}-----------------------------------------解法2：使用立即执行函数var liTags = document.querySelectorAll('li')for(var i = 0;
i < liTags.length;
i++){
(function(j){//j等于第一个参数
//var j = arguments[0]//j等于第一个参数liTags[j].onclick = function(){
console.log(j)// 当我点击【导航3】输出 2
}
})(i)}简化：
-----------------------------------------var liTags = document.querySelectorAll('li')//i的作用域是 () 括号里面。
// 0,1,2,3,4,5 退出循环 6
for(let i = 0;
i < liTags.length;
i++){
//块里面的i =圆括号里面 i 的值
// i0,i1,i2,i3,i4,i5
liTags[i].onclick = function(){
console.log(i)// 当我点击【导航3】输出 2
}
// 圆括号里面 i 的值 = 块里面的i
}
