ES6学习笔记一

不说废话直接开始：

1：let与const命令

以前js变量命名大家就知道var，有很多的限制，比如变量提升，变量作用域不固定。。。ES6新增了 let变量命令，与var相似但是也有不同：

1：变量会不会提升；

2：块级作用域（{}，for（））；

3：暂时性死区；

4：不能重复申明；

解析：

1：变量不会提升，在ES5中变量申明会有提升，基变量申明会提升到最前，但是ES6 let申明的变量不会发生变量提升的问题

    // var 的情况
    console.log(foo); // 输出undefined
    var foo = 2;

    // let 的情况
    console.log(bar); // 报错ReferenceError
    let bar = 2;

2：块级作用域

在ES5中没有块级作用域的说法，变量申明完了之后会发生一些不可知的情况，比如：

1、内部变量会覆盖全局变量

    var tmp = new Date();
    function f() {
      console.log(tmp);
      if (false) {
        var tmp = 'hello world';
      }
    }
    f(); // undefined

上面的代码，全局变量就会被内部变量所替换，这有的时候并不是大家想看到的；

2、for循环中的计数变量会泄露，变为全局变量；如果在多层循环嵌套中会发生不可肆意的问题；

    var s = 'hello';
    for (var i = 0; i < s.length; i++) {
      console.log(s[i]);
    }
    console.log(i); // 5

因此ES6中提出的会计作用域还是很有必要记得，及变量只作用与申明的代码块中，也就是我们常说的{}，再就是for（）

{
  let a = 10;
  var b = 1;
}
a // ReferenceError: a is not defined.
b // 1

var a = [];
for (var i = 0; i < 10; i++) {
  a[i] = function () {
    console.log(i);
  };
}
a[6](); // 10

var a = [];
for (let i = 0; i < 10; i++) {
  a[i] = function () {
    console.log(i);
  };
}
a[6](); // 6

上面的代码看着没什么区别但是结果却是大大的不同，这局势块作用域的作用，

在for（）中还有一个特别之处，及设置技术变量的为父作用域，{}中的为子作用域，可以在子作用域中设置变量，不会影响父作用域的变量变化

for (let i = 0; i < 3; i++) {
  let i = 'abc';
  console.log(i);
}
// abc
// abc
// abc

但是如果用var，结果就.......

3：暂时性死区

暂时性死区也是ES6中新提出来的，即在变量申明的块内，变量不会收外部的影响，变量也不能提前使用

var tmp = 123;

if (true) {
  tmp = 'abc'; // ReferenceError
  let tmp;
}

上述代码中，先申明一个全局变量tmp，在if代码块中也申明了tmp，但是在申明前赋值了，这样是会报错的，需谨记：如果用了let申明变量，一定要在申明完之后使用；

还有比如：

function bar(x = y, y = 2) {
  return [x, y];
}

bar(); // 报错

也是暂时性死区的问题，参数x=y，但是在赋值之前y没有被申明，所以会报错；

4：不能重复申明

在ES5中，用var申明变量，没有限制，即可以重复多次申明同一个变量（当然这样感觉有点...）；但是在ES6中let申明的变量是不容许多次申明的；

// 报错
function func() {
  let a = 10;
  var a = 1;
}

// 报错
function func() {
  let a = 10;
  let a = 1;
}

而且不允许申明的变量和函数的参数名称重复

function func(arg) {
  let arg; // 报错
}

function func(arg) {
  {
    let arg; // 不报错
  }

const：通常用来申明一些常量（即申明之后不能“改变”）

const PI = 3.1415;
PI // 3.1415

PI = 3;
// TypeError: Assignment to constant variable

const与let有相同的地方就是块级作用域，不可重复申明

注意：const申明的并不是不可以修改，只是说变量指向的内存地址不能改变，比如

const foo = {};

// 为 foo 添加一个属性，可以成功
foo.prop = 123;
foo.prop // 123

// 将 foo 指向另一个对象，就会报错
foo = {}; // TypeError: "foo" is read-only

因此这点需要注意！

猜你喜欢