绉嶈崏ECMAScript2021鏂扮壒鎬?/a>

Posted 绔ユ宸?,

tags:

篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了绉嶈崏ECMAScript2021鏂扮壒鎬?/a>相关的知识，希望对你有一定的参考价值。

瑙傛劅搴︼細馃専馃専馃専馃専馃専

鍙ｅ懗锛氳禌铻冭煿

鐑归オ鏃堕棿锛?min

鏈枃宸叉敹褰曞湪鍓嶇椋熷爞鍚屽悕浠撳簱Github github.com/Geekhyt锛屾杩庡厜涓撮鍫傦紝濡傛灉瑙夊緱閰掕彍杩樼畻鍙彛锛岃祻涓?Star 瀵归鍫傝€佹澘鏉ヨ鏄帿澶х殑榧撳姳銆?/blockquote>

ECMAScript

ECMAScript 鏄?Ecma International 棰佸竷鐨勪竴閮ㄨ瑷€鏍囧噯锛岀紪鍙蜂负 262锛屽張绉颁负 ECMA-262銆?/p>

Ecma International 鍒欐槸涓€涓埗瀹氫俊鎭拰閫氳鎶€鏈柟闈㈢殑鍥介檯鏍囧噯鐨勭粍缁囷紝鍓嶈韩鏄娲茶绠楁満鍒堕€犲晢鍗忎細(European Computer Manufacturers Association)锛岄殢鐫€璁＄畻鏈虹殑鍥介檯鍖栵紝鏈烘瀯鍚嶇О鏀逛负鍏惰嫳鏂囧崟璇嶉瀛楁瘝缂╁啓銆?/p>

ECMAScript 鐢?EMCA International 鐨?TC39锛?code>Technical Committee 39锛夋妧鏈鍛樹細缂栧啓銆?/p>

TC39 浼氬皢缂栧啓瀹屾垚鐨?ECMAScript 鏍囧噯鏂囨。鎻愪氦缁?Ecma International锛屽苟鐢卞叾姝ｅ紡鍙戝竷銆?/p>

浠?2015 骞村紑濮嬶紝ECMAScript 姣忓勾閮戒細鍙戝竷涓€涓寮忕増锛屽苟鍦ㄦ爣棰樹腑鍐欎笂骞翠唤锛屾瘮濡?code>銆孍CMAScript庐 2020 Language Specification, 11th edition銆?/code>锛屽彲绠€绉颁负ES2020鎴?code>ES11銆?/p>

浜斾釜娴佺▼闃舵

濡傛灉鎯宠鏂板鎴栨槸鏀瑰啓瑙勮寖锛屼竴鑸缁忓巻5涓樁娈碉紝濡?a href="https://link.segmentfault.com/?url=https%3A%2F%2Ftc39.es%2Fprocess-document%2F" rel="nofollow">TC39 Process涓墍绀猴細

  • Strawperson
  • Proposal
  • Draft
  • Candidate
  • Finished

缁忓巻杩囪繖5涓樁娈碉紝杩涘叆 Finished 鐘舵€佺殑淇敼鎵嶄細琚垪鍏ユ寮忕増鐨勮鑼冦€?/p>

ECMAScript2021

https://github.com/tc39/proposals/blob/master/finished-proposals.md

浜嗚В浜?ECMAScript锛屼笅闈㈠氨杩涘叆姝ｆ枃锛岃鎴戜滑鏉ョ湅鐪嬪凡缁忕‘瀹氱殑 ECMAScript2021 鐨勬柊鐗规€у惂銆?/p>

1.String.prototype.replaceAll

https://github.com/tc39/proposal-string-replaceall

鍏堟潵鍥為【涓?String.prototype.replace 鐨勭敤娉曪細

