前言:

以前我们在声明时只有一种方法,就是使用var来进行声明,ES6对声明的进行了扩展,现在可以有三种声明方式了。

字面理解ES6的三种声明方式:

  1. var:它是variable的简写,可以理解成变量的意思。
  2. let:它在英文中是“让”的意思,也可以理解为一种声明的意思。
  3. const:它在英文中也是常量的意思,在ES6也是用来声明常量的,常量你可以简单理解为不变的量。

var声明:

var在ES6里是用来升级全局变量的,我们可以先作一个最简单的实例,用var声明一个变量a,然后用console.log进行输出。

var a='rong';
console.log(a);  //rong

我们可以看到rong在控制台已经被打印出来了。那如何理解它的作用是声明全局变量那?我们用匿名函数给他进行一个包裹,然后在匿名函数中调用这个a变量,看看能不能调用到。

var a="rong";
window.onload= function(){
console.log(a);  //rong
}

可以看到控制台输出了rong,这证明var确实是全局的。如果你觉的这个不够直观说明var是全局声明,还可以用区块的方式进行调用测试,先看下面的代码。

var a=2;
{
var a=3;
}
console.log(a);  //3

这时打印出来的值是多少那?对,应该是3,因为var是全局声明的。

** let局部声明 **

通过两个简单的例子,我们对var的全局声明有了一定了解。那跟var向对应的是let,它是局部变量声明。还是上面的例子,我们试着在区块里用let声明。

var a=2;
{
let a=3;
}
console.log(a);  //2

这时候控制台打印出来的值就是2了。如果我们只在区块里声明,不再外部声明,我们打印a时就会报错,显示找不到变量。

{
let a=3;
}
console.log(a);  //a is not defined

上面两个例子说明了let是局部变量声明,let声明只在区块内起作用,外部是不可以调用的。

** 用Let声明的循环 **  

for(let i=0;i<10;i++){
  console.log('循环体中:'+i);
}
console.log('循环体外:'+i);

你执行时会发现控制台报错了,找不到循环体外的i变量。通过两种声明的比较,可以明白let在防止程序数据污染上还是很有用处的。我们要努力去习惯用let声明,减少var声明去污染全局空间,在vue的使用中也要注意这点。

** const声明常量**

在程序开发中,有些变量是希望声明后在业务层就不再发生变化了,简单来说就是从声明开始,这个变量始终不变,就需要用const进行声明。

我们来一段用const声明错误的代码,在错误中学习const的特性也是非常好的。

const a="rong";
var a='蓉';
console.log(a);

在编译这段代码的过程中,你就会发现已经报错,无法编译了,原因就是我们const声明的变量是不可以改变的。const是很好理解的 

-----总结---------------------------------------------------------------------------------------------------------------------------------------------------

1. var 跟 let 上面的变量是可以重复声明并且可以重复定义

2.  var 在函数内声明,只能在函数作用域中使用(假设在if语句中声明,var还是属于全局的)

3.  let 跟 const  是块级作用域中声明的,{ }

4. const 声明的变量是不能修改的,但是变量的属性是能够重新赋值的,假设连属性也不许给他修改,那会用到es5中的方法

const wangrong = {
name:'wr',
age:'26'
}
const wangrong = Object.freeze(person);

  

 

