ECMAScript6入门学习笔记(一)

ECMAScript是Javascript语言的国际标准，JavaScript是ECMAScript的实现。

总结一些ECMAScript的特性

1、let和const命令

 let命令用于声明变量，用法和var类似，但是所声明的变量，只在let命令所在的代码块内有效，为JavaScript新增了块级作用域。

function f1() {
    let n = 5;
    if(true){
        let n = 10
    }
    console.log(n) //5
}

上面的函数有两个代码块，都声明了变量n，输出结果为5。外层代码块不受内层代码块的影响。

const用来声明常量，一旦声明，其值就不能改变。

const PI = 3.1415
PI //3.1415

重新给常量赋值，其值不会发生改变。const的作用域和let命令相同：只在声明所在的块级作用域内有效。

2、变量的结构赋值

ES6允许按照一定模式，从数组和对象中提取值，对变量进行赋值，这被成为解构。

var [a,b,c] = [1,2,3]

上面的代码表示，可以从数组中提取值，按照位置的对应关系，对变量赋值。

常见赋值方法，如果机构不成功，变量的值就等于undefined

var [foo,[[bar],baz]] = [1,[[2], 3]];
foo//1
bar//2
baz//3

var [,,third] = ["foo", "bar", "baz"]
third// "baz"

对undefined或null进行解构会报错，解构只能用于数组或对象，其他原始类型的值都可以转为对应的对象，但是，undefined和null不能转为对象，因此报错。

//报错
var [foo] = undefined
var [foo] = null

解构赋值允许指定默认值。解构赋值不仅适用于var命令，也适用于let和const命令。

var [foo=true] = []
foo//true

var [v1,v2,...,vN] = array;
let [v1,v2,...,vN] = array;
const [v1,v2,...,vN] = array;

解构不仅可以用于数组，还可以用于对象。

对象的解构与数组有一个重要的不同。数组的元素是按次序排列的，变量的取值由它的位置决定；而对象的属性没有次序，变量必须与属性同名，才能取到正确的值。

var {bar, foo} = {foo:"aaa", bar:"bbb"}
foo//aaa
bar//bbb

var {baz} = {foo:"aaa", bar:"bbb"}
baz//undefined

解构赋值用途：

• 变换变量的值

• [x, y] = [y, x]

  从函数返回多个值。函数只能返回一个值，如果要返回多个值，只能将它们放在数组或对象里返回。通过解构赋值，可以很方便的取出这些值。

• function example() {
      return [1,2,3]
  }
  var [a,b,c] = example();
  
  function example2() {
      return {foo: 1, bar: 2}
  }
  var {foo, bar} = example2()

  函数参数的定义

• function f({x,y,z)} {
  
  }
  
  f({x:1, y:2, z:3})

  函数参数的默认值

• 遍历map解构。任何部署了Iterator接口的对象，都可以用for...of循环遍历。Map解构原生支持Iterator接口，配合变量的结构赋值，获取键名和键值就非常方便。

• var map = new Map();
  map.set('first', 'hello');
  map.set('second', 'world');
  
  for(let [key, value] of map) {
      console.log(key +" is " + value)
  }
  //first is hello
  //second is world
  

  输入模块的指定方法。加载模块时，往往需要指定输入哪些方法。解构赋值使得输入语句非常清晰。

const { SourceMapConsumer, SourceNode} = require("source-map");