当前位置: 首页 > Web前端 > HTML

ES6相关

时间:2023-03-28 19:48:20 HTML

1。解构赋值解构赋值语法是一个Javascript表达式。通过解构赋值,可以从对象/数组中取出属性/值赋值给其他变量:const[name,{ball}]=["wang",{ball:45,study:75}];控制台日志(名字,球);//wang45以上方法解构除用户名和球外的分数;rest运算符解构对象的其余部分:let[name,...rest]=["wang",{ball:45,study:75}];控制台日志(名称,休息);展开运算符剥离出数组和对象,可用于浅拷贝:letwang=["wang",{ball:45,study:75}];让wangClone=[...wang];wang[0]="li";安慰。日志(wangClone,wang);//(2)['wang',{...}](2)['li',{...}]2.箭头函数箭头函数表达式的语法比函数表达式更简洁,并且没有自己的this、arguments、super或new.target。箭头函数表达式更适用于需要匿名函数的地方,它不能用作构造函数。//ES5varx=function(x,y){returnx*y;}//ES6constx=(x,y)=>x*y;如果只有一条语句,{}和return可以同时省略,需要注意的是也可以省略。3.PromisePromise构造函数主要用于包装不支持promise的函数(返回值不是Promise)。constpromise1=newPromise((resolve,reject)=>{setTimeout(()=>{resolve('foo');},300);});promise1.then((value)=>{console.log(value);//预期输出:"foo"});console.log(promise1);//预期输出:[objectPromise]利用Promise简单实现axiosfunctionmyAsyncFunction(url){returnnewPromise((resolve,reject)=>{constxhr=newXMLHttpRequest()xhr.open("GET",url)xhr.onload=()=>resolve(xhr.responseText)xhr.onerror=()=>reject(xhr.statusText)xhr.send()});}Promise.allconstpromise1=Promise.resolve(3);constpromise2=newPromise((resolve,reject)=>{setTimeout(resolve,200,'wo');});constpromise3=newPromise((resolve,reject)=>{setTimeout(resolve,100,'foo');});Promise.all([promise1,promise2,promise3]).then((values)=>{控制台.log(values);});//预期输出:Array[3,"wo","foo"]这个Promise的resolve回复执行是在所有输入的promiseresolve回调全部结束,或者当inputiterable中没有promise时,它??的reject回调被执行。只要执行了任何输入promise的reject回调或者输入不合法,都会立即抛出错误,被拒绝的是第一个抛出的错误信息。Promise.raceconstpromise1=newPromise((resolve,reject)=>{setTimeout(resolve,500,'one');});constpromise2=newPromise((resolve,reject)=>{setTimeout(resolve,100,'two');});Promise.race([promise1,promise2]).then((value)=>{console.log(value);//两者都解析,但promise2更快});//预期输出:“two”Promise.race(iterable)方法返回一个解析或拒绝的promise,一旦迭代器中的一个promise解析或拒绝。4.Proxy下面这个简单的例子,当属性名在对象中不存在时,默认返回值为37。下面的代码演示了gethandler的使用场景。//定义代理策略consthandler={get:function(obj,prop){returnpropinobj?对象[道具]:37;}};constp=newProxy({},handler);p.a=1;p.b=undefined;控制台日志(p.a,p.b);//1,undefinedconsole.log('c'inp,p.c);//假,37打印p对象: