ES8 或者說(shuō)是 ES2017 已經(jīng)在今年6月底的時(shí)候被 TC39 正式發(fā)布。
字符串填充
在 String 對(duì)象中筷厘,ES8 增加了兩個(gè)新的函數(shù): padStart 和 padEnd 咽块。正如其名氯庆,這倆函數(shù)的作用就是在字符串的頭部和尾部增加新的字符串裁良,并且返回一個(gè)具有指定長(zhǎng)度的新的字符串。你可以使用指定的字符腾夯、字符串或者使用函數(shù)提供的默認(rèn)值-空格來(lái)填充源字符串颊埃。具體的函數(shù)申明如下:
str.padStart(targetLength [, padString])
str.padEnd(targetLength [, padString])
正如你所看到的,這倆函數(shù)的第一個(gè)參數(shù)(必輸)是 targetLength 蝶俱,這個(gè)參數(shù)指的是設(shè)定這倆函數(shù)最后返回的字符串的長(zhǎng)度班利。第二個(gè)參數(shù) padString 是可選參數(shù),代表你想要填充的內(nèi)容榨呆,默認(rèn)值是空格罗标。具體代碼示例如下:
'es8'.padStart(2); // 'es8'
'es8'.padStart(5); // ' es8'
'es8'.padStart(6, 'woof'); // 'wooes8'
'es8'.padStart(14, 'wow'); // 'wowwowwowwoes8'
'es8'.padStart(7, '0'); // '0000es8'
'es8'.padEnd(2); // 'es8'
'es8'.padEnd(5); // 'es8 '
'es8'.padEnd(6, 'woof'); // 'es8woo'
'es8'.padEnd(14, 'wow'); // 'es8wowwowwowwo'
'es8'.padEnd(7, '6'); // 'es86666'
目前瀏覽器的支持情況如下(信息來(lái)自 MDN ):
values和entries函數(shù)
在 Object 中,ES8 也新增了兩個(gè)新的函數(shù)愕提,分別是 Object.values 函數(shù)和 Object.entries 函數(shù)馒稍。Object.values 函數(shù)將會(huì)返回一個(gè)數(shù)組皿哨,該數(shù)組的內(nèi)容是函數(shù)參數(shù)(一個(gè)對(duì)象)可遍歷屬性的屬性值浅侨。數(shù)組中得到的屬性值的順序與你在對(duì)參數(shù)對(duì)象使用 for in 語(yǔ)句時(shí)獲取到的屬性值的順序一致。函數(shù)聲明如下:
const obj = { x: 'xxx', y: 1 };
Object.values(obj); // ['xxx', 1]
const obj = ['e', 's', '8']; // same as { 0: 'e', 1: 's', 2: '8' };
Object.values(obj); // ['e', 's', '8']
// when we use numeric keys, the values returned in a numerical
// order according to the keys
const obj = { 10: 'xxx', 1: 'yyy', 3: 'zzz' };
Object.values(obj); // ['yyy', 'zzz', 'xxx']
Object.values('es8'); // ['e', 's', '8']
目前瀏覽器對(duì)于 Object.values 函數(shù)的支持情況如下(信息來(lái)自 MDN ):
介紹完 Object.values 函數(shù)证膨,接下來(lái)繼續(xù)介紹 Object.entries 函數(shù)如输。 Object.entries 函數(shù)與 Object.values 函數(shù)類似,也是返回一個(gè)數(shù)組,只不過(guò)這個(gè)數(shù)組是一個(gè)以源對(duì)象(參數(shù))的可枚舉屬性的鍵值對(duì)為數(shù)組 [key, value] 的 n 行 2 列的數(shù)組不见。它的返回順序與 Object.values 函數(shù)類似澳化。它的函數(shù)聲明如下:
const obj = { x: 'xxx', y: 1 };
Object.entries(obj); // [['x', 'xxx'], ['y', 1]]
const obj = ['e', 's', '8'];
Object.entries(obj); // [['0', 'e'], ['1', 's'], ['2', '8']]
const obj = { 10: 'xxx', 1: 'yyy', 3: 'zzz' };
Object.entries(obj); // [['1', 'yyy'], ['3', 'zzz'], ['10': 'xxx']]
Object.entries('es8'); // [['0', 'e'], ['1', 's'], ['2', '8']]
目前瀏覽器對(duì)于 Object.entries 函數(shù)的支持情況如下(信息來(lái)自 MDN ):
getOwnPropertyDescriptors函數(shù)
Object 中還有一個(gè)新成員,那就是 Object.getOwnPropertyDescriptors 函數(shù)稳吮。該函數(shù)返回指定對(duì)象(參數(shù))的所有自身屬性描述符缎谷。所謂自身屬性描述符就是在對(duì)象自身內(nèi)定義,不是通過(guò)原型鏈繼承來(lái)的屬性灶似。函數(shù)聲明如下:
const obj = {
get es7() { return 777; },
get es8() { return 888; }
};
Object.getOwnPropertyDescriptor(obj);
// {
// es7: {
// configurable: true,
// enumerable: true,
// get: function es7(){}, //the getter function
// set: undefined
// },
// es8: {
// configurable: true,
// enumerable: true,
// get: function es8(){}, //the getter function
// set: undefined
// }
// }
結(jié)尾逗號(hào)
此處結(jié)尾逗號(hào)指的是在函數(shù)參數(shù)列表中最后一個(gè)參數(shù)之后的逗號(hào)以及函數(shù)調(diào)用時(shí)最后一個(gè)參數(shù)之后的逗號(hào)列林。ES8 允許在函數(shù)定義或者函數(shù)調(diào)用時(shí),最后一個(gè)參數(shù)之后存在一個(gè)結(jié)尾逗號(hào)而不報(bào) SyntaxError 的錯(cuò)誤酪惭。示例代碼如下:
function es8(var1, var2, var3,) {
// ...
}
es8(10, 20, 30,);
異步函數(shù)
由 async 關(guān)鍵字定義的函數(shù)聲明定義了一個(gè)可以異步執(zhí)行的函數(shù)希痴,它返回一個(gè) AsyncFunction 類型的對(duì)象。異步函數(shù)的內(nèi)在運(yùn)行機(jī)制和 Generator 函數(shù)非常類似春感,但是不能轉(zhuǎn)化為 Generator 函數(shù)砌创。
function fetchTextByPromise() {
return new Promise(resolve => {
setTimeout(() => {
resolve("es8");
}, 2000);
});
}
async function sayHello() {
const externalFetchedText = await fetchTextByPromise();
console.log(`Hello, ${externalFetchedText}`); // Hello, es8
}
sayHello();