var、let、const的区别

var、let、const的区别

ES6之前我们主要使用var来声明变量，ES6中加入了let、const来声明变量，那么他们之间有什么区别呢？

首先我们要知道没有使用了var关键字定义变量，并且存在同名的全局变量，该变量等同于全局变量;

a=100;
console.log(a); //获取全局变量：a=100
function f() {
    console.log(a); //获取全局变量：a=100
    a=10;//修改全局变量：a=10
    console.log(a); //获取全局变量：a=10
}
f();//调用函数
console.log(a);//获取全局变量：a=10

第二没有使用了var关键字定义变量，不存在同名的全局变量，该变量提升为全局变量

function f() {
    a=10;//定义变量a,自动提升为全局变量：a=10
    console.log(a); //获取全局变量：a=10
}
f();//调用函数
console.log(a);//获取全局变量：a=10

存在问题：

1、局部变量如果和全局变量重名则会覆盖掉全局变量，

2、定义在函数内的变量在外部也可以访问

一、var的特性：

1、var定义的变量分为全局变量和局部变量

• 定义在函数外的变量称为全局变量
• 定义在函数内的变量称为局部变量

var a=100;
console.log(a); //a为全局变量 a=100
function f() {
    var a=10;
    console.log(a); //a为局部变量a=10
}
f();//调用函数
console.log(a)//a为全局变量a=100

var定义的局部变量不会覆盖掉同名的全局变量

function f() {
    var a=10;
    console.log(a); //a为局部变量a=10
}
f();//函数调用
console.log(a)//a is not defined

var定义的局部变量只能在函数内使用

2、var声明的变量存在变量声明提升

function f() {
    console.log(a);//变量声明自动提升到函数开始位置 a=undefined
    var a=10;
    console.log(a); //a为局部变量a=10
}
f();//函数调用
console.log(a)//a is not defined

var定义的变量没有暂时性死区，在代码块内，声明变量之前，该变量都是不可用的，这在语法上，称为“暂时性死区”

3、var声明的变量没有块级作用域

{
    console.log(a);//变量声明自动提升到函数开始位置 a=undefined
    var a=10;
    console.log(a); //a为局部变量a=10
}
console.log(a)//a可以正常访问 a=10

定义在代码块中的var变量可以在代码块以外的范围进行访问

二、let特性

let是ES6新增关键字，可以用来声明变量

1、let可以声明全局变量和局部变量

let a=100;
console.log(a); //a为全局变量 a=100
function f() {
    let a=10;
    console.log(a); //a为局部变量a=10
}
f();
console.log(a)//a为全局变量a=100

let定义的局部变量不会覆盖掉同名的全局变量

function f() {
    let a=10;
    console.log(a); //a为局部变量a=10
}
f();//函数调用
console.log(a)//a is not defined

let定义的局部变量只能在函数内使用

2、let声明的变量不存在变量声明提升

function f() {
    console.log(a);//Cannot access 'a' before initialization
    let a=10;
    console.log(a); //a为局部变量a=10
}
f();//函数调用
console.log(a)//a is not defined

初始化前无法访问“a”，let定义的变量没有暂时性死区

3、let声明的变量有块级作用域

{
    let a=10;
    console.log(a); //a为局部变量a=10
}
console.log(a)//a is not defined

三、const特性

const是ES6新增关键字，可以用来声明常量

1、可以声明全局常量和局部常量

const a=100;
function f(){
    const a=10;
    console.log(a); //a为局部变量a=10
}
f();//函数调用
console.log(a)//a为全局变量a=100

const定义的局部常量不会覆盖掉同名的全局常量

function f(){
    const a=10;
    console.log(a); //a为局部变量a=10
}
f();//函数调用
console.log(a)//a is not defined

const定义的局部常量只能在函数中使用

2、const声明的常量不存在变量声明提升

function f(){
    console.log(a);//Cannot access 'a' before initialization
    const a=10;
    console.log(a); //a为局部变量a=10
}
f();//函数调用
console.log(a)//a is not defined

3、const声明的常量有块级作用域

{
    const a=10;
    console.log(a); //a为局部变量a=10
}
console.log(a)//a is not defined

4、const声明的常量不可更改，但声明的对象属性可以更改

function f(){
    const a=10;
    a=20;//Assignment to constant variable
    console.log(a); //a为局部变量a=10
}
f();//函数调用
console.log(a)//a is not defined

const定义的number,string,boolean…不能改变

function f(){
    const obj={name:'Tom',age:20};
    obj.name='Jarry';//修改obj的name属性
    console.log(obj.name)//Jarry
}
f();//函数调用

const定义的对象属性可以改变