es6

對象的計算屬性名
之前對象的屬性是不容許動態修改的，es6支持屬性賦值，如：
之前：
let obj1= {
    name: '熊二', 
    age: 18,
    sec: '女'
};


如今能夠：
let nameStr = 'name';
let ageStr = 'age';
let obj1 = {
    [nameStr]: '熊二',
    [`${ageStr}`]: 18,
    ['sec']: '女'
}
console.log(obj1)   // {     name: '熊二',      age: 18,     sec: '女' };


Object.assign(target,source) 對象合併
Object.assign方法用於對象的合併，將源對象（source）的全部可枚舉屬性，複製到目標對象（target）。第一個參數是目標對象，後面的參數都是源對象。
注意，若是目標對象與源對象有同名屬性，或多個源對象有同名屬性，則後面的屬性會覆蓋前面的屬性。
var target = { a: 1, b: 1 };
var source1 = { b: 2, c: 2 };
var source2 = { c: 3 };

Object.assign(target, source1, source2);
target // {a:1, b:2, c:3}
Object.assign方法實行的是淺拷貝，而不是深拷貝。也就是說，若是源對象某個屬性的值是對象，那麼目標對象拷貝獲得的是這個對象的引用。
var obj1 = {a: {b: 1}};
var obj2 = Object.assign({}, obj1);

obj1.a.b = 2;
obj2.a.b // 2
上面代碼中，源對象obj1的a屬性的值是一個對象，Object.assign拷貝獲得的是這個對象的引用。這個對象的任何變化，都會反映到目標對象上面。
Object.assign 應用
（3）克隆對象
function clone(origin) {
  return Object.assign({}, origin);
}
上面代碼將原始對象拷貝到一個空對象，就獲得了原始對象的克隆。
不過，採用這種方法克隆，只能克隆原始對象自身的值，不能克隆它繼承的值。若是想要保持繼承鏈，能夠採用下面的代碼。
function clone(origin) {
  let originProto = Object.getPrototypeOf(origin);
  return Object.assign(Object.create(originProto), origin);
}
（4）合併多個對象
     將多個對象合併到某個對象。
const merge =
  (target, ...sources) => Object.assign(target, ...sources);
若是但願合併後返回一個新對象，能夠改寫上面函數，對一個空對象合併。
const merge =
  (...sources) => Object.assign({}, ...sources);


函數的參數默認值：
funtion ( a = ' $ ' ) {   }      
在形參位置能夠傳默認值，意思爲：不穿參數默認使用 a = ' $ ' 

forEach和map的區別
let arr = [
    {
        id:1,
        name:'小一'
    },
    {
        id:2,
        name:'小二'
    },
    {
        id:3,
        name:'小三'
    }
]
let newArr1 = arr.filter((item)=>{
    return item.id ===1;
})
console.log(newArr1) // [{id:1,name:'小一'}]
let newArr0 = arr.filter((item)=>{
    return item.id;
})
console.log('filter', newArr0) // [{id:1,name:'小一'},{id:2,name:'小二'},{id:3,name:'小三'}]

let newArr2 = arr.map((item)=>{
 return item.id;
})
console.log(newArr2)// [1,2,3]

共同點：都是返回一個新的數組
Map
Map是一組鍵值對的結構，具備極快的查找速度。具備如下方法：
let m = new Map();
 m.set('xiaoming',{name:'小明',age:16});
 m.set('xiaohuang',{name:'小黃',age:18});
 m.get('xiaoming')     //{name:'小明',age:16}
 m.has('xiaohuang')    //true
 m.delete('xiaoming');
 m.has('xiaoming')     //true

應用：

//獲取xiaomhuang對應的成績
let nameArr = ['xiaoming', 'xiaolan', 'xiaohaung']
let numberArr = [80, 90, 76]
numberArr.forEach((numberItem) => {
    nameArr.forEach((itemName, itemNameIndex) => {
        if(itemName === 'xiaohaung') {
            numberArr[itemNameIndex] // 76
        };
    })
})

//使用Map
let m = new Map([
    ['xiaoming', 80],
    ['xiaolan', 90],
    ['xioahuang', 76]
]);
m.get('xioahuang') // 76

 