二.ES6新的声明方式的更多相关文章

  1. 【系统学习ES6】第一节:新的声明方式

    [系统学习ES6] 本专题旨在对ES6的常用技术点进行系统性梳理,帮助大家对其有更好的掌握.计划每周更新1-2篇,希望大家有所收获. 以前用ES5时,声明变量只能用var.ES6的出现,为我们带来了两 ...

  2. ES6第二节:新的声明方式

    通过上一节的环境搭建完成,接下来我们就可以愉快的探索ES6的新世界了!下面我们从新的声明方式开始: 在ES6里新加了两种声明方式:let 和 const,以前我们都是用var去作声明,接下来我们一一比 ...

  3. ES6系列_2之新的声明方式

    在ES5中我们在声明时只有一种方法,就是使用var来进行声明,ES6对声明的进行了扩展,现在可以有三种声明方式. (1)var:它是variable的简写,可以理解成变量的意思. (2)let:它在英 ...

  4. es6 新增变量声明方式

    let 与 var var var声明的变量拥有全局作用域或者局部作用域 在全局中声明变量即为全局变量 在函数中声明变量即为局部变量 而var在使用过程中也逐渐暴露出许多问题 var的几大问题 变量提 ...

  5. ES6 - 基础学习(2): 新的变量声明方式 let 与 const

    ES6)新增加了两个重要的 JavaScript 关键字:let 和 const.以前声明变量时只有一种方式:var,ES6对声明方式进行了扩展,现在可以有三种声明方式了. 1.var:variabl ...

  6. ES6新特性之生成器函数 (generator function): function*

    一.什么是生成器函数(generator function)? 生成器函数是ES6的新特性之一,它是一个在执行时能中途暂时退出,后面重新调用又能重新进入继续执行的一种函数. 并且在函数内定义的变量的所 ...

  7. 你不知道的JavaScript--Item24 ES6新特性概览

    ES6新特性概览 本文基于lukehoban/es6features ,同时参考了大量博客资料,具体见文末引用. ES6(ECMAScript 6)是即将到来的新版本JavaScript语言的标准,代 ...

  8. ES6入门五:箭头函数、函数与ES6新语法

    箭头函数的基本用法与特点 函数与ES6新语法 一.箭头函数的基本用法与特点 声明箭头函数采用声明变量和常量的关键字:var.let.const 箭头函数的参数:没有参数用"()"空 ...

  9. ES6新特性概览

    本文基于lukehoban/es6features ,同时参考了大量博客资料,具体见文末引用. ES6(ECMAScript 6)是即将到来的新版本JavaScript语言的标准,代号harmony( ...

随机推荐

  1. xslt数值的函数与xslt字符串函数

    以下是xslt数值的函数与xslt字符串函数的说明与参考示例. 1.xslt数值的函数:(1)fn:number(arg) 返回参数的数值.参数可以是布尔值.字符串或节点集. 示例:<xsl:v ...

  2. LOG2_8BIT, LOG2_16BIT, LOG2_32BIT, LOG64_8BIT, LOG2

    #define LOG2_8BIT(v) (8 - 90/(((v)/4+14)|1) - 2/((v)/2+1)) #define LOG2_16BIT(v) (8*((v)>255) + L ...

  3. leetcode题解(持续更新)

    leetcode题解 1.两数之和 给定一个整数数组 nums 和一个目标值 target,请你在该数组中找出和为目标值的那 两个 整数,并返回他们的数组下标. 你可以假设每种输入只会对应一个答案.但 ...

  4. 记录装CDH新增加一些遇到问题的解决

    报错信息:MainThread agent ERROR Heartbeating to localhost:7182 failed.解决:配置CM Agentcm的安装包的server和agent都是 ...

  5. Java 仓储模式

    使用的Spring boot +Jpa 项目层级: common里包含了model,以及一些viewModel等等 下面就是设计的仓储模式 先看下SysUser: @MappedSuperclass ...

  6. django静态文件的配置

    Django static静态配置文件   对于Django来说静态文件一般交由Web服务器处理,Django本身不处理静态文件.为了使Django开发环境能够处理静态文件,Django有和生产环境不 ...

  7. bzoj 3579: 破冰派对

    题意: 给你一个图,问你有多少个方案把他分成连个新的图.使得一个图是一个团,另外一个是独立集 一些闲话: 以前做过一次这个题..当时听说爆搜可以过,就无脑莽过去了.. 也没有思考为什么爆搜能过,或者有 ...

  8. Yii2 使用 npm 安装的包

    转载自: yii2.0.15 使用 npm 替换 bower,加速 composer 安装速度 [ 2.0 版本 ] 修改 ommon/config/main.php <?php return ...

  9. mysql 主从笔记

    主库配置 一.修改主库配置文件 开启binlog,并设置server-id,每次修改配置文件后都要重启mysql服务才会生效 server-id = log-bin = mysql-bin binlo ...

  10. 配置文件一web.xml

    前言 web.xml中标签的加载顺序:<context-param> > <listener> (spring的相关工作) > filter >servlet ...