别院牧志知识库 别院牧志知识库
首页
  • 基础

    • 全栈之路
    • 😎Awesome资源
  • 进阶

    • Python 工匠系列
    • 高阶知识点
  • 指南教程

    • Socket 编程
    • 异步编程
    • PEP 系列
  • 面试

    • Python 面试题
    • 2022 面试记录
    • 2021 面试记录
    • 2020 面试记录
    • 2019 面试记录
    • 数据库索引原理
  • 基金

    • 基金知识
    • 基金经理
  • 细读经典

    • 德隆-三个知道
    • 孔曼子-摊大饼理论
    • 配置者说-躺赢之路
    • 资水-建立自己的投资体系
    • 反脆弱
  • Git 参考手册
  • 提问的智慧
  • 分类
  • 标签
  • 归档
GitHub (opens new window)
首页
  • 基础

    • 全栈之路
    • 😎Awesome资源
  • 进阶

    • Python 工匠系列
    • 高阶知识点
  • 指南教程

    • Socket 编程
    • 异步编程
    • PEP 系列
  • 面试

    • Python 面试题
    • 2022 面试记录
    • 2021 面试记录
    • 2020 面试记录
    • 2019 面试记录
    • 数据库索引原理
  • 基金

    • 基金知识
    • 基金经理
  • 细读经典

    • 德隆-三个知道
    • 孔曼子-摊大饼理论
    • 配置者说-躺赢之路
    • 资水-建立自己的投资体系
    • 反脆弱
  • Git 参考手册
  • 提问的智慧
  • 分类
  • 标签
  • 归档
GitHub (opens new window)
  • 工作
  • 规范

  • Linux

  • 数据库

  • Git

  • 👨‍💻Web

  • 英语

  • Docker

  • 编辑器

  • 网络

  • 前端

    • 前端模板收集
    • 《Vue》笔记

    • Vue 资源
    • Angular

    • JavaScript

      • var,let,const 三者的特点和区别
        • var 的特点
        • let 的特点
        • const
        • 区别
        • 使用
      • new 命令原理
      • ES5 面向对象
      • ES6 面向对象
      • 多种数组去重性能对比
      • JS 随机打乱数组
      • 判断是否为移动端浏览器
      • 将一维数组按指定长度转为二维数组
      • 防抖与节流函数
      • JS 获取和修改 url 参数
      • 比 typeof 运算符更准确的类型判断
    • Vue文章

  • 存储

  • 备忘录

  • 如何开始你的单元测试
  • 以程序员的视角看中国——西安篇
  • 💻工作
  • 前端
  • JavaScript
佚名
2019-12-25
目录

var,let,const 三者的特点和区别

# var 的特点

  1. 存在变量提升
console.log(a); // undefined
var a = 10;

// 编译过程
var a;
console.log(a); // undefined
a = 10;
1
2
3
4
5
6
7
  1. 一个变量可多次声明,后面的声明会覆盖前面的声明
var a = 10;
var a = 20;
console.log(a); // 20
1
2
3
  1. 在函数中使用 var 声明变量的时候,该变量是局部的
var a = 10;
function change(){
    var a = 20;
}
change();
console.log(a); // 10
1
2
3
4
5
6
  1. 如果在函数内不使用 var,该变量是全局的
var a = 10;
function change(){
    a = 20
};
change();
console.log(a); // 20
1
2
3
4
5
6

# let 的特点

  1. 不存在变量提升,let 声明变量前,该变量不能使用(暂时性死区)。
console.log(a); // ReferenceError: a is not defined
let a = 10;
1
2
  1. let 命令所在的代码块内有效,在块级作用域内有效
{
let a = 10;
}
console.log(a);  // ReferenceError: a is not defined
1
2
3
4
  1. let 不允许在相同作用域中重复声明,注意是相同作用域,不同作用域有重复声明不会报错
let a = 10;
let a = 20;
// Uncaught SyntaxError: Identifier 'a' has already been declared

let a = 10;
{
let a = 20;
}
// ok
1
2
3
4
5
6
7
8
9

# const

  1. const 声明一个只读的变量,声明后,值就不能改变
const a = 10;
a = 20;  // TypeError: Assignment to constant variable.
1
2
  1. const 必须初始化
const a;  // SyntaxError: Missing initializer in const declaration
const a = 10; // ok
1
2
  1. const 并不是变量的值不能改动,而是变量指向的内存地址所保存的数据不得改动
const obj = {
age: 17
}
obj.age = 18;  // ok

obj = {
age: 18
}
//  SyntaxError: Identifier 'obj' has already been declared
1
2
3
4
5
6
7
8
9
  1. let 该有的特点 const 都有

# 区别

  1. 变量提升

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

  1. 块级作用域

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

  1. 重复声明

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

  1. 修改声明的变量

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

# 使用

能用 const 的情况下尽量使用 const,大多数情况使用 let,避免使用 var。使用优先级:

const > let > var  
1

const 声明的好处,一让阅读代码的人知道该变量不可修改,二是防止在修改代码的过程中无意中修改了该变量导致报错,减少 bug 的产生。let 声明没有产生预编译和变量提升的问题,先声明再使用可以让代码本身更加规范,let 是个块级作用域,也不会污染到全局的变量声明。
最后说一点就是使用的场景说明:let 一般应用于基本数据类型;const 一般应用于引用数据类型,也就是函数对象等。

编辑 (opens new window)
#JavaScript
上次更新: 2024-07-15, 08:03:22
Angular 中如何对一个动态表单根据 select 的选项 disable 关联的 input?
new 命令原理

← Angular 中如何对一个动态表单根据 select 的选项 disable 关联的 input? new 命令原理→

最近更新
01
提升沟通亲和力的实用策略
03-26
02
工作
07-15
03
如何选房子
06-25
更多文章>
Theme by Vdoing | Copyright © 2019-2025 IMOYAO | 别院牧志
  • 跟随系统
  • 浅色模式
  • 深色模式
  • 阅读模式