Es6

ECMAScript 6.0，简称ES6，第一个版本是在2015年6月进行发布，所以也称之为《ECMAScript 2015 标准》（简称 ES2015）。

JavaScript是ECMAScript的一种实现（分支），遵循ECMAScript标准的。目前主流浏览器已经可以完美兼容和使用ES6。ES7/8部分新特性也已经被用于我们的实际开发中。

变量

变量的作用域

全局变量

{
    number=10;
}
//不再同一个语句块里也可以访问到numb
console.log(number);

//使用var关键字声明的变量
{
    var fu=8;
}
//可以访问到fu变量
console.log(fu);
//在if语句中声明var关键字的变量
if(true){
    var i=7;
}
//可以访问到i变量
console.log(i);

//在函数中声明var关键字的变量
function fun(){
    var j=9;
}
//控制台会报错，找不到j变量
console.log(j);

不带任何关键字声明的变量都是全局变量。不再函数中用var关键字声明的变量都是全局变量

箭头函数语法

{
    //声明一个箭头函数赋值给fun
    let fun=(a,b)=>{
    return a+b;
    }
    //调用fun并在在控制台输出
    console.log(fun(1,2));

}

ps：当参数只有一个时，小括号可以省略。当只有一个return语句时，大括号可以省略

简化箭头函数

{
    //隐式return，默认返回a*2；
    let fun=a=>a*2;
    console.log(fun(1));
}

默认参数

{
    //默认参数
    //声明函数，3个形参，后两个有默认值
    let fun=(a,b=2,c=3)=>a+b+c;
    //调用函数时，可以只传一个参数
    var show=fun(1);
    console.log(show);
}

在调用fun()时，也可以不输入任何参数，控制台会输出NaN

必填参数

{
    function ex(){
        throw new("至少要输入一个参数");
    }
    let fun=(x=ex(),y=1,z=2)=>x+y+z;
    //不传入任何参数
    var show=fun();
    //此时控制台会报异常
    console.log(show);
}

可变参数

{
    //以计算任意数和为例
    let sum=0;
    function fun(...arry){
        arry.forEach(item=>{
            return sum+=item;
        })
    }
    //传入三个数字便可以计算出其和
    fun(1,2,3);
    console.log(sum);
}

ES6中字符串的新功能

{
    var str="www.baidu.com";
    //str.startsWith("");判断是否是指定字符串开头
    if(str.startsWith("www")){
        console.log("www开头");
    }
    //str.endsWith("");判断是否以制定字符串结尾
    if(str.endsWith(".com")){
        console.log(".com结尾");
    }
}

字符串模板

  {
      var name="zhong";
      var age=19;
      //`${变量名}`，相当于起到C#中占位符作用
console.log(`姓名：${name}，年龄：${age}`)；
  }

数组合并

   var arry1=[1,2,3];
   var arry2=[5,6,7];
   //将arry1和arry2合并成为一个新的数组
var newarry=[...arry1,...arry2];
console.log(newarry);

数组遍历

var arry=[1,2,5,6,3];
//遍历数组的下标
for(var inex of arry.keys()){
    console.log(index);
}
//遍历数组的值
for(var val of arry){
    console.log(val);
}
//遍历数组的值和下标
for(var [inde,elems] in arry.entries()){
    console.log(inde,elems);
}

ES6新增创建对象的方法

ES6新增了一个class关键字，引入了类的概念

class Student{
    //构造方法
    constructor(name,age){
        this.name=name;
        this.age=age;
    }

    show(){
        console.log(this.name,this.age);
    }
}
//实例化Student类
var stu=new Student("stu1",18);
//调用show方法
stu.show();

js面向对象之继承

class可以用extends关键字实现继承（类似于java）

class Student{
    //构造方法
    constructor(name,age){
        this.name=name;
        this.age=age;
    }

    show(){
        return `${this.name} ${this.age}`;
    }
}

class BoyStu extends  Student{
    constructor(name,age,able){
        super(name,age);//调用父类的构造方法
        this.able=able;
    }

    showBoy(){
        return `${this.show()},${this.able}`;
    }
}

var boy=new BoyStu("zhong",18,"打游戏")；
console.log(boy.showBoy());