鎴嚦鎾板啓鏈枃鏃讹紝鏈枃鎻愬埌鐨凧avaScript鎻愭鏂扮壒鎬у凡缁忚繘鍏ョ4闃舵锛屽嚑涔庤偗瀹氫細鍖呭惈鍦‥S2021涓€傛偍宸茬粡鍙互寮€濮嬩娇鐢ㄦ渶鏂扮増鏈殑娴忚鍣ㄣ€丯ode.js鍜孊abel銆傛敞鎰忥細ECMAScript鏄疛avaScript鎵€鍩轰簬鐨勬爣鍑嗭紝鐢盩C39濮斿憳浼氱鐞嗐€侲CMAScript鎬绘槸涓€涓笉闇€瑕佺殑鍚嶅瓧锛岃繖璁╁垵瀛﹁€呮劅鍒板洶鎯戙€備汉浠粡甯歌皥璁篔avaScript鐗规€э紝浣嗗弬鑰冪殑鏄疎CMAScript瑙勮寖銆傛洿鏂板姛鑳芥暟瀛楀垎闅旂(_)閫昏緫璧嬪€硷紙&&=銆亅|=銆??=锛夊紩鐢ㄤ笉瓒筹紙WeakRef鍜孎inalizationRegistry锛塒romise.anyString.prototype.replaceAll1銆傛暟瀛楀垎闅旂浜虹溂寰堥毦蹇€熻В鏋愬ぇ鏁板瓧鏂囧瓧锛屽挨鍏舵槸褰撴湁寰堝閲嶅鏁板瓧鏃讹細10000000000001019436871.42涓轰簡鎻愰珮鍙鎬э紝鏂扮殑JavaScript璇█鍔熻兘鍚敤涓嬪垝绾夸綔涓烘暟瀛楁枃瀛椾腑鐨勫垎闅旂銆傛墍浠ヤ笂闈㈢幇鍦ㄥ彲浠ユ敼鍐欎负鍗冨垎鐜囷紝渚嬪锛?_000_000_000_0001_019_436_871.42鐜板湪锛屾洿瀹规槗璇寸涓€涓暟瀛楁槸1涓囦嚎锛岀浜屼釜鏁板瓧澶х害鏄?0浜裤€傛暟瀛楀垎闅旂鏈夊姪浜庢彁楂樺悇绉嶆暟瀛楁枃瀛楃殑鍙鎬э細//涓€涓崄杩涘埗鏁存暟鏂囧瓧锛屽叾鏁板瓧鎸夊崈浣嶅垎缁勶細1_000_000_000_000//鍗佽繘鍒舵暣鏁版枃瀛楋紝鍏舵暟瀛楁寜鍗冧綅鍒嗙粍锛?_000_000.220_720//浜岃繘鍒舵暣鏁版枃瀛楋紝鍏朵綅鍒嗙粍peroctet:0b01010110_00111000//浜岃繘鍒舵暣鏁版枃瀛楋紝鍏朵綅鎸夊崐瀛楄妭鍒嗙粍锛?b0101_0110_0011_1000//鍗佸叚杩涘埗鏁存暟鏂囧瓧锛屽叾鏁板瓧鎸夊瓧鑺傚垎缁勶細0x40_76_38_6A_73//BigInt鏂囧瓧锛屽叾鏁板瓧鎸夊崈浣嶅垎缁勶細4_642_473_476864瀹冧滑鐢氳嚦閫傜敤浜巓ctnl_473_94364鏁存暟鏂囧瓧锛堝敖绠℃垜鎯充笉鍑哄垎闅旂涓烘绫绘枃瀛楁彁渚涘€肩殑绀轰緥锛夛細//鍏繘鍒舵暣鏁版枃瀛椾腑鐨勬暟瀛楀垎闅旂锛氿煠凤笍0o123_456璇锋敞鎰忥紝JavaScript杩樺叿鏈夊墠缂€涓哄叓杩涘埗鏂囧瓧鐨勬棫璇硶0o銆備緥濡傦紝017===0o17銆備弗鏍兼ā寮忔垨妯″潡鍐呬笉鏀寔姝よ娉曪紝涓嶅簲鍦ㄧ幇浠ｄ唬鐮佷腑浣跨敤銆傚洜姝わ紝杩欎簺鏂囧瓧涓嶆敮鎸佹暟瀛楀垎闅旂銆傝鏀圭敤0o17鏍峰紡鏂囧瓧銆?.Promise缁勫悎鍣ㄨ嚜ES2015寮曞叆Promise浠ユ潵锛孞avaScript鍏ㄩ潰鏀寔涓ょPromise缁勫悎鍣細闈欐€佹柟娉昉romise.all鍜孭romise.race銆傜洰鍓嶆湁涓や釜鏂版彁妗堟鍦ㄩ€氳繃鏍囧噯鍖栨祦绋嬶細Promise.allSettled鍜孭romise.any銆傞€氳繃杩欎簺娣诲姞锛孞avaScript涓皢鎬诲叡鏈夊洓涓猵romise缁勫悎鍣紝姣忎釜缁勫悎鍣ㄦ敮鎸佷笉鍚岀殑鐢ㄤ緥銆備互涓嬫槸鍥涗釜缁勫悎鍣ㄧ殑姒傝堪锛?.1Promise.allSettledPromise.allSettled鍦ㄦ墍鏈変紶鍏ョ殑鎵胯閮藉凡缁撶畻鏃跺悜鎮ㄥ彂鍑轰俊鍙凤紝杩欐剰鍛崇潃瀹冧滑瑕佷箞琚饱琛岋紝瑕佷箞琚嫆缁濄€傚鏋滄偍涓嶅叧蹇冩壙璇虹殑鐘舵€侊紝鑰屽彧鎯崇煡閬撳伐浣滀綍鏃跺畬鎴愶紝鏄惁鎴愬姛锛岃繖灏嗗緢鏈夌敤銆備緥濡傦紝鎮ㄥ彲浠ュ惎鍔ㄤ竴绯诲垪鐙珛鐨凙PI璋冪敤骞朵娇鐢≒romise.allSettled鏉ョ‘淇濆畠浠湪鎵ц鍏朵粬鎿嶄綔锛堜緥濡傚垹闄ゅ姞杞藉井璋冨櫒锛変箣鍓嶅叏閮ㄥ畬鎴愶細constpromises=[fetch('/api-call-1'),fetch('/api-call-2'),fetch('/api-call-3'),];//鎯宠薄涓€涓嬭繖浜涜姹傛湁鐨勫け璐ヤ簡锛屾湁鐨勬垚鍔熶簡銆俛waitPromise.allSettled(promises);//鎵€鏈堿PI璋冪敤閮藉凡瀹屾垚锛堝け璐ユ垨鎴愬姛锛夈€俽emoveLoadingIndicator();2.2Promise.anyPromise.any鏂规硶绫讳技浜嶱romise.race鈥斺€斿彧瑕佺粰瀹氳凯浠ｄ腑鏈変竴涓猵romise鎴愬姛锛岀涓€涓猵romise灏变娇鐢╲alue浣滀负瀹冪殑杩斿洖鍊硷紝浣嗘槸鍜孭romise.race涓嶅悓鐨勬槸瀹冧細涓€鐩寸瓑鍒版墍鏈夌殑promise鍦ㄨ繑鍥炲け璐ュ€间箣鍓嶅け璐ワ細constpromises=[fetch('/endpoint-a').then(()=>'a'),fetch('/endpoint-b').then(()=>'b'),fetch('/endpoint-c').then(()=>'c'),];try{constfirst=awaitPromise.any(promises);//浠讳綍鎵胯閮藉凡鍏戠幇銆傛帶鍒跺彴鏃ュ織锛堢涓€锛夛紱//鈫掍緥濡?b'}catch(error){//鎵€鏈夌殑鎵胯閮借鎷掔粷浜嗐€俢onsole.assert(errorinstanceofAggregateError);//璁板綍鎷掔粷鍊硷細console.log(error.errors);//鈫抂//<绫诲瀷閿欒锛欶ailedtofetch/endpoint-a>,//,////]}姝や唬鐮佺ず渚嬫鏌ュ摢涓鐐瑰搷搴旀渶蹇紝鐒跺悗瀹冭璁板綍涓嬫潵锛屽彧鏈夊綋鎵€鏈夎姹傞兘澶辫触鏃讹紝鎴戜滑鎵嶄細鍦ㄤ唬鐮佺殑catch鍧椾腑缁撴潫锛岀劧鍚庢垜浠湪鍏朵腑澶勭悊閿欒銆侾romise.any鎷掔粷鍙互鍚屾椂琛ㄧず澶氫釜閿欒銆備负浜嗗湪璇█绾у埆鏀寔杩欎竴鐐癸紝寮曞叆浜嗕竴绉嶇О涓篈ggregateError鐨勬柊閿欒绫诲瀷銆傞櫎浜嗕笂闈㈢ず渚嬩腑鐨勫熀鏈敤娉曞锛岃繕鍙互閫氳繃缂栫▼鏂瑰紡鏋勯€燗ggregateError瀵硅薄锛屽氨鍍忓叾浠栭敊璇被鍨嬩竴鏍凤細constaggregateError=newAggregateError([errorA,errorB,errorC],'Stuffwentwrong!');3.寮卞紩鐢ㄥ拰缁堢粨鍣ㄨ繖涓嚱鏁板寘鍚袱涓珮绾у璞eakRef鍜孎inalizationRegistry銆傛牴鎹敤渚嬶紝杩欎簺鎺ュ彛鍙互鍗曠嫭浣跨敤鎴栦竴璧蜂娇鐢ㄣ€傛纭娇鐢ㄥ畠浠渶瑕佷粩缁嗚€冭檻锛屾渶濂藉敖鍙兘閬垮厤浣跨敤瀹冧滑銆備竴鑸潵璇达紝鍦↗avaScript涓紝瀵硅薄鐨勫紩鐢ㄦ槸寮轰繚鐣欑殑锛岃繖鎰忓懗鐫€鍙瀵硅薄鐨勫紩鐢ㄨ淇濈暀锛屽畠灏变笉浼氳鍨冨溇鍥炴敹銆俢onstref={x:42,y:51};//鍙鎴戜滑璁块棶ref瀵硅薄锛堟垨浠讳綍鍏朵粬鎸囧悜杩欎釜瀵硅薄鐨勫紩鐢級锛岃繖涓璞″氨涓嶄細琚瀮鍦惧洖鏀剁洰鍓嶅湪Javascript涓紝WeakMap鍜學eakSet鏄急鐨勫紩鐢ㄥ璞″敮涓€鐨勬柟娉曪細灏嗗璞′綔涓洪敭娣诲姞鍒癢eakMap鎴朩eakSet涓嶄細闃绘瀹冭鍨冨溇鏀堕泦銆侸avaScript鐨刉eakMap骞朵笉鏄湡姝ｇ殑寮卞紩鐢細鍙閿繕瀛樺湪锛屽畠瀹為檯涓婂氨鎸佹湁瀵瑰叾鍐呭鐨勫己寮曠敤銆傚彧鏈夊湪閿鍨冨溇鍥炴敹鍚庯紝WeakMap鎵嶄細寮卞紩鐢ㄥ叾鍐呭銆俉eakRef鏄竴涓洿楂樼骇鍒殑API锛屾彁渚涚湡姝ｇ殑寮卞紩鐢紝Weakref瀹炰緥鏈変竴涓柟娉昫eref杩斿洖琚紩鐢ㄧ殑鍘熷瀵硅薄锛屽鏋滃師濮嬪璞″凡琚敹闆嗭紝鍒欎负undefined銆侸avaScript涓殑瀵硅薄寮曠敤鏄己寮曠敤銆俉eakMap鍜學eakSet鍙互鎻愪緵閮ㄥ垎寮卞紩鐢ㄥ姛鑳姐€傚鏋滀綘鎯冲湪JavaScript涓疄鐜扮湡姝ｇ殑寮卞紩鐢紝浣犲彲浠ヤ娇鐢╓ea鈥嬧€媖Ref鍜岀粓缁撳櫒锛團inalizer锛変竴璧锋潵瀹炵幇銆俉eakRef鐢ㄤ簬寮曠敤鐩爣瀵硅薄鏈皢鍏朵繚鐣欏湪鍨冨溇鏀堕泦涔嬪鐨勫璞°€傚鏋滅洰鏍囧璞℃湭琚瀮鍦惧洖鏀讹紝鍒欏彲浠ュ彇娑堝紩鐢╓ea鈥嬧€媖Refs浠ュ厑璁歌闂洰鏍囧璞°€?/鍒涘缓寮曠敤缁欏畾鐩爣瀵硅薄鐨刉eakRef瀵硅薄constref=newWeakRef(targetObject)//杩斿洖WeakRef瀹炰緥鐨勭洰鏍囧璞★紝濡傛灉鐩爣瀵硅薄宸茶鍨冨溇鏀堕泦锛屽垯杩斿洖undefinedconstobj=ref.deref()FinalizationRegistry瀵硅薄鍙互鍦ㄥ璞¤鍨冨溇鍥炴敹鏃惰姹傚洖璋冦€?/鍒涘缓涓€涓娇鐢ㄧ粰瀹氬洖璋冪殑娉ㄥ唽琛ㄥ璞onstregistry=newFinalizationRegistry([callback])//鐢ㄦ敞鍐岃〃瀹炰緥娉ㄥ唽涓€涓璞★紝杩欐牱濡傛灉瀵硅薄琚瀮鍦炬敹闆嗭紝娉ㄥ唽琛ㄧ殑鍥炶皟鍙兘浼氳璋冪敤registry.register(target,heldValue,[unregisterToken])//浠庢敞鍐岃〃涓敞閿€鐩爣瀵硅薄instanceregistry.unregister(unregisterToken)鏇村淇℃伅锛歍C39鎻愭锛孷84銆係tring.prototype.replaceAll鐩墠锛屾病鏈夊姙娉曞湪涓嶄娇鐢ㄥ叏灞€姝ｅ垯琛ㄨ揪寮忕殑鎯呭喌涓嬫浛鎹竴涓瓧绗︿覆涓瓙瀛楃涓茬殑鎵€鏈夊疄渚嬨€傚綋涓庡瓧绗︿覆鍙傛暟涓€璧蜂娇鐢ㄦ椂锛孲tring.prototype.replace浠呭奖鍝嶇涓€娆″嚭鐜般€係tring.prototype.replaceAll()灏嗕负寮€鍙戜汉鍛樻彁渚涗竴绉嶇畝鍗曠殑鏂规硶鏉ュ畬鎴愯繖绉嶅父瑙佺殑鍩烘湰鎿嶄綔銆?aabbcc'.replaceAll('b','.')//'aa..cc''aabbcc'.replaceAll(/b/g,'.')//'aa..cc'5.閫昏緫璧嬪€硷紙logicalassignment锛夋敮鎸佹柊鐨勮繍绠楅€昏緫璧嬪€?&=銆亅|=鍜??=銆備笌瀹冧滑鐨勬暟瀛﹀拰鎸変綅瀵瑰簲鐗╀笉鍚岋紝閫昏緫璧嬪€奸伒寰畠浠悇鑷€昏緫杩愮畻鐨勭煭璺涓恒€傚畠浠粎鍦ㄩ€昏緫杩愮畻灏嗚瘎浼板彸渚ф椂鎵嶆墽琛屽垎閰嶃€?/falsy:false,0,-0,0n,"",null,undefined,andNaN//truthy:鎵€鏈夊€奸兘鏄湡鍊硷紝闄ら潪瀹氫箟涓篺alsy//nullish:nullorundefineda||=b//閫昏緫OR璧嬪€?/绛変环浜庯細涓€涓獆|(a=b);//浠呭綋a涓哄亣鏃舵墠璧嬪€?&=b//閫昏緫涓庤祴鍊?/绛変环浜庯細a&&(a=b);//浠呭綋a涓虹湡鏃舵墠璧嬪€??=b//閫昏緫鏃犳晥璧嬪€?/绛変环浜庯細涓€涓??(a=b);//Onlyassignsifaisnullish5.1鍏蜂綋渚嬪瓙閫昏緫璧嬪€艰繍绠楃鍜?&杩愮畻绗﹀彧鏈夊綋LHS鍊间负鐪熸椂锛孯HS鍙橀噺鐨勫€兼墠璧嬬粰LHS鍙橀噺銆?/甯?&operatorlet鐨勯€昏緫璧嬪€艰繍绠楃num1=5letnum2=10num1&&=num2console.log(num1)//10//绗?琛屼篃鍙互杩欐牱鍐?/1.num1&&(num1=num2)//2.if(num1)num1=num2甯︽湁||鐨勮繍绠楃閫昏緫璧嬪€艰繍绠楃浠呭綋LHS鍊间负false鏃舵墠灏哛HS鍙橀噺鍊艰祴缁橪HS鍙橀噺銆?/甯|鐨勯€昏緫璧嬪€艰繍绠楃operatorletnum1letnum2=10num1||=num2console.log(num1)//10//绗?琛屼篃鍙互杩欐牱鍐?/1.num1||(num1=num2)//2.if(!num1)num1=num2甯??鐨勯€昏緫璧嬪€艰繍绠楃operatorES2020寮曞叆浜嗙┖鍚堝苟杩愮畻绗︼紝瀹冧篃鍙互涓庤祴鍊艰繍绠楃缁撳悎浣跨敤銆備粎褰揕HS鏈畾涔夋垨鍙槸null鏃讹紝鎵嶅皢RHS鍙橀噺鍊煎垎閰嶇粰LHS鍙橀噺銆?/甯??鐨勯€昏緫璧嬪€艰繍绠楃operatorletnum1letnum2=10num1??=num2console.log(num1)//10num1=falsenum1??=num2console.log(num1)//false//绗?琛屼篃鍙互杩欐牱鍐?/num1??(num1=num2)鎬荤粨浣滀负寮€鍙戜汉鍛橈紝璺熶笂璇█鐨勬柊鐗规€ф槸寰堥噸瑕佺殑銆備笂杩颁竴浜涘皢浜?021骞村彂甯冪殑鏂板姛鑳斤紝鍗宠繘鍏ョ4闃舵鐨勬彁妗堬紝鍑犱箮鑲畾浼氳鍖呮嫭鍦ㄥ唴锛屽凡缁忓湪鏈€鏂扮殑娴忚鍣ㄥ拰babel涓疄鐜般€傛杩庡叧娉ㄥ叕浼楀彿锛氥€婂叏鏍堝疄鎴樸€嬶紝鍥炲鈥滅數瀛愪功鈥濊幏鍙?60鏈墠绔簿鍗庝功绫嶃€傚弬鑰冩枃绔狅細JavaScriptFeaturesin2021PastEssayVue3鍏ㄥ妗?ElementPlus+Vite+TypeScript+Eslint椤圭洰閰嶇疆鏈€浣冲疄璺礣ypeScript鎻愬崌骞哥鎰熺殑10涓繘闃舵妧宸ф帹鑽?Vue2銆乂ue3閲嶅害寮€婧愭簮鐮佽В瀵嗕笌鍒嗘瀽鐪嬪畬杩欑瘒鏂囩珷锛屾湁鏀惰幏鍙互鐐硅禐鍜岃鐪嬨€傝繖浼氭垚涓烘垜缁х画鍒嗕韩鐨勫姩鍔涳紝璋㈣阿~
