ES6是什么，為什么要學習它，不學習ES6會怎么樣?
答：ES6是新一代的JS語言標準，對分JS語言核心內容做了升級優化，規范了JS使用標準，新增了JS原生方法，使得JS使用更加規范，更加優雅，更適合大型應用的開發。
學習ES6是成為專業前端正規軍的必經之路。不學習ES6也可以寫代碼打鬼子，但是最多只能當個游擊隊長。
ES5、ES6和ES2015有什么區別?
答：ES2015特指在2015年發布的新一代JS語言標準，
ES6泛指下一代JS語言標準，包含ES2015、ES2016、ES2017、ES2018等。現階段在絕大部分場景下，ES2015默認等同ES6。
ES5泛指上一代語言標準。ES2015可以理解為ES5和ES6的時間分界線。
babel是什么，有什么作用?
答：babel是一個 ES6 轉碼器，可以將 ES6 代碼轉為 ES5 代碼，以便兼容那些還沒支持ES6的平臺。
let有什么用，有了var為什么還要用let？
答：在ES6之前，聲明變量只能用var，var方式聲明變量其實是很不合理的，準確的說，是因為ES5里面沒有塊級作用域是很不合理的，甚至可以說是一個語言層面的bug(這也是很多c++、JAVA開發人員看不懂，也瞧不起JS語言的劣勢之一)。
沒有塊級作用域回來帶很多難以理解的問題，比如for循環var變量泄露，變量覆蓋等問題。
let 聲明的變量擁有自己的塊級作用域，且修復了var聲明變量帶來的變量提升問題。
問：舉一些ES6對String字符串類型做的常用升級優化?
答：
優化部分：
ES6新增了字符串模板，在拼接大段字符串時，用反斜杠(`)取代以往的字符串相加的形式，能保留所有空格和換行，使得字符串拼接看起來更加直觀，更加優雅。
升級部分:
ES6在String原型上新增了includes()方法，用于取代傳統的只能用indexOf查找包含字符的方法(indexOf返回-1表示沒查到不如includes方法返回false更明確，語義更清晰),
此外還新增了startsWith(), endsWith(), padStart(),padEnd(),repeat()等方法，可方便的用于查找，補全字符串。
舉一些ES6對Array數組類型做的常用升級優化?
答：
優化部分：
數組解構賦值：ES6可以直接以let [a,b,c] = [1,2,3]形式進行變量賦值，在聲明較多變量時，不用再寫很多let(var),且映射關系清晰，且支持賦默認值。
擴展運算符：ES6新增的擴展運算符(...)(重要),可以輕松的實現數組和松散序列的相互轉化，可以取代arguments對象和Apply方法，輕松獲取未知參數個數情況下的參數集合。
（尤其是在ES5中，arguments并不是一個真正的數組，而是一個類數組的對象，但是擴展運算符的逆運算卻可以返回一個真正的數組）。
擴展運算符還可以輕松方便的實現數組的復制和解構賦值（let a = [2,3,4]; let b = [...a]）。
升級部分:
ES6在Array原型上新增了find()方法，用于取代傳統的只能用indexOf查找包含數組項目的方法,且修復了indexOf查找不到NaN的bug([NaN].indexOf(NaN) === -1)，
此外還新增了copyWithin(), includes(), fill(),flat()等方法，可方便的用于字符串的查找，補全,轉換等。
據一些ES6對Number數字類型做的常用升級優化?
答：
優化部分：
ES6在Number原型上新增了isFinite(), isNaN()方法，用來取代傳統的全局isFinite(), isNaN()方法檢測數值是否有限、是否是NaN。
ES5的isFinite(), isNaN()方法都會先將非數值類型的參數轉化為Number類型再做判斷，這其實是不合理的，最造成isNaN('NaN') === true的奇怪行為--'NaN'是一個字符串，但是isNaN卻說這就是NaN。
而Number.isFinite()和Number.isNaN()則不會有此類問題(Number.isNaN('NaN') === false)。（isFinite()同上）
升級部分:
ES6在Math對象上新增了Math.cbrt()，trunc()，hypot()等等較多的科學計數法運算方法，可以更加全面的進行立方根、求和立方根等等科學計算。
舉一些ES6對Object類型做的常用升級優化?(重要)
答：
優化部分：
1.對象屬性變量式聲明：ES6可以直接以變量形式聲明對象屬性或者方法，比傳統的鍵值對形式聲明更加簡潔，更加方便，語義更加清晰。
let [apple, orange] = ['red appe', 'yellow orange'];
let myFruits = {apple, orange}; // let myFruits = {apple: 'red appe', orange: 'yellow orange'};
尤其在對象解構賦值(見優化部分2.)或者模塊輸出變量時，這種寫法的好處體現的最為明顯:
let {keys, values, entries} = Object;
let MyOwnMethods = {keys, values, entries}; // let MyOwnMethods = {keys: keys, values: values, entries: entries}
可以看到屬性變量式聲明屬性看起來更加簡潔明了。方法也可以采用簡潔寫法：
let es5Fun = {
method: function(){}
}; let es6Fun = {
method(){}}
2.對象的解構賦值：ES6對象也可以像數組解構賦值那樣，進行變量的解構賦值：
let {apple, orange} = {apple: 'red appe', orange: 'yellow orange'};
3.對象的擴展運算符(...)：ES6對象的擴展運算符和數組擴展運算符用法本質上差別不大，畢竟數組也就是特殊的對象。
對象的擴展運算符一個最常用也最好用的用處就在于可以輕松的取出一個目標對象內部全部或者部分的可遍歷屬性，從而進行對象的合并和分解。
let {apple, orange, ...otherFruits} = {apple: 'red apple', orange: 'yellow orange', grape: 'purple grape', peach: 'sweet peach'};
// otherFruits {grape: 'purple grape', peach: 'sweet peach'}
// 注意: 對象的擴展運算符用在解構賦值時，擴展運算符只能用在最有一個參數(otherFruits后面不能再跟其他參數)let moreFruits = {watermelon: 'nice watermelon'};
let allFruits = {apple, orange, ...otherFruits, ...moreFruits};
4.super 關鍵字：ES6在Class類里新增了類似this的關鍵字super。同this總是指向當前函數所在的對象不同，super關鍵字總是指向當前函數所在對象的原型對象。
升級部分:
1.ES6在Object原型上新增了is()方法，做兩個目標對象的相等比較，用來完善'==='方法。'==='方法中NaN === NaN //false其實是不合理的，Object.is修復了這個小bug。(Object.is(NaN, NaN) // true)
2.ES6在Object原型上新增了assign()方法，用于對象新增屬性或者多個對象合并。
const target = { a: 1 };
const source1 = { b: 2 };
const source2 = { c: 3 };
Object.assign(target, source1, source2);
target // {a:1, b:2, c:3}
注意:
assign合并的對象target只能合并source1、source2中的自身屬性，
并不會合并source1、source2中的繼承屬性，也不會合并不可枚舉的屬性，且無法正確復制get和set屬性（會直接執行get/set函數，取return的值）。
3.ES6在Object原型上新增了getOwnPropertyDescriptors()方法，此方法增強了ES5中getOwnPropertyDescriptor()方法，可以獲取指定對象所有自身屬性的描述對象。
結合defineProperties()方法，可以完美復制對象，包括復制get和set屬性。
4.ES6在Object原型上新增了getPrototypeOf()和setPrototypeOf()方法，用來獲取或設置當前對象的prototype對象。
這個方法存在的意義在于，ES5中獲取設置prototype對象是通過__proto__屬性來實現的，
然而__proto__屬性并不是ES規范中的明文規定的屬性，只是瀏覽器各大廠商“私自”加上去的屬性，只不過因為適用范圍廣而被默認使用了，在非瀏覽器環境中并不一定就可以使用，
所以為了穩妥起見，獲取或設置當前對象的prototype對象時，都應該采用ES6新增的標準用法。
5.ES6在Object原型上還新增了Object.keys()，Object.values()，Object.entries()方法，用來獲取對象的所有鍵、所有值和所有鍵值對數組。
舉一些ES6對Function函數類型做的常用升級優化?(重要)
答：
1.箭頭函數(核心)：箭頭函數是ES6核心的升級項之一，箭頭函數里沒有自己的this,這改變了以往JS函數中最讓人難以理解的this運行機制。
主要優化點:
箭頭函數內的this指向的是函數定義時所在的對象，而不是函數執行時所在的對象。
ES5函數里的this總是指向函數執行時所在的對象，這使得在很多情況下this的指向變得很難理解，尤其是非嚴格模式情況下，this有時候會指向全局對象，這甚至也可以歸結為語言層面的bug之一。
ES6的箭頭函數優化了這一點，它的內部沒有自己的this,這也就導致了this總是指向上一層的this，如果上一層還是箭頭函數，則繼續向上指，直到指向到有自己this的函數為止，并作為自己的this；
箭頭函數不能用作構造函數，因為它沒有自己的this，無法實例化；
也是因為箭頭函數沒有自己的this,所以箭頭函數 內也不存在arguments對象。（可以用擴展運算符代替）
2.函數默認賦值：ES6之前，函數的形參是無法給默認值的，只能在函數內部通過變通方法實現。ES6以更簡潔更明確的方式進行函數默認賦值。
function es6Fuc (x, y = 'default') {
console.log(x, y);
}es6Fuc(4) // 4, default
升級部分:
ES6新增了雙冒號運算符，用來取代以往的bind，call,和apply。(瀏覽器暫不支持，Babel已經支持轉碼)
foo::bar;
// 等同于
bar.bind(foo);foo::bar(...arguments);// 等同于
bar.apply(foo, arguments);
喜歡的老鐵，加個關注！今后會分享更多的前端干貨，歡迎點贊轉發關注
作者丨StevenLikeWatermelon
https://juejin.im/post/5c061ed2f265da61357258ee
