var 和let和const的各自特点及区别

文章详细对比了JavaScript中的var、let和const在声明、赋值、变量提升、块级作用域、重复声明以及常量特性上的差异,强调了let和const在ES6中为解决var的一些问题而引入的新特性。

var 和let的区别

一.var的特点

  1. var可以先赋值再定义(漏洞不符合逻辑)
age = 18
// let age   //let不能先赋值在定义,必须先定义再赋值,不然会报错说没有初始化
var age
console.log(age);

2.变量提升:var可以先使用后申明,不报错(不符合逻辑)

console.log(a); // undefined 
var a = 10; //
编译过程 var a;
console.log(a); // undefined 
a = 10;
  1. var可以重复声明,后面的声明会覆盖前面的声明
var a = 10; 
var a = 20;
console.log(a); // 20
//  let不能重复声明
// let a = 1
// let a = 2错误
  1. var没有块级作用域,在函数中使用var声明变量的时候,该变量是局部的
var a = 10;
function change(){ 
    var a = 20;
} 
change(); 
console.log(a); // 10

而如果在函数内不使用var,该变量是全局的

var a = 10; 
function change(){
    a = 20
}; 
change(); 
console.log(a); // 20

二.let的特点

  1. 不存在变量提升,let声明变量前,该变量不能使用(暂时性死区)
console.log(a); // ReferenceError: a is not defined let
a = 10;

2.let不能先赋值在定义,必须先定义再赋值

age = 18
// let age   //let不能先赋值在定义,必须先定义再赋值,不然会报错说没有初始化
var age
console.log(age);
  1. let命令所在的代码块内有效,在块级作用域内有效
{ 
    let a = 10;
}
console.log(a); // ReferenceError: a is not defined
  1. let不允许在相同作用域中重复声明,注意是相同作用域,不同作用域有重复声明不会报错
let a = 10;
let a = 20; // Uncaught SyntaxError: Identifier 'a' has already been declared 
let a = 10;
{ 
    let a = 20;
} // ok

三.const

  1. const必须初始化
const a; // SyntaxError: Missing initializer in const declaration 
const a = 10; // ok
  1. const声明一个只读的变量,声明后,不能重新赋值
const a = 10;
a = 20; // TypeError: Assignment to constant variable.
  1. const并不是变量的值不能改动,而是变量指向的内存地址所保存的数据不得改动
const obj = { 
    age: 17 
}
obj.age = 18; // ok
obj = { 
    age: 18
} // SyntaxError: Identifier 'obj' has already been declared
  1. let该有的特点const都有

四.区别

1.先赋值再定义

var可以先赋值再定义,let不能先赋值在定义,必须先定义再赋值,不然会报错说没有初始化

2.变量提升

var声明的变量存在变量提升,即变量可以在声明之前调用,值为undefined
let和const不存在变量提升,即它们所声明的变量一定要在声明后使用,否则报错

3.块级作用域

var不存在块级作用域
let和const存在块级作用域

4.重复声明

var允许重复声明变量
let和const在同一作用域不允许重复声明变量

5.修改声明的变量

var和let可以
const声明一个只读的常量。一旦声明,常量的值就不能改变,但对于对象和数据这种引用类型,内存地址不能修改,可以修改里面的值。

### JavaScript 中 `var`、`let` `const` 的区别 #### 1. 变量作用域 在函数内部使用 `var` 声明的变量具有函数级作用域,而在全局范围内声明则属于全局对象的一部分。相比之下,`let` `const` 提供了更严格的块级作用域,在大括号 `{}` 内定义的内容仅限于该代码块内有效[^1]。 ```javascript function example() { var a = "global"; if (true) { var a = "local"; // 这里的a会覆盖外部的a console.log(a); // 输出 'local' } console.log(a); // 输出 'local',因为var有变量提升现象 } example(); ``` 对于 `let` 或 `const` 来说: ```javascript function anotherExample() { let b = "outside"; if (true) { let b = "inside"; // 不会影响外层b console.log(b); // 输出 'inside' } console.log(b); // 输出 'outside' } anotherExample(); ``` #### 2. 变量提升(Hoisting) 当使用 `var` 关键字时,即使是在条件语句或其他结构之后初始化变量,也会被认为是在其所在的作用域顶部被创建并赋予 undefined 值;而 `let` `const` 则不会发生这种行为,直到执行到具体的声明位置才会真正建立绑定关系,并且在此之前访问这些变量会导致引用错误。 #### 3. 是否允许重新赋值 - 使用 `var` 定义后的变量可以在任何地方再次分配新值; - 对于 `let` 而言,虽然也可以改变已有的数值,但是不允许在同一作用域重复声明相同名称的变量; - 至于 `const` ,一旦设定就不能更改所指向的数据地址,不过如果是指向复杂数据类型的实例,则仍能修改其中属性或元素而不违反常量特性。 ```javascript // 正确用法 const obj = { key: 'value' }; obj.key = 'newValue'; // 合法操作 // 错误尝试 const num = 5; num = 10; // 抛出TypeError异常 ```
评论
成就一亿技术人!
拼手气红包6.0元
还能输入1000个字符
 
红包 添加红包
表情包 插入表情
 条评论被折叠 查看
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值