const str = \'Stay Hungry. Stay Foolish.\'
const newStr = str.replace(\'Stay\', \'Always\')
console.log(newStr) // Always Hungry. Stay Foolish.

濡傛灉鎴戜滑杩欐牱鍐欙紝鍙湁绗竴涓尮閰嶇殑浼氳鏇挎崲銆?/p>

鎯宠鍋氬埌鍏ㄩ儴鏇挎崲灏遍渶瑕佷娇鐢ㄦ鍒欒〃杈惧紡銆?/p>

const str = \'Stay Hungry. Stay Foolish.\'
const newStr = str.replace(/Stay/g, \'Always\')
console.log(newStr) // Always Hungry. Always Foolish.

涓嶈繃鍦ㄤ娇鐢ㄦ鍒欑殑鏃跺€欙紝濡傛灉闇€姹傛槸鍖归厤 + 绛夌鍙锋椂锛岃繕闇€瑕佽繘琛岃浆涔夈€傚锛?/p>

/\\+/g

鑱槑鐨勪綘涔熻浼氭兂鍒板彟澶栦竴绉嶆柟妗堬細浣跨敤 split + join 鐨勬柟寮?/p>

杩欓噷鍊熺敤涓嬪畼鏂圭殑渚嬪瓙锛?/p>

const queryString = \'q=query+string+parameters\';
const withSpaces = queryString.split(\'+\').join(\' \');
// q=query string parameters

浣嗚繖鏍峰仛涔熸槸鏈夋€ц兘寮€閿€鐨勶紝鍔犱笂杩欑鎿嶄綔鍗佸垎甯歌銆備簬鏄氨璇炵敓浜?String.prototype.replaceAll 杩欎釜 API锛屾垜浠彲浠ユ洿鍔犳柟渚跨殑鏉ヨ繘琛屾搷浣溿€?/p>

const str = \'Stay Hungry. Stay Foolish.\'
const newStr = str.replaceAll(\'Stay\', \'Always\')
console.log(newStr) // Always Hungry. Always Foolish.
String.prototype.replaceAll(searchValue, replaceValue)

娉ㄦ剰锛氬綋 searchValue 鏄潪鍏ㄥ眬姝ｅ垯琛ㄨ揪寮忔椂锛?code>replaceAll 浼氬紩鍙戝紓甯搞€傚鏋?searchValue 鏄叏灞€姝ｅ垯琛ㄨ揪寮忔椂锛?code>replaceAll 涓?replace 琛屼负鏄竴鑷寸殑銆?/p>

2.Promise.any

https://github.com/tc39/proposal-promise-any

const p = Promise.all([p1, p2, p3]);
  • Promise.all (ES2015) 鍙湁褰撲紶鍏ョ殑姣忎釜 Promise 瀹炰緥(p1,p2,p3)鐨勭姸鎬侀兘鍙樻垚 fulfilled 鏃讹紝p 鎵?fulfilled锛屽彧瑕?p1,p2,p3)鏈変竴涓 rejected锛宲 鐨勭姸鎬佸氨鍙樻垚 rejected銆?/li>
  • Promise.race (ES2015) 褰撲紶鍏ョ殑 Promise 瀹炰緥(p1,p2,p3)涓湁涓€涓巼鍏堟敼鍙樼姸鎬侊紝閭ｄ箞 p 鐨勭姸鎬佸氨璺熺潃鏀瑰彉锛屼篃灏辨槸璇磋繑鍥炴渶鍏堟敼鍙樼殑 Promise 瀹炰緥鐨勮繑鍥炲€笺€?/li>
  • Promise.allSettled (ES2020) 鍙湁绛夊埌鎵€鏈変紶鍏ョ殑 Promise 瀹炰緥(p1,p2,p3)閮借繑鍥炵粨鏋滐紝涓嶇鏄?fulfilled 杩樻槸 rejected锛屽寘瑁呭疄渚嬫墠浼氱粨鏉熴€?/li>
  • Promise.any (ES2021) 褰撳叾涓换浣曚竴涓?Promise 瀹屾垚(fulfilled)鏃讹紝灏辫繑鍥為偅涓凡缁忔湁瀹屾垚鍊肩殑 Promise銆傚鏋滄墍鏈夌殑 Promise 閮芥嫆缁?(rejected), 閭ｄ箞杩斿洖涓€涓嫆缁濈殑 Promise銆?/li>

瀵规瘮璁板繂

  • 鎴戜滑鍙互鎶?Promise.any() 鐞嗚В鎴?Promise.all() 鐨勫弽鍚戞搷浣溿€?/li>

鑷存暚闊︾锛?/strong>

  • Promise.any() 璺?Promise.race() 鏂规硶寰堝儚锛屾湁涓€涓笉鍚岀偣鏄細鍓嶈€呬笉浼氬洜涓烘煇涓?Promise 鍙樻垚 rejected 鐘舵€佽€岀粨鏉熴€?/li>

鎯宠浜嗚В鏇村缁嗚妭鍙互鐪嬮槷鑰佸笀鐨凟CMAScript 6 鍏ラ棬

Promise.any(promises).then(
    (first) => {
        // 浠讳綍涓€涓狿romise瀹屾垚
    },
    (error) => {
        // 鎵€鏈夌殑 Promise閮芥嫆缁濅簡
    }
)

any 鍚嶅瓧鐨勭敱鏉?/h3>

any 椤惧悕鎬濅箟锛屼笉浠呮竻妤氱殑鎻忚堪浜嗗畠鐨勪綔鐢紝鑰屼笖鍦ㄦ彁渚涙鍔熻兘鐨勭涓夋柟搴撲腑閮芥槸杩欐牱鍛藉悕鐨勶紝鐢ㄨ繃鐨勫悓瀛︿滑涓€瀹氳寰楀緢浜插垏銆?/p>

  • https://github.com/kriskowal/q#combination
  • http://bluebirdjs.com/docs/api/promise.any.html
  • https://github.com/m0ppers/promise-any
  • https://github.com/cujojs/when/blob/master/docs/api.md#whenany
  • https://github.com/sindresorhus/p-any

鍙瑙佺殑浣滅敤

瀹樻柟鎻愪緵浜嗕竴涓緥瀛愶紝鍙互搴旂敤 Promise.any() 妫€鏌ュ摢涓珯鐐硅闂渶蹇€?/p>

Promise.any([
  fetch(\'https://v8.dev/\').then(() => \'home\'),
  fetch(\'https://v8.dev/blog\').then(() => \'blog\'),
  fetch(\'https://v8.dev/docs\').then(() => \'docs\')
]).then((first) => {
  // Any of the promises was fulfilled.
  console.log(first);
  // 鈫?\'home\'
}).catch((error) => {
  // All of the promises were rejected.
  console.log(error);
});

3.WeakRefs

https://github.com/tc39/proposal-weakrefs

娉ㄦ剰锛氳灏介噺閬垮厤浣跨敤 WeakRef 鍜?FinalizationRegistry锛屽瀮鍦惧洖鏀舵満鍒朵緷璧栦簬 JavaScript 寮曟搸鐨勫疄鐜帮紝涓嶅悓鐨勫紩鎿庢垨鏄笉鍚岀増鏈殑寮曟搸鍙兘浼氭湁鎵€涓嶅悓銆?/p>

杩欎釜鎻愭涓昏鍖呮嫭涓や釜涓昏鐨勬柊鍔熻兘锛?/p>

  • 浣跨敤 WeakRef 绫诲垱寤哄璞＄殑寮卞紩鐢?/li>
  • 浣跨敤 FinalizationRegistry 绫诲瀵硅薄杩涜鍨冨溇鍥炴敹鍚庯紝杩愯鐢ㄦ埛瀹氫箟鐨勭粓缁撳櫒

瀹冧滑鍙互鍒嗗紑浣跨敤涔熷彲浠ヤ竴璧蜂娇鐢ㄣ€?/p>

WeakRef 瀹炰緥涓嶄細闃绘 GC 鍥炴敹锛屼絾鏄?GC 浼氬湪涓ゆ EventLoop 涔嬮棿鍥炴敹 WeakRef 瀹炰緥銆?code>GC 鍥炴敹鍚庣殑 WeakRef 瀹炰緥鐨?deref() 鏂规硶灏嗕細杩斿洖 undefined銆?/p>

let ref = new WeakRef(obj)
let isLive = ref.deref() // 濡傛灉 obj 琚瀮鍦惧洖鏀朵簡锛岄偅涔?isLive 灏辨槸 undefined

FinalizationRegistry 娉ㄥ唽 Callback锛屾煇涓璞¤ GC 鍥炴敹鍚庤皟鐢ㄣ€?/p>

const registry = new FinalizationRegistry(heldValue => {
  // ....
});

// 閫氳繃 register 娉ㄥ唽浠讳綍浣犳兂瑕佹竻鐞嗗洖璋冪殑瀵硅薄锛屼紶鍏ヨ瀵硅薄鍜屾墍鍚殑鍊?registry.register(theObject, "some value");

鍏充簬鏇村鐨勭粏鑺備綘鍙互鏌ラ槄锛?/p>

  • https://github.com/tc39/proposal-weakrefs/blob/master/reference.md

4.Logical Assignment Operators 閫昏緫璧嬪€兼搷浣滅

https://github.com/tc39/proposal-logical-assignment

鍏堟潵鍥為【涓?ES2020 鏂板鐨勭┖鍊煎悎骞舵搷浣滅 ??

鍦ㄥ綋宸︿晶鎿嶄綔鏁颁负 undefined 鎴?null 鏃讹紝璇ユ搷浣滅浼氬皢鍙充晶鎿嶄綔鏁拌祴鍊肩粰宸︿晶鍙橀噺銆?/p>

const name = null ?? \'鍓嶇椋熷爞\'
console.log(name) // 鍓嶇椋熷爞

鏈変簡閫昏緫璧嬪€艰繍绠楃锛屾垜浠彲浠ユ浛鎹㈡帀濡備笅鏃х殑鍐欐硶锛?/p>

const demo = function() {
    // 鏃х殑鍐欐硶1
    // if (!a) {
    //     a = \'瑗跨摐\'
    // }
    // 鏃х殑鍐欐硶2
    // a = a || \'瑗跨摐\'

    // 鏂扮殑鍐欐硶
    a ||= \'瑗跨摐\' 
}

a ||= b; // 绛夊悓浜?a || (a = b);

a &&= b; // 绛夊悓浜?a && (a = b);

a ??= b; // 绛夊悓浜?a ?? (a = b);

5.Numeric separators 鏁板瓧鍒嗛殧绗?/h2>

https://github.com/tc39/proposal-numeric-separator

鏁板瓧鐨勫彲璇绘€ч殢鐫€鏁板瓧鍙橀暱鑰屽彉宸紝鏁板瓧鍒嗛殧绗︿細璁╅暱鏁板瓧鏇村姞娓呮櫚銆?/p>

const x = 1000000000000
const y = 1_000_000_000_000
console.log(x === y) // true

鍦ㄤ簩杩涘埗銆佸崄鍏繘鍒躲€丅igInt 绛変腑閮藉彲浠ヤ娇鐢ㄣ€?/p>

鉂わ笍鐖卞績涓夎繛鍑?/h2>

1.濡傛灉浣犺寰楅鍫傞厭鑿滆繕鍚堣儍鍙ｏ紝灏辩偣涓禐鏀寔涓嬪惂锛屼綘鐨?strong>璧?/strong>鏄垜鏈€澶х殑鍔ㄥ姏銆?/p>

2.鍏虫敞鍏紬鍙峰墠绔鍫傦紝鍚冨ソ姣忎竴椤块キ锛?/strong>

3.鐐硅禐銆佽瘎璁恒€佽浆鍙?=== 鍌洿锛?/p>

以上是关于绉嶈崏ECMAScript2021鏂扮壒鎬?/a>的主要内容，如果未能解决你的问题，请参考以下文章

011-jdk1.8鐗堟湰鏂扮壒鎬т笁-Date API

鍏ㄧ綉棣栧彂锛侊紒C++20鏂扮壒鎬у叏鍦ㄨ繖涓€寮犲浘閲屼簡

Webpack5.0 鏂扮壒鎬у皾椴滃疄鎴?馃馃 [姣忔棩鍓嶇澶滆瘽0x37]

webpack 3 姝ｅ紡鍙戝竷锛岃浣犳洿鈥滃揩鈥?/h1>

銆屼竴鍔虫案閫搞€嶇敱娴呭叆娣遍厤缃畐ebpack4

ECMAScript2015~2021全特性学习宝典