數(shù)組賦值

在ECMAScript6中數(shù)組的復(fù)制有兩種方法：

1. 采用Array.from

var arr = [1,2,3,4];
var arr2 = Array.from(arr);
console.log(arr2);

1. 采用...arr

var arr = [1,2,3,4];
var arr2 = [...arr];
console.log(arr);

箭頭函數(shù)

在ECMAScript6中我們有了一種新的定義函數(shù)的方法，那就是箭頭函數(shù)
1.首先我們來復(fù)習(xí)一下普通函數(shù)的寫法

var show = function(a,b){
  var c = a+b;
  return c;
}
alert(show(12,5));

2.我們用箭頭函數(shù)寫下同樣的代碼

var show = (a,b)=>{
  var c = a+b;
  return c;
}
alert(show(12,5));

箭頭函數(shù)是不是看起來更加的簡潔呢税手？

3.箭頭函數(shù)的縮寫

var show= (a)=>a+5;
alert(show(1));

這行代碼用箭頭函數(shù)的標(biāo)準(zhǔn)形式可以寫成

var show= (a)=>{
  return a+5
};
alert(show(1));

注意：箭頭函數(shù)的簡寫僅用在代碼中有一行代碼才能采用簡寫的方式

Map結(jié)構(gòu)

它類似于對象蜂筹，也是鍵值對的集合，但是“鍵”的范圍不限于字符串芦倒，各種類型的值都可以當(dāng)作鍵

//正常的寫法獲取鍵值對
var map = new Map();
map.set('a','蘋果');
map.set('b','香蕉');
map.set('c','西瓜');
for(var [key,value] of map.entries()){
  console.log(key,value);
}

//獲取key的寫法
var map = new Map();
map.set('a','蘋果');
map.set('b','香蕉');
map.set('c','西瓜');
for(var key of map.keys()){
  console.log(key);
}

//獲取value的寫法
var map = new Map();
map.set('a','蘋果');
map.set('b','香蕉');
map.set('c','西瓜');
for(var val of map.values()){
  console.log(val);
}

ES6的面向?qū)ο?/h3>

//傳統(tǒng)的面向?qū)ο?function Person(name,age){
    this.name = name;
    this.age = age;
}
Person.prototype.showName = function(){
    return this.name;
};
Person.prototype.showAge = function(){
    return this.age;
};
var p1 = new Person('xiaoming',18);
alert(p1.showAge());

//在ES6中的面向?qū)ο?class Person{
    constructor(name,age=18){
        this.name = name;
        this.age= age;
    }
    showName(){
        return this.name;
    }
    showAge(){
        return this.age;
    }
}
var p1 = new Person('xiaoming',18);
alert(p1.showAge());

ES6面向?qū)ο蟮睦^承

class Person{
    constructor(name,age){
        this.name = name;
        this.age= age;
    }
    showName(){
        return this.name;
    }
    showAge(){
        return this.age;
    }
}
class Worker extends Person{
    constructor(name,age,job){
        super(name,age);
        this.job = job;
    }
    showJob(){
        return this.job;
    }
}
var w1 = new Worker('json',22,'web開發(fā)工程師');
alert(w1.showJob());

這里我不得不提一下面向?qū)ο蟮倪@種繼承方式較傳統(tǒng)方式而言給我們帶來的更加簡潔的結(jié)構(gòu)艺挪，使我們能用更加簡單的方法實(shí)現(xiàn)繼承

模塊化

說到模塊化我們一定會想起我們常用的模塊化seajs和requirejs把，而我們的es6中有新的模塊化方法兵扬，不多說直接上代碼

定義模塊

import modA from 'a.js';

導(dǎo)出模塊

var a = 12;
export default a;

標(biāo)準(zhǔn)的使用方法

import sum from 'd.js';//導(dǎo)入所要依賴的模塊
alert(sum());

在模塊中導(dǎo)入所依賴的模塊

import modA from 'a.js';
import modB from 'b.js';
export default function () {
    return modA+modB;
};