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. win8+sdk8+vs2012+freeglut+glew开发opengl

    写给想要学习opengl的同学们. 刚开始学习opengl的时候,对于整个环境的搭建以及一些概念不太清晰,网上的资料又比较凌乱,因此在此总结一下,方便大家. 首先,是有一个windows系统,我用的是 ...

  2. hdmap相关

    图片来源:https://vires.com/ 新闻摘抄: 对此,武汉光庭信息技术股份有限公司副总经理罗跃军告诉记者:“事实上,最初由自动驾驶车身控制系统协会所提出的地图精度要求很高,需要达到5cm甚 ...

  3. Android6.0 旋转屏幕（五）WMS启动应用流程（屏幕方向相关）

    一.强制设置方向 1.Activity 如果要强制设置一个Activity的横竖屏可以通过Manifest去设置,跟Activity相关的信息都会保存在ActivityInfo当中. android: ...

  4. php设置编码格式的方法

    a. 如果欲使用gb2312编码,那么php要输出头:header(“Content-Type: text/html; charset=gb2312"),静态页面添加<meta htt ...

  5. [acm]HDOJ 2673 shǎ崽 OrOrOrOrz

    题目地址: http://acm.hdu.edu.cn/showproblem.php?pid=2673 拍两次序,交替输出 #include<iostream> #include< ...

  6. storm相关技术

    There are two kinds of nodes on a Storm cluster: the master node and the worker nodes. 有两种节点,主节点和wor ...

  7. POJ2763 Housewife Wind(树剖+线段树)

    After their royal wedding, Jiajia and Wind hid away in XX Village, to enjoy their ordinary happy lif ...

  8. vmware 三种网络模式图解及分区挂载

  9. CentOS7的网络配置

    1.DNS配置 新安装的虚拟机,ping 内网IP可以,但是ping 外网域名却失败,告知“Name or service not known”. 原来是因为需要在/etc/sysconfig/net ...

  10. docker安装与操作

    准备和安装 1.到这个路径下下载docker engine: https://get.docker.com/rpm/1.7.1/centos-7/RPMS/x86_64/docker-engine-1 ...