ES8

2022/4/23 15:39 Javascript 大约 4 分钟

ECMAScript 8(简称ES8)是于2017年6月正式发布的JavaScript语言的标准,正式名为ECMAScript 2017(ES2017)。

# async/await

异步终极解决方案,让处理异步程序更加方便,提高异步代码的可读性。

async表示函数里有异步操作,await表示紧跟在后面的表达式需要等待结果。

# 基本用法;

使用 Async/await 来简化获取 Promise 的结果 ;

async function main() {
    // 遇到await便会等待响应结果;
    const res = await Promise.resolve(1);
    // 请求出错或响应回来后继续往后执行
}
1
2
3
4
5

# 任何函数都可以使用async

//  具名函数
async function main() {};

// 匿名函数
const main = async function () {};
// 箭头函数
const main = async () => {};
// 对象成员函数简写
const obj = {
    async hello() {}
}
1
2
3
4
5
6
7
8
9
10
11

# 返回promise

async function main() {
    // async 函数始终返回 Promise
    // async 函数的返回值
    // 1. 如果是普通数据,则直接把它包装到 promise 对象中数据就是 resolve 的结果
    return 123

    // 如果你返回的直接就是一个 promise 对象,则不作任何处理
    // return new Promise((resolve) => {
    // setTimeout(() => {
    // resolve(123)
    // }, 2000)
    // })
}

// 通过 then 方法来获取 async 函数的返回值
// .then(data => {
// console.log(data)
// })
main()
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19

# 错误处理

async function main() {
    // 还是使用 .catch 来处理异常
    // const data = await request('dsanlksas')
    // .catch(err => {
    // console.log('请求失败了')
    // })
    // console.log(data)
    console.log(1)

    // 更推荐使用 try-catch 来捕获异常
    try {
        // try 捕获不到它的异常
        // request('dsabjdsdsa').then(data => {
        // console.log(data)
        // })
        console.log(2)

        const data = await request(
            'http://jsonplaceholder.typicode.com/posts'
        )
        console.log(3)
        const data2 = await request('dnsandlksa')
        console.log(4)
    } catch (err) {
        console.log('请求失败了', err)
    }

    console.log(5)
}

main()
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31

# Object.values()

Object.values()方法返回一个给定对象自身的所有可枚举属性值的数组,值的顺序与使用for...in循环的顺序相同 ( 区别在于 for-in 循环枚举原型链中的属性 )。

语法:

Object.values(obj)
1

参数:

  • obj:被返回可枚举属性值的对象。

返回值:一个包含对象自身的所有可枚举属性值的数组。

const obj = {
    name: '小明',
    age: 18,
}

const names = Object.values(obj);

console.log(names); // [ '小明', 18 ]
1
2
3
4
5
6
7
8

# Object.entries()

Object.entries()方法返回一个给定对象自身可枚举属性的键值对数组,其排列与使用 for...in 循环遍历该对象时返回的顺序一致(区别在于 for-in 循环还会枚举原型链中的属性)。

const object1 = {
    a: 'somestring',
    b: 42
};

const arr = Object.entries(object1);

console.log(arr); // [ [ 'a', 'somestring' ], [ 'b', 42 ] ]

for (const [key, value] of arr) {
    console.log(`${key}: ${value}`); // a: somestring、b: 42
}
1
2
3
4
5
6
7
8
9
10
11
12

# String padding

# String.prototype.padStart()

用于将另一个字符串填充当前字符串(如果需要的话,会重复多次),以便产生的字符串达到给定的长度。从当前字符串的左侧开始填充。

语法:

str.padStart(targetLength [, padString])
1

参数:

  • targetLength:当前字符串需要填充到的目标长度。如果这个数值小于当前字符串的长度,则返回当前字符串本身。
  • padString(可选):填充字符串。如果字符串太长,使填充后的字符串长度超过了目标长度,则只保留最左侧的部分,其他部分会被截断。此参数的默认值为 " "(U+0020)。

返回值:在原字符串开头填充指定的填充字符串直到目标长度所形成的新字符串。

console.log('abc'.padStart(10));         // "       abc"
console.log('abc'.padStart(10, "foo"));  // "foofoofabc"
console.log('abc'.padStart(6,"123465")); // "123abc"
console.log('abc'.padStart(8, "0"));     // "00000abc"
console.log('abc'.padStart(1));          // "abc"
1
2
3
4
5

# String.prototype.padStart()

用一个字符串填充当前字符串(如果需要的话则重复填充),返回填充后达到指定长度的字符串。从当前字符串的末尾(右侧)开始填充。

console.log('abc'.padEnd(10));          // "abc       "
console.log('abc'.padEnd(10, "foo"));   // "abcfoofoof"
console.log('abc'.padEnd(6, "123456")); // "abc123"
console.log('abc'.padEnd(1));           // "abc"
1
2
3
4

# 函数参数列表和调用中的尾部逗号

这是语法更改, 允许在参数定义和函数调用后面使用逗号。以前的版本中,函数中是不允许出现空逗号的

// 在 ECMAScript 2015(ES6) 中会导致语法错误,但现在 ECMAScript 2017(ES8) 是合法的:
function getDescription (name, age,) {}

getDescription(1, 2,)
1
2
3
4

# Object.getOwnPropertyDescriptors()

获取一个对象的所有自身属性的描述符。

语法:

Object.getOwnPropertyDescriptors(obj)
1

参数:

  • obj: 任意对象

返回值:所指定对象的所有自身属性的描述符,如果没有任何自身属性,则返回空对象。

var o, d;

o = { get foo() { return 17; }, bar: 123 };
d = Object.getOwnPropertyDescriptors(o);
console.log(d);

/*
{
  foo: {
    get: [Function: get foo],
    set: undefined,
    enumerable: true,
    configurable: true
  },
  bar: { value: 123, writable: true, enumerable: true, configurable: true }
}
 */
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17

# 共享内存和原子 (Shared memory and atomics)

根据规格 (opens new window)

"Shared memory is being exposed in the form of a new SharedArrayBuffer type; The new global Atomics object provides atomic operations on shared memory locations, including operations that can be used to create blocking synchronization primitives."
1
“共享内存以新的SharedArrayBuffer类型的形式公开;新的全局Atomics对象在共享内存位置上提供了原子操作,包括可用于创建阻塞同步原语的操作。”
1

想深入了解请阅读:SharedArrayBuffer and Atomics - Web 的多线程并发编程 (opens new window)

上次编辑于: 2023年7月4日 09:36