ES7-Es8 js代码片段
es7-es8的新特性可参考: es7-es8
1 function noRun(){ 2 // es6的Generator函数异步 3 function* a(){ 4 yield console.log(1) 5 yield console.log(2) 6 } 7 var aa = a() 8 aa.next() 9 aa.next() 10 11 // es8的asyns/await异步 12 const timeout = async ms => { 13 await new Promise((resolve) => { 14 setTimeout(resolve, ms); 15 }); 16 } 17 18 async function asyncP(value, ms, ms2) { 19 // 顺序执行 20 await timeout(ms); 21 console.log(value); 22 await timeout(ms2); 23 console.log(ms2); 24 25 // 并行执行 26 await Promise.all([ 27 timeout(ms), 28 timeout(ms2) 29 ]); 30 } 31 asyncP('hello world', 5000, 3000); 32 33 34 /** 35 * ES7 求幂运算符** 36 * 在ES5中 == Math.pow(n,m) 37 */ 38 console.log(3**2) // 9 39 40 /** 41 * ES7 Array.prototype.includes(n, idx)方法 42 * n是要查找内容，idx是开始查找的下标 43 * ( 类似indexOf()方法 ) 44 */ 45 let arr = ['react', 'angular', 'vue']; 46 console.log(arr.includes('react')) // true 47 console.log(arr.includes('react', 1)) // false 48 49 /** 50 * ES8 Object 51 * ES8 Object.entries() 方法 52 * 将某个对象的可枚举属性与值按照二维数组的方式返回 53 * 如果对象的key值是数字，则返回值会对key值进行排序，返回的是排序后的结果 54 */ 55 Object.entries({ one: 1, two: 2 }) //[['one', 1], ['two', 2]] 56 Object.entries([1, 2]) //[['0', 1], ['1', 2]] 57 // key为数字 58 Object.entries({ 3: 'a', 4: 'b', 1: 'c' }) //[['1', 'c'], ['3', 'a'], ['4', 'b']] 59 // ES6解构方式结合运用 60 let obj = { one: 1, two: 2 }; 61 for (let [k,v] of Object.entries(obj)) { 62 console.log(`${k}: ${v}`); 63 } 64 65 /** 66 * ES8 Object 67 * ES8 Object.values() 方法 68 * 只返回自己的键值对中属性的值 69 * 顺序规则与Object.entries()一致 70 */ 71 Object.values({ one: 1, two: 2 }) //[1, 2] 72 Object.values({ 3: 'a', 4: 'b', 1: 'c' }) //['c', 'a', 'b'] 73 74 /** 75 * ES8 Object 76 * ES8 Object.getOwnPropertyDescriptors('参数', 可选-'属性') 方法 77 * 返回目标对象中所有属性的属性描述符，该属性必须是对象自己定义的，不能是从原型链继承来的 78 */ 79 let obj = { 80 id: 1, 81 name: 'test', 82 get gender() { 83 console.log('gender') 84 }, 85 set grade(g) { 86 console.log(g) 87 } 88 } 89 Object.getOwnPropertyDescriptors(obj, 'id') 90 //输出结果为： 91 // { 92 // id: { 93 // configurable: true, 94 // enumerable: true, 95 // value: 1, 96 // writable: true 97 // } 98 // } 99 100 101 /** 102 * ES8 String 103 * ES8 字符串填充：padStart(num, '')和padEnd(num, '') 104 * 函数通过填充字符串的首尾部来保证字符串达到固定的长度 105 */ 106 'JavaScript'.padStart(8, 'Hi') //'JavaScript' 107 'JavaScript'.padStart(10, 'Hi') //'JavaScript' 108 'JavaScript'.padStart(12, 'Hi') //'HiJavaScript' 109 'JavaScript'.padStart(13, 'Hi') //'HiHJavaScript' 110 'JavaScript'.padStart(12) //' JavaScript' 111 112 /** 113 * ES8 Function 114 * ES8 函数参数列表与调用中的尾部逗号 115 * 该特性允许我们在定义或者调用函数时添加尾部逗号而不报错。 116 */ 117 let foo = function (a,b,c,) { 118 console.log('a:', a) 119 console.log('b:', b) 120 console.log('c:', c) 121 } 122 foo(1, 3, 4, ) 123 }
