拥抱ES6 (一)

let和const

let,const和var一样，都可用来声明变量。但let,const声明的变量在提升过程中不会像var那样进行初始化赋值undefined。
此外，let,const所声明的变量存在块级作用域和暂时性死区，能减少全局变量的污染。
值得注意的是，let和const定义的变量在使用前必须先声明，否则报错。
而对于const来说，定义常量这种说法更为确切，且值定义后无法改变(引用类型除外–内容可变，但引用不变)

example-01-块级作用域

    {
        var a=1;
        let b=2;
    }
    console.log(a);//1
    console.log(b);//报错  b is not defined

• 为了更好的理解块级作用域，请看下边这两段代码

   var arr = [];

   for (var i = 0; i < 3; i++) {
       arr[i] = function () {
          console.log(i);
      };
    }
    console.log(arr[0]()); // 3
    console.log(arr[1]()); // 3
    console.log(arr[2]()); // 3

• 这里不会预期输出0，1，2，是因为用var声明的变量没有块级作用域，i在循环外也有效。
• 等执行完，仅仅只有全局有一个i,这个i此时已经是3。
• 把上边var定义的i换成let定义试试看

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

• 这就是块级作用域的体现，此时在循环外访问i是访问不到的。每次循环i都各自保存自己的值，所以输出符合预期。

example–02-不初始化赋值

    // var 的情况

    console.log(a); // undefined

    var a= 1;

    // let 的情况

    console.log(b); // 报错 b is not defined

    let b= 2;

     // const 的情况

     // const声明一个只读的常量,不可变。

        const c=1;

   //报错 Assignment to constant variable.

        c=2;

  //const定义的常量必须初始化赋值

       const d;

// SyntaxError: Missing initializer in const declaration 

       console.log(d)

解构赋值

ES6 允许按照一定模式，从数组和对象中提取值，对变量进行赋值，这被称为解构（Destructuring）。注意模式匹配，只要等号两边的模式相同，左边的变量就会被赋予对应的值。如果解构不成功，变量的值就等于undefined。

example–03-数组的解构赋值

//快速为变量赋值
var [a, b, c] = [1, 2, 3];
console.log(a);//1
console.log(b);//2
console.log(c);//3

//注意模式匹配
var [a, [[b], c]] = [1, [[2], 3]];
console.log(a)// 1
console.log(b)// 2
console.log(c)// 3

// 可以只获取自己想要的
var[ , , c] = ["a", "b", "c"];
console.log(c) // c

var [x, , z] = [1, 2, 3];
console.log(x)// 1
console.log(z)// 3
example-04-字符串的解构赋值

const [a, b] = '高芊';
console.log(a)  // 高
console.log(b)  // 芊
example-05-函数的解构赋值

function add([x, y]){
  return x + y;
}

add([1, 2]); // 3

…语法

对于数组和对象而言，…运算符超级好用，可将参数列表或对象属性一一拆解，也可重新拼凑。值得注意的是:对象的解构与数组有一个重要的不同。数组的元素是按次序排列的，变量的取值由它的位置决定；而对象的属性没有次序，变量必须与属性同名，才能取到正确的值。

example–06-…语法

//一一拆解后拼凑
var obj={name:"高芊",like:"编程"}
var selfObj={...obj}//相当于拷贝
console.log(selfObj)//{name:"高芊",like:"编程"} 

//一一拆解
var { a, b} = { a: "aaa", b: "bbb" };
console.log(a) // aaa
console.log(b) // bbb


//此时的b实际时剩余项组成的数组

var [a, ...b] = [1, 2, 3, 4];
console.log(a) // 1
console.log(b) // [2, 3, 4]
example-07-复杂对象解构

注意，此时p是一种模式，不是变量，故不会被赋值

var obj = {
  p: [
    'Hello',
    { b: 'World' }
  ]
};

var { p: [a, { b }] } = obj;
console.log(a) // "Hello"
console.log(b) // "World"

• 如果p也要作为变量赋值，可以写成下面这样。

var obj = {
  p: [
    'Hello',
    { b: 'World' }
  ]
};

var { p,p: [a, { b }] } = obj;
console.log(a) // "Hello"
console.log(b) // "World"
console.log(p) // ['Hello', { b: 'World' } ]

下面代码有4次解构赋值，分别是对loc、start、line、column四个属性的解构赋值。注意，最后一次对line，column属性的解构赋值之中，只有line，column是变量，loc和start都是模式，不是变量。

var  node = {
  loc: {
    start: {
      line: 1,
      column: 5
    }
  }
};

var { loc, loc: { start }, loc: { start: { line,column }} } = node;

console.log(line)  // 1
console.log(column)  // 5
console.log(start)  //  {line: 1, column: 5}
console.log(loc)  //{start: {line: 1, column: 5}}

字符串方法扩展

• es5只有indexOf方法，可以用来确定一个字符串是否包含在另一个字符串中。
• ES6 又提供了三种新方法:includes,* startsWith,endsWith。
• 此外，还有两个常用于数据处理的padStart,padEnd
• includes()：返回布尔值，判断是否找到了参数字符串。
• startsWith()：返回布尔值，判断参数字符串是否在原字符串的头部。
• endsWith()：返回布尔值，判断参数字符串是否在原字符串的尾部。
• padStart()：前补位 param1:最大长度; param2:未达到最大长度情况下补充的内容
• padEnd()：后补位 param1:最大长度; param2:未达到最大长度情况下补充的内容

example-08-字符串扩展方法

 var s = 'Hello world!';
 console.log(s.startsWith('Hello')) // true
 console.log(s.endsWith('!')) // true
 console.log(s.includes('o')) // true

时间处理

function dateFormat(date=new Date()) {
    let y = date.getFullYear().toString();
    let m = (date.getMonth() + 1).toString().padStart(2,'0');
    let d = date.getDate().toString().padStart(2,'0');
    let h = date.getHours().toString().padStart(2,'0');
    let M = date.getMinutes().toString().padStart(2,'0');
    let s = date.getSeconds().toString().padStart(2,'0');
    return y  + m + d + " " +h + ":" + M + ":" +s;
}
console.log(dateFormat())
//20191208 12:39:38   注意日期:08   前置补了一个0