标签: javascript


var定义变量面临的问题

  • 可以重复定义
  • 无法限制变量不可修改
  • 无块级作用域

ES6变量定义升级

  • 新增let定义变量
  • 新增const定义常量

let特性

  • 有块级作用域
  • 不可重复定义

const特性

  • 有块级作用域
  • 不可重复定义
  • 不可修改

解决的痛点

example1 :

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width">
<title>JS Bin</title>
</head>
<body>
<input type="button" value="1">
<input type="button" value="2">
<input type="button" value="3">
<script>
/*
*如下代码如果想做到点击每个按钮弹出当前按钮的索引,
*用var的话要么就是通过自定义属性,或者用一个自执行函数创造一个作用域
*但是你把var i=0换成let i=0就能很好的实现你所想要的
*/
var btnList = document.getElementsByTagName('input');
var len = btnList.length;
for(var i=0;i<len;i++){//(var let =0;i<len;i++)
btnList[i].onclick = function(){
alert(i);
}
}
</script>
</body>
</html>

测试地址

example2:

    /*
*在做复杂项目的时候经常会因为重复定义变量导致莫名BUG,
*但是当你如果把如下代码var换成let来定义,你将会发现控制台会丢给你一个大大的变量
*已定义的错SyntaxError: Identifier 'a' has already been declared
*/
var a = 1;
var a = 2;
alert(a);

测试地址

example3

    /*
*当前想固定一个变量为不可变值时,以前是无法实现的
*但是现在通过const定义的常量如果你再去修改会在控制台报一大错
*/
const PI = 3.1415926;
PI = 'aaa';
alert(PI);

测试地址

粗看ES6之变量的更多相关文章

  1. 粗看ES6之JSON

    标签: es6 ES6新增JSON特性不是特别多,只是针对JSON某些情况下的写法上有一些优化: 当key值和value值对应变量名相同时 json对像中的方法书写 示例代码如下: <!DOCT ...

  2. 粗看ES6之字符串

    标签: javascript es6 字符串新增特性 新增二个方法 - startsWith/endsWith 字符串模板 - 反单引号的应用 startsWith 判断字符串以是否以某某开头,返回一 ...

  3. 粗看ES6之面向对象写法

    标签: es6 在es6以前,js没有类的概念,虽然有构造函数原型的方式用来做面向对向开发,但是对于书法并不是十分友好,而且对于继承实现也不是十分友好. es6引入class constructor ...

  4. 粗看ES6之数组

    标签: javascript es6 数组新增方法 map(可以理解为是映射,以一定规则修改数组每一项并返回全新数组) reduce(可以理解为是汇总,一堆出来一个) filter(可以理解为过滤,筛 ...

  5. 粗看ES6之解构赋值

    标签: javascript es6 什么是解构赋值? 示例如下: <!DOCTYPE html> <html> <head> <meta charset=& ...

  6. 粗看ES6之函数

    标签: es6 javascript 箭头函数 ES6为了书写方便引入了函数的全新简写方式-箭头函数 <!DOCTYPE html> <html> <head> & ...

  7. es6系列-变量声明

    es6系列所有文章都是阅读阮一峰老师的<ES6标准入门>(第2版)所做的读书笔记.方便日后查阅相关基础知识. git地址: https://github.com/rainnaZR/es6- ...

  8. ECMAScript 6 入门——ES6 声明变量的六种方法

    ES6 声明变量的六种方法 ES5 只有两种声明变量的方法:var命令和function命令.ES6 除了添加let和const命令,后面章节还会提到,另外两种声明变量的方法:import命令和cla ...

  9. 新手必看ES6基础

    ES6 基础 一.新的变量声明方式 let/const 与var不同,新的变量声明方式带来了一些不一样的特性,其中最重要的两个特性就是提供了块级作用域与不再具备变量提升. 通过2个简单的例子来说明这两 ...

随机推荐

  1. 【问题】Expandable数据集的定义的正确方法,TabActivity弃用替代,Gallery替代,imageswitcher

    Expandable 问题: http://www.cnblogs.com/xingyyy/p/3389611.html 扩展阅读:http://blog.csdn.net/lmj623565791/ ...

  2. (转)JAVA中的权限修饰符

    注:本博文是转载的,原文地址:http://blog.csdn.net/xk632172748/article/details/51755438 Java中修饰符总结: 访问控制修饰符 访问控制修饰符 ...

  3. 向PCD文件写入点云数据

    博客转载自:http://www.pclcn.org/study/shownews.php?lang=cn&id=83 本小节我们学习如何向PCD文件写入点云数据. 代码 章例2文件夹中,打开 ...

  4. 6.JBoss5.x6.x 反序列化漏洞(CVE-2017-12149)复现

    2017 年 9 月 14 日,国家信息安全漏洞共享平台( CNVD )收录了 JBOSS Application Server 反序列化命令执行漏洞( CNVD-2017-33724,对应 CVE- ...

  5. 3. 从零开始学CSRF

    为什么要拿CSRF来当“攻击手法系列”的开头篇呢?因为CSRF/XSRF我个人喜爱他的程度已经超过XSS了.如果说XSS是一个老虎,那么CSRF就是隐藏在暗处的蛇.‍‍‍‍‍‍ ‍‍相信现在很多人不明 ...

  6. C# -- 继承规则

    例子1--C#继承的常见问题: using System; using System.Collections.Generic; using System.Linq; using System.Text ...

  7. js或jQuery中 邮箱跳转的问题,跳转到指定邮箱(通过layui的ifram实现)

    对刚做的东西记个笔记 如果遇到同样问题解决起来又问题的欢迎留言 var emailtext = $("#TextBoxEmail").val();//获得要截取的值 var arr ...

  8. file控件选择图片,img即可显示(无需上传)

    代码如下: <script> $(function() { $("#Book_Fiel").change(function() { var $file = $(this ...

  9. superset 错误解决

    访问superset localhost:8088   securety->list Role 报错 xxxxxxxxxxxxxxxxxxxxxxx xxxxxxxxxxxxxxxxxxxxxx ...

  10. ERROR 1010 (HY000): Error dropping database (can't rmdir './nsd', errno: 39)

    在删除数据库的时候报标题所示错误 mysql> drop database test; ERROR 1010 (HY000): Error dropping database (can't rm ...