认识 var、let、const
我们通过声明、初始化、值的可变性、作用域、变量提升以及在工作中如何使用等多个方面来详细了解var、let、const等关键字功能与特点。
声明
var,let:可以先声明,后赋值(初始化),默认值是 undefined。
const:不能将声明与初始化单独分开,否则报错,没有默认值。
var:声明的标识符可以被重复声明多次,多次声明进行的都是覆盖操作,
const,let:同一个标识符不能同时声明多次,否则报语法错误。
let variable;
let variable; //Uncaught SyntaxError: Identifier 'x' has already been declared
初始化
var,let:可以先定义再初始化,默认值为 undefined。
const:不能将变量的声明与初始分离进行单独操作。
const variable //Uncaught SyntaxError: Missing initializer in const declaration
值的改变
const:不可以改变值,定义的是不变量。
let,var:定义的变量可以改变值。
const variable = 1;
variable = 2; //Uncaught TypeError: Assignment to constant variable.
但是const可以对引用类型的值进行操作。
const arr = [];
arr.push(1); //[1]
作用域
var:不具有块级作用域。
const,let:都具有块级作用域。
for(var a=0;a<3;a++);
for(let b=0;b<3;b++);
a; //3
if(a){
const c = 0;
}
b; //Uncaught ReferenceError: b is not defined
c; //ReferenceError: c is not defined
标识符提升
var: 定义的变量存在变量提升情况。
const,let:声明的变量都不具有变量提升的情况,否则报错。
console.log(a); //Uncaught ReferenceError: a is not defined
let a = 1;
如何使用?
目前很多浏览器对于 ES6的兼容已经越来越强大了,所以未来只按照 ES5的方式去写代码绝对是不够的,因此从此刻开始,我们要将更多已经成熟并且流行的 ES6新特性加入到我们的代码中,当然,这势必会对现有的规范与编码习惯造成很大的冲击,但是我想,学习一门新技术,技术本身并非全部,而是要将新技术更好的融入现有的工作任务中去,去发现新特性解决问题的本质才是重中之重。
通过对 var,let,const在声明,赋值,作用域等对比,我们可以明显的得出一个使用的限制等级的划分:
var -> let -> const
而在具体的工作中,对我们编写的代码结合上面的限制等级一起进行分析,就不难得出var,let,const在不同地方,不同层面的具体应用了
。
例如,let相比 var除了具有块级作用域,在全局代码或者是函数代码中let与var并没有很大的区别。但是一旦在全局代码与函数代码中具有块级范围(JS并不具有块级代码),例如,if,for,while,with 等语句时,并在其中通过 var,let 定义了变量,那么情况就会有很大的不同:
function test1(){
var a = 1;
let b = 2;
console.log(a);
console.log(b);
}
function test2(){
var a = 1;
for(let i=0;i<3;i++){
;
}
console.log(a);
console.log(i);
}
test1();
test2();
而 const 相比 var 具有块级作用域,再对比 let ,它的声明与初始化必须同时进行,值一旦初始化便不可改变,所以,const通常用来定义一些全局的常量,例如通过require载入的模块,或者用于全局配置的不变量变量等。
另外需要注意的是,const值如果是一个对象,那么允许修改对象的属性而不允许修改变量本身的值。
const b = {};
b.x = 1;
b.y = 2;
console.log(b);
b = {
z: 1
};
console.log(b);
总的来说在具体工作中使用,全局不变的量可以用const定义,局部作用域中的块级范围代码可以通过let定义,而其它一般代码依然可以继续使用我们更为熟悉的 var关键字。
认识 var、let、const的更多相关文章
- let、var、const声明的区别
前言 看了方应杭老师的一篇解释let的文章,对JavaScript中的声明有了深刻的理解,这里也就有了总结一下JavaScript中各种声明之间区别的这篇文章. JavaScript中变量声明机制 首 ...
- var let const 的区别
Var let const 的区别 1.Var 定义的变量存在变量提升,而了let和const不存在变量提升.即在定义的变量代码上使用该变量,var的会输出undefined,而let的会报错. 2. ...
- ES6和ES5变量声明的区别(var let const)
// es5的语法与es6的语法区别 // var let const console.log(name);//undefine,不会报错,因为变量声明会提到作用域的最前面 var name=&quo ...
- var和const和let的区别
简述: 1.前端的变量申明,可以用到var,ES6的const(衡量)/let(变量) 2.在ES5用的都是var,到ES6之后,也就是2015年开始出现const/let. var 不会报错,有声明 ...
- let、var、const区别(表格比较)
let.var.const区别(表格比较): 区别项 let var const 作用域 块级作用域 全局作用域或函数作用域 块级作用域 是否有变量提升 无 有 无 是否可重复声明 不可 可以 不可 ...
- var let const的一些区别
var let const 都是来定义变量的. var let 作用域有些区别. const 类似于java中的常量的概念.即:只能给一个变量赋值一次,即指定一个引用. 举例来说: function ...
- javascript中var let const三种变量声明方式
javascript中var let const三种变量声明方式 1.var ①var表示声明了一个变量,并且可以同时初始化该变量. ②使用var语句声明的变量的作用域是当前执行位置的上下文:一个函 ...
- es6(var,let,const,set,map,Array.from())
1.变量声明--var,const,let 1.1 var - (全局作用域,局部作用域)会有变量提升 //第一个小例子 <script> var num = 123; function ...
- let、var、const用法区别
1.var var 声明的变量为全局变量,并会进行变量提升:也可以只声明变量而不进行赋值,输出为undefined,以下写法都是合法的. var a var a = 123 2.let let 声明 ...
- 浅谈JS中 var let const 变量声明
浅谈JS中 var let const 变量声明 用var来声明变量会出现的问题: 1. 允许重复的变量声明:导致数据被覆盖 2. 变量提升:怪异的数据访问.闭包问题 3. 全局变量挂载到全局对象:全 ...
随机推荐
- 使用VS2013 + EF6 + .NET4.5 连接Mysql数据库
1.安装插件 在使用Visual Studio 2013添加ADO.NET实体数据模型新建连接时,默认是没有Mysql选项的.此时我们需要安装两个东西: 1.mysql-for-visualstudi ...
- 基于Hadoop(M/R)的MySQL到Oracle海量数据切割
# 背景介绍 大数据时代,海量数据的迁移会很普遍地出现在各个应用场景,本文主要讨论利用Sqoop的分布式能力从关系型数据库MySQL到Oracle的海量数据迁移和切割. # 所需环境 1 JDK+Ec ...
- java:凯撒密码及String的应用
一,凯撒密码 古罗马皇帝凯撒在打仗时曾使用过以下方法加密军事情报 现在用java实现 程序设计思想: 1,字符串首先要转化为字符数组,才能依次加密 2,当原来的字符为X,Y,Z时,加密后要转化为A,B ...
- clone对象
在JavaScript中,当对象作为参数传给函数的时候,在函数内部对这个对象的属性进行修改时,函数外部的对象属性也会跟着被修改,而有些时候我们并不想原来的对象数据发生改变,这时候就需要切断对象之间的引 ...
- js实现一个简单钟表动画(javascript+html5 canvas)
第一次在博客园注册发博.有一次去人家单位开标,看到开标网站上有个钟表动画,一时兴起,就写了个简单的钟表动画. 用js和html5 canvas对象实现一个简单钟表程序 主要用到的就是h5的canvas ...
- express紧急回顾随笔
四行代码搭建服务器 var express = require('express'); var app = express(); //设定静态路径 所有请求优先在此路径查找 //不要把服务器配置JS文 ...
- JAVAscript学习笔记 jsDOM 第五节 (原创) 参考js使用表
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
- Problem F: 合唱比赛开始了!
Problem F: 合唱比赛开始了! Time Limit: 1 Sec Memory Limit: 128 MBSubmit: 440 Solved: 201[Submit][Status][ ...
- linux-mkdir
mkdir mkdir : 可以用来创建目录,如果不加创建路径即在本路径下创建一个新的指定的目录,否则即在给出的路径下创建目录. 目录创建:目录名尽量见名知意,根据不同需要分层创建,尽量避免在同一目录 ...
- WebService--axis
axis WebService虽然现在已经很少使用,但是还是把它的配置过程写出来,开发环境jdk 1.6 服务端: 1,导入需要jar包,自行下载 2,创建WebService接口 public in ...