你的位置:首页 > Java教程

[Java教程]ES6新特性:let和const的使用


  (声明, 本文的所有代码均在node的最新稳定版本v4.4.3中执行的, 如果在浏览器中执行请把JS的运行环境提升为ES6)

  以前一直用var定义变量, 现在有了两种新的定义变量的方式, 1: let, 2: const;本文大概概括下使用letconst定义变量有哪些好处;

  let:

    1:声明提前

  使用var声明变量,存在声明提前的问题, 输出的tmp为"undefined":

{  var tmp = new Date();  let f = function (){    console.log(tmp); //undefined    if (false){      //使用var声明变量的声明提前;      var tmp = "hello world";    }  }  f();}

  如果我们把定义tmp的方式改为let呢? 那么tmp输出的结果为当前的日期。

{  var tmp = new Date();  let f = () => {    console.log(tmp); //输出的结果为当前的日期    if (false){      //使用let的方式声明, tmp的作用域只有在离他最近的一个{}括号中;      let tmp = "hello world";    }  }  f();}

    2:块状作用域

  letconst不但拥有块状作用域, 还也不存在声明提前这个玩意儿, 以下代码会报ReferenceError

{  let tmp = 123;  {    tmp = 234;    let tmp = 456;  }}

 

  使用let声明的元素作用域更加明确, 不会出现作用域混乱的情况, 可以减少bug的产生;

{  let foo = 0;  {    let foo = 1;    foo = 2;  }  console.log(foo);}

  以上这段代码相当于是IIFE(立即执行函数表达式), 效果和以下的相同;

{  var foo = 0;  (function(){    var foo = 1;    foo = 2;  }());  console.log(foo);}

  再来猜猜这个的结果是什么,( var 形式声明的变量会提升到{}外面去哦 , {}形式的块状作用域相当于是if(true){//code}的写法):

{  var foo = 0;  {    var foo = 1;    foo = 2;  }  console.log(foo);}

View Code

    3:重复声明

  使用let声明的变量不能重复声明,否则会出现一下错误:

SyntaxError: Identifier 'a' has already been declared

 

 

  注意: 在全局下用let声明变量和用var声明变量还是有区别的:

<!DOCTYPE html><html><head>  <title></title>  <meta charset="utf-8"/></head><body><script>  "use strict";  let foo = 1;  console.log(window.foo); //输出 undefined  var bar = 1;  console.log(window.bar); //输出1</script></body></html>

 

  const:

  使用const定义的常量, 而且定义一次以后不能再进行更改, 否者会报错;

  使用const定义的常量, 拥有let一样的特性(无声明提前有块状作用域, 重复声明);

  但是要注意, 如果给常量定义的是对象,只要该对象指向在内存中的地址不发生改变, 数据可以随便改的(这涉及到计算机的传值和传址);

  对象:

{  const foo = {};  foo.bar = 1111;  console.log(foo.bar);}

  数组:

{  const foo = [];  foo.push(1);  foo.push(2);  console.log(JSON.stringify(foo));}

 

  这些新语法让JS更加规范, 也更加适合大项目, 我仿佛猜到以后要用private和public声明变量了....( ╯□╰ )

  参考:

  阮一峰:http://es6.ruanyifeng.com/#docs/let

  https://github.com/DrkSephy/es6-cheatsheet#var-versus-let--const

作者: NONO
出处:http://www.cnblogs.com/diligenceday/
QQ:287101329
微信:18101055830