ES6提出了两个新的声明变量的命令:let 和 const 
1. 建议不再使用var,而使用let 和const 。优先使用const。

在定义之后值是固定不变的,即为常量
常量的值不能修改,但是如果常量保存的是一个对象,那么对象的属性是可以被修改的。

const a = 1;

a = 2;
console.log(a);//报错

const a = {
   name:'leo'
 };
 a.name = 'momo';
 console.log(a.name);   //momo

let特性:
  1、不允许重复声明
  2、没有预解析。
  3、块级作用域

一对{}包括的区域称为代码块
块级作用域指一个变量或者函数只在该区域才起作用。
从块的开始到声明这段的区域 暂存死区。

举个常见的例子

用var依次循环输出i,就要用到闭包

for(var i=0;i<10;i++){
  (function(i){
         setTimeout(function(){
       console.log(i);
     })
       })(i)
 }

用let依次循环输出i,就很方便

for(let i=0;i<10;i++){
  setTimeout(function(){
     console.log(i);
   })
}

应用实例

<!doctype html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>Document</title>
  <style type="text/css">
  div{
    display: none;
  }
  .show{
    display: block;
  }
  .active{
    background-color: yellow;
  }
  </style>
</head>
<body>
  <input type="button" value="tab1" class="active">
  <input type="button" value="tab2">
  <input type="button" value="tab3">
  <div class="show">div1</div>
  <div>div2</div>
  <div>div3</div>
  <script type="text/javascript">
  "use strict"

  var tabs = document.getElementsByTagName('input');

  var divs = document.getElementsByTagName('div');

  for(let i=0;i<tabs.length;i++){
    tabs[i].onclick = function(){
      for(var j=0;j<tabs.length;j++){
        divs[j].className = '';
        tabs[j].className = '';
       }
      this.className = 'active';
      divs[i].className = 'show';
    }
  }
  </script>
</body>
</html>

ES6入门教程---变量和常量的更多相关文章

  1. ES6入门之变量的解构赋值(二)

    前言 在上一章 ES6入门之let和const命令中我们对ES6的相关语法已经有了初步了解,上一章中我们主要学习了三大部分的内容,let命令的使用,块级作用域,const命令的使用,那么从本篇博客将进 ...

  2. es6入门教程完整版

    ECMAScript 6入门 <ECMAScript 6入门>是一本开源的JavaScript语言教程,全面介绍ECMAScript 6新引入的语法特性. 作者:阮一峰 授权:署名-非商用 ...

  3. ES6入门教程---解构赋值和字符串扩展

    解构赋值: ES6允许按照一定模式,从数组和对象中提取值,对变量进行赋值,这被称为解构(Destructuring). 数组的解构赋值: 按照对应的顺序解构. var arr = [1,[2,3]]; ...

  4. ES6入门教程---数值扩展和数组扩展

    1.数值扩展 var num = 0b11; console.log(num);3 var num = 0o11;console.log(num);9 var num = 1.234; console ...

  5. VBA Promming入门教程——变量的使用

    数据类型 VBA中的数据类型可分为两种 示例 String Sub Main Dim s as string s = "Hello" msgbox(s) End Sub Singl ...

  6. C语言入门教程-(4)常量和变量

    1.常量和变量的概念 程序执行过程中其值不能发生改变的量叫做常量,其值能发生改变的量叫做变量.常量可以直接使用,而变量则必须先定义后才能使用,否则编译器会报错. 2.常量和变量的命名规范 在介绍常量和 ...

  7. 【Go入门教程4】变量(var),常量(const),内置基础类型(Boolean、数值 byte,int,rune、字符串、错误类型),分组,iota枚举,array(数值),slice(切片),map(字典),make/new操作,零值

    这小节我们将要介绍如何定义变量.常量.Go 内置类型以及 Go 程序设计中的一些技巧. 定义变量 Go 语言里面定义变量有多种方式. 使用 var 关键字是 Go 最基本的定义变量方式,与 C 语言不 ...

  8. 🤩全套Java教程_Java基础入门教程,零基础小白自学Java必备教程👻002 # 第二单元 常量,变量,数据类型 #

    一.本单元知识点概述 二.本单元目标 (Ⅰ)重点知识目标 1.定义出各种数据类型的变量2.理解自动类型提升3.理解强制类型转换 (Ⅱ)能力目标 1.能够定义出所有类型的常量 2.理解Java中的基本数 ...

  9. es6 快速入门 系列 —— 变量声明:let和const

    其他章节请看: es6 快速入门 系列 变量声明:let和const 试图解决的问题 经典的 var 声明让人迷惑 function demo1(v){ if(v){ var color='red' ...

随机推荐

  1. Nginx之解压编译安装-yellowcong

    安装前准备 对于nginx编译安装需要先安装编译 的工具,然后再安装nginx依赖 yum -y install gcc gcc-c++ autoconf automake make yum -y i ...

  2. Python中出现“TabError: inconsistent use of tabs and spaces in indentation”问题的解决

  3. python的小知识点

    python中的变量的名字必须由字母.数字.下划线组成,并且不可以以数字开头. 字典的内容是键-值对,键必须是不可变的,比如字符,整数,浮点数,元组,列表不可以,因为列表可变.集合的元素不重复.字典和 ...

  4. 简单的可兼容所有浏览器的操作html元素的javascript框架

    1.根据id名称取元素  $id(idName) 2.根据class定义取元素  $class(className)返回所有class被定义成className的元素数组,或者$Eclass(clas ...

  5. html5--1.5 文本元素

    html5--1.5 文本元素 学习要点: 掌握常用的文本元素 文本元素,就是讲一段文本设置成相匹配的结构和含义 1.b元素: 我的作用就是 加粗文字: 2.br元素: 我的作用就是强制换行: 3.i ...

  6. PHP中调用接口

    引用:http://zhidao.baidu.com/question/454935450.html&__bd_tkn__=67bd5d3a742a8b244e09a86fb8b824aa95 ...

  7. BZOJ1251 序列终结者(Splay平衡树)(占位)

    网上有许多题,就是给定一个序列,要你支持几种操作:A.B.C.D.一看另一道题,又是一个序列 要支持几种操作:D.C.B.A.尤其是我们这里的某人,出模拟试题,居然还出了一道这样的,真是没技术含量…… ...

  8. TCP/IP--VLSM

    ##########################VLSM################### 实际案例: 192.168.1.0/28 有几个网络号:2的4次方:16个网络号 : 有几个主机号: ...

  9. P2042 [NOI2005]维护数列[splay或非旋treap·毒瘤题]

    P2042 [NOI2005]维护数列 数列区间和,最大子列和(必须不为空),支持翻转.修改值.插入删除. 练码力的题,很毒瘤.个人因为太菜了,对splay极其生疏,犯了大量错误,在此记录,望以后一定 ...

  10. LED接口

    通常我们都听到别人说DVI接口.VGA接口等,可是这些接口是什么意思,led显示屏厂家小编为您解析其含义与不同之处.   1.DVI接口 DVI接口相校于VGA.HDMI.DP等接口来说体积较大,是目 ...