Set
let s = new Set();
 console.log('初始',s) //{}
 s.add(1);
 console.log(s) // {1}
 s.add('1') 
 console.log(s) // {1,'1'}
 s.add(1);
 console.log(s) // {1,'1'}
 s.delete('1') 
 console.log(s) // {1}
 
 let arr = [1,2,3,1];
 let newSet = new Set(arr);
 console.log('去重',newSet );

proxy（代理對象）
es5中，咱們可使用 Object.defineProperty和Object.defineProperty來實現對對象的監聽。
Proxy 代理的做用，好處是將 條件 和 對象 隔離開，利於後期代碼維護


let obj = {
    name: "猿跑跑",
    age: 28
}

let p = new Proxy(obj, {
    get: function(target, key) {   // 獲取的攔截函數(獲取時執行)
        if(key in target) {
            console.log(target[key])
        } else {
            console.log("對象沒有此屬性");
        }
    },
    set: function(target, key, value) {   //設置的攔截函數(值設置時執行)
        target[key] = value;
        console.log("設置成功,值爲：",target[key]);
    },
    has: function (target,key) { // 是否存在某個屬性
        if (key in target) { // 判斷obj對象中是否存在key屬性
            console.log('存在');
        } else {
            console.log('不存在');
        };
    }
});

p.age = 22;    // 設置
p.age; // 22
p.height;  // 對象沒有此屬性
'age' in p; // 存在
'weight' in p; // 不存在


1、filterfilter 是`過濾`的意思，因此這個方法的做用就是返回一個匹配過濾條件的新數組，
let arr = ['a','b','a','c'];
let newArr = arr.fillter((item)=>{
    return item === 'a';
})
console.log(newArr) //['a','a']

場景：數組去重、取交集 
var a = [1, 2, 3, 4] 
var b = [3, 4, 5, 6] 
let intersection = a.filter(v => b.includes(v)) 
let difference = a.concat(b).filter(v => !a.includes(v) || !b.includes(v)) 
console.log('交集', intersection) 
console.log('去重', difference)


求數組的最小值
var arr = [23, 45, 40, 30, 12];
var iMin = Math.min(...arr);
console.log(iMin);

文件導出：
    //  es5的導出
    module.exports = 'bmw7';

    //  es6的導出（帶默認接口）
    export default {
       str:'bmw6'
    }

文件導入：
    //  es5導入模塊
    var modeA = require('./mod/a.js');

    //  es6導入模塊
    import modeA from './mod/a.js'

模塊化
es6:
若是：導出爲
     export default  obj
那麼：引入爲
     import modeA from './mod/a.js'

若是：導出爲
     export const str = aaa
那麼：引入爲
     import { str } from './mod/a.js'

const getDate = () => {
    let d = new Date();
    return d.getFullYear() + '-' + (d.getMonth() + 1) + '-' + d.getDate();
};

export { getDate };


module.js導出:
a.js導入:
這二者的區別是，export {<變量>}導出的是一個變量的引用，export default導出的是一個值
什麼意思呢，就是說在a.js中使用import導入這2個變量的後，在module.js中由於某些緣由x變量被改變了，那麼會馬上反映到a.js，而module.js中的y變量改變後，a.js中的y仍是原來的值
連接：https://juejin.im/post/5c6234f16fb9a049a81fcca5

箭頭函數的簡寫：
函數： 有大括號並有返回值時。this指向建立它的做用域，而咱們一般說的運行環境。

（a）=>{
   return  'b'
}
es6可寫成 :
      a => 'b'


複製（延展）數組：（只能複製一層，不能複製嵌套不少層 ，不能深度 複製）
ver  arr  =  [ 'a'  ,  'b'  ]
...arr     ===    'a'  ,  'b'            將arr數據拿出來
[ ...arr ]    ===   複製數組 （將arr數據拿出來,放到一個新的數組）


對象的延展
let obj1 = {
    name: '李四',
    age: 6
}
let obj2 = {
    ...obj1,
    height: 160
}
console.log('擴展後', obj2);