{"id":450,"date":"2023-03-20T10:24:51","date_gmt":"2023-03-20T02:24:51","guid":{"rendered":"https:\/\/fugary.com\/?p=450"},"modified":"2023-04-15T12:59:33","modified_gmt":"2023-04-15T04:59:33","slug":"%e7%94%a8chatgpt%e6%95%b4%e7%90%86%e7%9a%84ecmascript%e5%8e%86%e5%b9%b4%e6%9b%b4%e6%96%b0%e5%86%85%e5%ae%b9","status":"publish","type":"post","link":"https:\/\/fugary.com\/?p=450","title":{"rendered":"\u7528ChatGPT\u6574\u7406\u7684ECMAScript\u5386\u5e74\u66f4\u65b0\u5185\u5bb9"},"content":{"rendered":"<h4>ECMAScript 1\uff1a<\/h4>\n<ul>\n<li>\u53d1\u5e03\u65f6\u95f4\uff1a1997\u5e746\u6708<\/li>\n<li>\u66f4\u65b0\u5185\u5bb9\uff1a\u7b2c\u4e00\u4e2aECMAScript\u6807\u51c6\uff0c\u5305\u62ec\u57fa\u672c\u8bed\u6cd5\u3001\u6570\u636e\u7c7b\u578b\u3001\u63a7\u5236\u6d41\u548c\u57fa\u672c\u5bf9\u8c61\u3002<\/li>\n<\/ul>\n<h4>ECMAScript 2\uff1a<\/h4>\n<ul>\n<li>\u53d1\u5e03\u65f6\u95f4\uff1a1998\u5e746\u6708<\/li>\n<li>\u66f4\u65b0\u5185\u5bb9\uff1a\u4fee\u6b63\u4e86\u7b2c\u4e00\u4e2a\u6807\u51c6\u4e2d\u7684\u4e00\u4e9b\u7f3a\u9677\u3002<\/li>\n<\/ul>\n<h4>ECMAScript 3\uff1a<\/h4>\n<ul>\n<li>\n<p>\u53d1\u5e03\u65f6\u95f4\uff1a1999\u5e7412\u6708<\/p>\n<\/li>\n<li>\n<p>\u66f4\u65b0\u5185\u5bb9\uff1a\u5bf9\u8bed\u8a00\u8fdb\u884c\u4e86\u91cd\u5927\u5347\u7ea7\uff0c\u589e\u52a0\u4e86\u6b63\u5219\u8868\u8fbe\u5f0f\u3001\u9519\u8bef\u5904\u7406\u548c\u66f4\u5f3a\u5927\u7684\u9762\u5411\u5bf9\u8c61\u7f16\u7a0b\u652f\u6301\u3002<\/p>\n<\/li>\n<li>\n<p>\u793a\u4f8b\uff1a<\/p>\n<ul>\n<li>\u6b63\u5219\u8868\u8fbe\u5f0f\uff1a<\/li>\n<\/ul>\n<pre><code class=\"language-javascript\">var pattern = \/hello\\s+(world|everyone)\/;\nvar result = pattern.exec(\"hello world\");\nconsole.log(result[1]); \/\/ \"world\"<\/code><\/pre>\n<ul>\n<li>\u9519\u8bef\u5904\u7406\uff1a<\/li>\n<\/ul>\n<pre><code class=\"language-javascript\">try {\n  \/\/ some code that might throw an error\n} catch (e) {\n  console.error(\"An error occurred:\", e.message);\n}<\/code><\/pre>\n<ul>\n<li>\u9762\u5411\u5bf9\u8c61\u7f16\u7a0b\uff1a<\/li>\n<\/ul>\n<pre><code class=\"language-javascript\">function Person(name, age) {\n  this.name = name;\n  this.age = age;\n}\nPerson.prototype.sayHello = function() {\n  console.log(\"Hello, my name is \" + this.name);\n};\nvar john = new Person(\"John\", 30);\njohn.sayHello(); \/\/ \"Hello, my name is John\"<\/code><\/pre>\n<\/li>\n<\/ul>\n<h4>ECMAScript 4\uff1a<\/h4>\n<ul>\n<li>\u53d1\u5e03\u65f6\u95f4\uff1a\u672a\u53d1\u5e03<\/li>\n<li>\u66f4\u65b0\u5185\u5bb9\uff1a\u8be5\u7248\u672c\u89c4\u8303\u88ab\u5e9f\u5f03\uff0c\u6ca1\u6709\u6b63\u5f0f\u53d1\u5e03\u3002<\/li>\n<\/ul>\n<h4>ECMAScript 5\uff1a<\/h4>\n<ul>\n<li>\n<p>\u53d1\u5e03\u65f6\u95f4\uff1a2009\u5e7412\u6708<\/p>\n<\/li>\n<li>\n<p>\u66f4\u65b0\u5185\u5bb9\uff1a\u5f15\u5165\u4e86\u4e00\u4e9b\u65b0\u7279\u6027\uff0c\u5982\u4e25\u683c\u6a21\u5f0f\u3001JSON\u5bf9\u8c61\u3001Object.getPrototypeOf()\u548cObject.keys()\u7b49\u3002<\/p>\n<\/li>\n<li>\n<p>\u793a\u4f8b\uff1a<\/p>\n<ul>\n<li>\u4e25\u683c\u6a21\u5f0f\uff1a<\/li>\n<\/ul>\n<pre><code class=\"language-javascript\">\"use strict\";\n\/\/ some strict code here<\/code><\/pre>\n<ul>\n<li>JSON\u5bf9\u8c61\uff1a<\/li>\n<\/ul>\n<pre><code class=\"language-javascript\">var jsonStr = '{\"name\": \"John\", \"age\": 30}';\nvar obj = JSON.parse(jsonStr);\nconsole.log(obj.name); \/\/ \"John\"<\/code><\/pre>\n<ul>\n<li>Object.getPrototypeOf()\uff1a<\/li>\n<\/ul>\n<pre><code class=\"language-javascript\">var obj = {};\nvar proto = Object.getPrototypeOf(obj);\nconsole.log(proto === Object.prototype); \/\/ true<\/code><\/pre>\n<ul>\n<li>Object.keys()\uff1a<\/li>\n<\/ul>\n<pre><code class=\"language-javascript\">var obj = {name: \"John\", age: 30};\nvar keys = Object.keys(obj);\nconsole.log(keys); \/\/ [\"name\", \"age\"]<\/code><\/pre>\n<\/li>\n<li>\n<p>\u4e25\u683c\u6a21\u5f0f\uff1a\u6dfb\u52a0\u4e86\u4e25\u683c\u6a21\u5f0f\u6765\u66f4\u52a0\u89c4\u8303\u5730\u7f16\u5199JavaScript\u4ee3\u7801\u3002<\/p>\n<\/li>\n<li>\n<p>\u51fd\u6570\u7684bind\u65b9\u6cd5\uff1a\u5141\u8bb8\u6307\u5b9a\u51fd\u6570\u4e2d\u7684this\u5173\u952e\u5b57\u7ed1\u5b9a\u5230\u6307\u5b9a\u7684\u5bf9\u8c61\u4e0a\u3002<\/p>\n<\/li>\n<li>\n<p>Array\u7684\u65b9\u6cd5\uff1a\u6dfb\u52a0\u4e86\u4e00\u4e9bArray\u5bf9\u8c61\u7684\u65b0\u65b9\u6cd5\uff0c\u5982map\u3001filter\u3001reduce\u7b49\u3002<\/p>\n<\/li>\n<li>\n<p>JSON\u5bf9\u8c61\uff1a\u5c06JSON\u5bf9\u8c61\u7eb3\u5165ECMAScript\u89c4\u8303\uff0c\u5e76\u89c4\u5b9a\u4e86JSON\u683c\u5f0f\u7684\u5b57\u7b26\u4e32\u683c\u5f0f\u3002<\/p>\n<\/li>\n<\/ul>\n<h4>ECMAScript 5.1\uff1a<\/h4>\n<ul>\n<li>\u53d1\u5e03\u65f6\u95f4\uff1a2011\u5e746\u6708<\/li>\n<li>\u66f4\u65b0\u5185\u5bb9\uff1a\u4fee\u590d\u4e86ECMAScript 5\u4e2d\u7684\u4e00\u4e9b\u9519\u8bef\u3002<\/li>\n<\/ul>\n<p>\u4e0b\u9762\u662f\u4e00\u4e9bECMAScript 5.1\u7684\u793a\u4f8b\uff1a<\/p>\n<pre><code class=\"language-js\">\/\/ \u4e25\u683c\u6a21\u5f0f\u793a\u4f8b\n&quot;use strict&quot;;\nfunction strictFunc() {\n  \/\/ \u5728\u4e25\u683c\u6a21\u5f0f\u4e0b\uff0c\u4f7f\u7528\u672a\u58f0\u660e\u7684\u53d8\u91cf\u4f1a\u62a5\u9519\n  undeclaredVar = 10;\n}\nstrictFunc();\n\n\/\/ bind\u65b9\u6cd5\u793a\u4f8b\nvar person = {\n  firstName: &quot;John&quot;,\n  lastName: &quot;Doe&quot;\n};\nfunction greeting() {\n  console.log(&quot;Hello, &quot; + this.firstName + &quot; &quot; + this.lastName);\n}\nvar greetPerson = greeting.bind(person);\ngreetPerson();\n\n\/\/ Array\u65b9\u6cd5\u793a\u4f8b\nvar numbers = [1, 2, 3, 4, 5];\nvar doubledNumbers = numbers.map(function(num) {\n  return num * 2;\n});\nconsole.log(doubledNumbers); \/\/ [2, 4, 6, 8, 10]\n\n\/\/ JSON\u793a\u4f8b\nvar person = {\n  firstName: &quot;John&quot;,\n  lastName: &quot;Doe&quot;,\n  age: 30\n};\nvar jsonString = JSON.stringify(person);\nconsole.log(jsonString); \/\/ {&quot;firstName&quot;:&quot;John&quot;,&quot;lastName&quot;:&quot;Doe&quot;,&quot;age&quot;:30}<\/code><\/pre>\n<h4>ECMAScript 6\uff1a<\/h4>\n<ul>\n<li>\u53d1\u5e03\u65f6\u95f4\uff1a2015\u5e746\u6708<\/li>\n<li>\u66f4\u65b0\u5185\u5bb9\uff1a\u5f15\u5165\u4e86\u8bb8\u591a\u91cd\u8981\u7684\u65b0\u7279\u6027\uff0c\u5982\u7bad\u5934\u51fd\u6570\u3001\u6a21\u677f\u5b57\u7b26\u4e32\u3001\u89e3\u6784\u8d4b\u503c\u3001\u7c7b\u548c\u6a21\u5757\u7b49\u3002<\/li>\n<\/ul>\n<p>ECMAScript 6\uff08ES6\uff09\u662fJavaScript\u8bed\u8a00\u7684\u4e0b\u4e00\u4ee3\u6807\u51c6\uff0c\u4e5f\u79f0\u4e3aECMAScript 2015\u3002\u5b83\u4e8e2015\u5e746\u6708\u53d1\u5e03\uff0c\u5f15\u5165\u4e86\u8bb8\u591a\u65b0\u7684\u8bed\u8a00\u7279\u6027\u548c\u8bed\u6cd5\u6539\u8fdb\u3002\u4e0b\u9762\u662fECMAScript 6\u7684\u4e00\u4e9b\u91cd\u8981\u7279\u6027\u548c\u793a\u4f8b\uff1a<\/p>\n<ol>\n<li>let \u548c const \u58f0\u660e\uff082015\u5e746\u6708\u53d1\u5e03\uff09\uff1a<\/li>\n<\/ol>\n<ul>\n<li>let \u548c const \u58f0\u660e\u53d6\u4ee3\u4e86 var \u58f0\u660e\u3002<\/li>\n<li>let \u58f0\u660e\u7528\u4e8e\u58f0\u660e\u5c40\u90e8\u53d8\u91cf\uff0cconst \u58f0\u660e\u7528\u4e8e\u58f0\u660e\u5e38\u91cf\u3002<\/li>\n<li>\u793a\u4f8b\uff1a<\/li>\n<\/ul>\n<pre><code class=\"language-javascript\">let x = 1; \/\/ \u5c40\u90e8\u53d8\u91cf\nconst PI = 3.14; \/\/ \u5e38\u91cf<\/code><\/pre>\n<ol start=\"2\">\n<li>\u7bad\u5934\u51fd\u6570\uff082015\u5e746\u6708\u53d1\u5e03\uff09\uff1a<\/li>\n<\/ol>\n<ul>\n<li>\u7bad\u5934\u51fd\u6570\u662f\u4e00\u79cd\u66f4\u7b80\u77ed\u7684\u51fd\u6570\u8bed\u6cd5\u3002<\/li>\n<li>\u5b83\u4eec\u4f7f\u7528 =&gt; \u7b26\u53f7\u6765\u5206\u9694\u53c2\u6570\u548c\u51fd\u6570\u4f53\u3002<\/li>\n<li>\u793a\u4f8b\uff1a<\/li>\n<\/ul>\n<pre><code class=\"language-javascript\">\/\/ \u4f20\u7edf\u51fd\u6570\nfunction add(x, y) {\n  return x + y;\n}\n\n\/\/ \u7bad\u5934\u51fd\u6570\nlet add = (x, y) =&gt; x + y;<\/code><\/pre>\n<ol start=\"3\">\n<li>\u6a21\u677f\u5b57\u9762\u91cf\uff082015\u5e746\u6708\u53d1\u5e03\uff09\uff1a<\/li>\n<\/ol>\n<ul>\n<li>\u6a21\u677f\u5b57\u9762\u91cf\u5141\u8bb8\u5728\u5b57\u7b26\u4e32\u4e2d\u63d2\u5165\u53d8\u91cf\u3002<\/li>\n<li>\u4f7f\u7528\u53cd\u5f15\u53f7\uff08`\uff09\u800c\u4e0d\u662f\u5f15\u53f7\u3002<\/li>\n<li>\u793a\u4f8b\uff1a<\/li>\n<\/ul>\n<pre><code class=\"language-javascript\">let name = &#039;John&#039;;\nconsole.log(`Hello, ${name}!`);<\/code><\/pre>\n<ol start=\"4\">\n<li>\u89e3\u6784\u8d4b\u503c\uff082015\u5e746\u6708\u53d1\u5e03\uff09\uff1a<\/li>\n<\/ol>\n<ul>\n<li>\u89e3\u6784\u8d4b\u503c\u5141\u8bb8\u4ece\u6570\u7ec4\u6216\u5bf9\u8c61\u4e2d\u63d0\u53d6\u503c\u5e76\u8d4b\u7ed9\u53d8\u91cf\u3002<\/li>\n<li>\u793a\u4f8b\uff1a<\/li>\n<\/ul>\n<pre><code class=\"language-javascript\">\/\/ \u6570\u7ec4\u89e3\u6784\u8d4b\u503c\nlet [x, y] = [1, 2];\n\n\/\/ \u5bf9\u8c61\u89e3\u6784\u8d4b\u503c\nlet { name, age } = { name: &#039;John&#039;, age: 30 };<\/code><\/pre>\n<ol start=\"5\">\n<li>\u7c7b\u548c\u7ee7\u627f\uff082015\u5e746\u6708\u53d1\u5e03\uff09\uff1a<\/li>\n<\/ol>\n<ul>\n<li>\u7c7b\u662f\u4e00\u79cd\u58f0\u660e\u5bf9\u8c61\u7684\u7ed3\u6784\u3002<\/li>\n<li>\u7ee7\u627f\u5141\u8bb8\u7c7b\u4ece\u5176\u4ed6\u7c7b\u7ee7\u627f\u5c5e\u6027\u548c\u65b9\u6cd5\u3002<\/li>\n<li>\u793a\u4f8b\uff1a<\/li>\n<\/ul>\n<pre><code class=\"language-javascript\">class Person {\n  constructor(name, age) {\n    this.name = name;\n    this.age = age;\n  }\n\n  sayHello() {\n    console.log(`Hello, my name is ${this.name} and I am ${this.age} years old.`);\n  }\n}\n\nclass Student extends Person {\n  constructor(name, age, grade) {\n    super(name, age);\n    this.grade = grade;\n  }\n\n  study() {\n    console.log(`${this.name} is studying hard!`);\n  }\n}\n\nlet john = new Student(&#039;John&#039;, 18, &#039;12th&#039;);\njohn.sayHello(); \/\/ \u8f93\u51fa\uff1aHello, my name is John and I am 18 years old.\njohn.study(); \/\/ \u8f93\u51fa\uff1aJohn is studying hard!<\/code><\/pre>\n<ol start=\"6\">\n<li>Promise\uff082015\u5e746\u6708\u53d1\u5e03\uff09\uff1a<\/li>\n<\/ol>\n<ul>\n<li>Promise \u662f\u4e00\u79cd\u5904\u7406\u5f02\u6b65\u64cd\u4f5c\u7684\u65b9\u6cd5\u3002<\/li>\n<li>\u5b83\u4eec\u53ef\u4ee5\u8ba9\u60a8\u5728\u64cd\u4f5c\u5b8c\u6210\u540e\u6267\u884c\u5176\u4ed6\u4ee3\u7801\u3002<\/li>\n<li>\u793a\u4f8b\uff1a<\/li>\n<\/ul>\n<pre><code class=\"language-javascript\">let promise = new Promise((resolve, reject) =&gt; {\n  setTimeout(() =&gt; {\n    resolve(&#039;Success!&#039;);\n  }, 1000);\n});\n\npromise.then((result) =&gt; {\n  console.log(result); \/\/ \u8f93\u51fa\uff1aSuccess!\n})<\/code><\/pre>\n<h4>ECMAScript 2017 (ES8)<\/h4>\n<p>\u65f6\u95f4\uff1a2017\u5e746\u6708<\/p>\n<p>\u66f4\u65b0\u5185\u5bb9\uff1a<\/p>\n<ol>\n<li>Object.entries() \u548c Object.values()<\/li>\n<\/ol>\n<p>\u65b0\u589e\u4e86Object.entries()\u548cObject.values()\u4e24\u4e2a\u9759\u6001\u65b9\u6cd5\uff0c\u53ef\u4ee5\u5206\u522b\u8fd4\u56de\u5bf9\u8c61\u7684\u952e\u503c\u5bf9\u548c\u503c\u7684\u96c6\u5408\u3002<\/p>\n<p>\u793a\u4f8b\uff1a<\/p>\n<pre><code class=\"language-javascript\">const obj = { foo: &#039;bar&#039;, baz: 42 };\nconsole.log(Object.entries(obj)); \/\/ [[&#039;foo&#039;, &#039;bar&#039;], [&#039;baz&#039;, 42]]\nconsole.log(Object.values(obj)); \/\/ [&#039;bar&#039;, 42]<\/code><\/pre>\n<ol start=\"2\">\n<li>\u5b57\u7b26\u4e32\u586b\u5145\u65b9\u6cd5 padStart() \u548c padEnd()<\/li>\n<\/ol>\n<p>\u65b0\u589e\u4e86\u5b57\u7b26\u4e32\u586b\u5145\u65b9\u6cd5padStart()\u548cpadEnd()\uff0c\u53ef\u4ee5\u5728\u5b57\u7b26\u4e32\u7684\u5f00\u5934\u6216\u7ed3\u5c3e\u6dfb\u52a0\u6307\u5b9a\u7684\u5b57\u7b26\uff0c\u4f7f\u5b57\u7b26\u4e32\u8fbe\u5230\u6307\u5b9a\u7684\u957f\u5ea6\u3002<\/p>\n<p>\u793a\u4f8b\uff1a<\/p>\n<pre><code class=\"language-javascript\">const str = &#039;foo&#039;;\nconsole.log(str.padStart(6, &#039;x&#039;)); \/\/ &#039;xxxxfo&#039;\nconsole.log(str.padEnd(6, &#039;x&#039;)); \/\/ &#039;fooxxx&#039;<\/code><\/pre>\n<ol start=\"3\">\n<li>\u51fd\u6570\u53c2\u6570\u5217\u8868\u7ed3\u5c3e\u5141\u8bb8\u9017\u53f7<\/li>\n<\/ol>\n<p>\u5728\u51fd\u6570\u53c2\u6570\u5217\u8868\u4e2d\uff0c\u6700\u540e\u4e00\u4e2a\u53c2\u6570\u540e\u5141\u8bb8\u6709\u4e00\u4e2a\u9017\u53f7\uff0c\u8fd9\u6837\u6709\u52a9\u4e8e\u5728\u6dfb\u52a0\u6216\u5220\u9664\u53c2\u6570\u65f6\u4fdd\u6301\u4ee3\u7801\u7684\u4e00\u81f4\u6027\u3002<\/p>\n<p>\u793a\u4f8b\uff1a<\/p>\n<pre><code class=\"language-javascript\">function myFunction(a, b, c,) {\n  \/\/ ...\n}<\/code><\/pre>\n<ol start=\"4\">\n<li>\u5171\u4eab\u5185\u5b58\u548c\u539f\u5b50\u64cd\u4f5cAPI<\/li>\n<\/ol>\n<p>\u65b0\u589e\u4e86\u5171\u4eab\u5185\u5b58\u548c\u539f\u5b50\u64cd\u4f5c\u7684API\uff0c\u8fd9\u4e9bAPI\u652f\u6301\u591a\u7ebf\u7a0bJavaScript\u5e94\u7528\u7a0b\u5e8f\u7684\u5f00\u53d1\u3002<\/p>\n<p>\u793a\u4f8b\uff1a<\/p>\n<pre><code class=\"language-javascript\">const buffer = new SharedArrayBuffer(16);\nconst view = new Int32Array(buffer);\n\nfunction updateView() {\n  Atomics.store(view, 0, 123);\n}\n\nfunction getView() {\n  return Atomics.load(view, 0);\n}<\/code><\/pre>\n<h4>ECMAScript 2018 (ES9)<\/h4>\n<p>\u65f6\u95f4\uff1a2018\u5e746\u6708<\/p>\n<p>\u66f4\u65b0\u5185\u5bb9\uff1a<\/p>\n<ol>\n<li>\u5f02\u6b65\u8fed\u4ee3<\/li>\n<\/ol>\n<p>\u65b0\u589e\u4e86\u5f02\u6b65\u8fed\u4ee3\u5668\u548cfor-await-of\u5faa\u73af\uff0c\u53ef\u4ee5\u66f4\u65b9\u4fbf\u5730\u904d\u5386\u5f02\u6b65\u6570\u636e\u6d41\u3002<\/p>\n<p>\u793a\u4f8b\uff1a<\/p>\n<pre><code class=\"language-javascript\">async function* asyncGenerator() {\n  yield 1;\n  yield 2;\n  yield 3;\n}\n\n(async function() {\n  for await (let num of asyncGenerator()) {\n    console.log(num);\n  }\n})();<\/code><\/pre>\n<ol start=\"2\">\n<li>Promise.prototype.finally()<\/li>\n<\/ol>\n<p>\u65b0\u589e\u4e86Promise.prototype.finally()\u65b9\u6cd5\uff0c\u7528\u4e8e\u6307\u5b9a\u5728Promise\u72b6\u6001\u53d8\u4e3aresolved\u6216rejected\u65f6\u90fd\u4f1a\u6267\u884c\u7684\u56de\u8c03\u51fd\u6570\u3002<\/p>\n<p>\u793a\u4f8b\uff1a<\/p>\n<pre><code class=\"language-javascript\">function myFetch() {\n  return fetch(&#039;https:\/\/example.com\/data&#039;)\n    .then(response =&gt; response.json())\n    .finally(() =&gt; {\n      console.log(&#039;cleanup&#039;);\n    });\n}<\/code><\/pre>\n<ol start=\"3\">\n<li>Rest\/Spread\u5c5e\u6027<\/li>\n<\/ol>\n<p>Rest\/Spread\u5c5e\u6027\u652f\u6301\u4e86\u5bf9\u8c61\u548c\u6570\u7ec4\u7684\u5c55\u5f00\u64cd\u4f5c\u7b26(...)\uff0c\u7528\u4e8e\u65b9\u4fbf\u5730\u590d\u5236\u548c\u5408\u5e76\u6570\u636e\u3002<\/p>\n<p>\u793a\u4f8b\uff1a<\/p>\n<pre><code class=\"language-js\">const obj1 = { a: 1, b: 2 };\nconst obj2 = { ...obj1, c: 3 };\n\nconst arr1 = [1, 2, 3];\nconst arr2 = [4, 5, 6];\nconst arr3 = [...arr1, ...arr2];<\/code><\/pre>\n<h4>ECMAScript 2019 (ES10)<\/h4>\n<p>\u65f6\u95f4\uff1a2019\u5e746\u6708<\/p>\n<p>\u66f4\u65b0\u5185\u5bb9\uff1a<\/p>\n<ol>\n<li>Object.fromEntries()\uff1a\u8be5\u65b9\u6cd5\u53ef\u4ee5\u5c06\u952e\u503c\u5bf9\u5217\u8868\u8f6c\u6362\u4e3a\u5bf9\u8c61\u3002\u8fd9\u5728\u5c06Map\u8f6c\u6362\u4e3a\u5bf9\u8c61\u65f6\u975e\u5e38\u6709\u7528\u3002<\/li>\n<\/ol>\n<p>\u793a\u4f8b\uff1a<\/p>\n<pre><code class=\"language-js\">const entries = new Map([[&#039;foo&#039;, &#039;bar&#039;], [&#039;baz&#039;, 42]]);\nconst obj = Object.fromEntries(entries);\nconsole.log(obj); \/\/ {foo: &quot;bar&quot;, baz: 42}<\/code><\/pre>\n<ol start=\"2\">\n<li>String.trimStart()\u548cString.trimEnd()\uff1a\u8fd9\u4e24\u4e2a\u65b9\u6cd5\u53ef\u4ee5\u5206\u522b\u7528\u4e8e\u5220\u9664\u5b57\u7b26\u4e32\u7684\u5f00\u5934\u548c\u7ed3\u5c3e\u7684\u7a7a\u767d\u5b57\u7b26\u3002<\/li>\n<\/ol>\n<p>\u793a\u4f8b\uff1a<\/p>\n<pre><code class=\"language-js\">const str = &quot;  hello world  &quot;;\nconsole.log(str.trimStart()); \/\/ &quot;hello world  &quot;\nconsole.log(str.trimEnd()); \/\/ &quot;  hello world&quot;<\/code><\/pre>\n<ol start=\"3\">\n<li>Array.prototype.flat()\u548cArray.prototype.flatMap()\uff1a\u8fd9\u4e24\u4e2a\u65b9\u6cd5\u53ef\u4ee5\u7528\u4e8e\u5c06\u5d4c\u5957\u6570\u7ec4\u201c\u5c55\u5e73\u201d\u3002<\/li>\n<\/ol>\n<p>\u793a\u4f8b\uff1a<\/p>\n<pre><code class=\"language-js\">const arr = [1, 2, [3, 4, [5, 6]]];\nconsole.log(arr.flat()); \/\/ [1, 2, 3, 4, [5, 6]]\nconsole.log(arr.flat(2)); \/\/ [1, 2, 3, 4, 5, 6]\n\nconst arr2 = [1, 2, 3];\nconsole.log(arr2.flatMap(x =&gt; [x * 2])); \/\/ [2, 4, 6]<\/code><\/pre>\n<ol start=\"4\">\n<li>Optional Catch Binding\uff1a\u73b0\u5728\u53ef\u4ee5\u7701\u7565catch\u8bed\u53e5\u4e2d\u7684\u53c2\u6570\uff0c\u4f8b\u5982\uff1a<\/li>\n<\/ol>\n<p>\u793a\u4f8b\uff1a<\/p>\n<pre><code class=\"language-js\">try {\n  \/\/ code here\n} catch {\n  \/\/ handle error here\n}<\/code><\/pre>\n<ol start=\"5\">\n<li>Object.getOwnPropertyDescriptors()\uff1a\u8be5\u65b9\u6cd5\u8fd4\u56de\u5bf9\u8c61\u7684\u6240\u6709\u5c5e\u6027\u63cf\u8ff0\u7b26\uff0c\u5305\u62ec\u5b83\u4eec\u7684\u503c\u3001\u53ef\u679a\u4e3e\u6027\u3001\u53ef\u914d\u7f6e\u6027\u548c\u53ef\u5199\u6027\u7b49\u4fe1\u606f\u3002<\/li>\n<\/ol>\n<p>\u793a\u4f8b\uff1a<\/p>\n<pre><code class=\"language-js\">const obj = { foo: &#039;bar&#039; };\nconsole.log(Object.getOwnPropertyDescriptors(obj));\n\/\/ { foo: { value: &#039;bar&#039;, writable: true, enumerable: true, configurable: true } }<\/code><\/pre>\n<ol start=\"6\">\n<li>BigInt\uff1a\u73b0\u5728\u53ef\u4ee5\u4f7f\u7528BigInt\u7c7b\u578b\u6765\u8868\u793a\u66f4\u5927\u7684\u6574\u6570\u3002<\/li>\n<\/ol>\n<p>\u793a\u4f8b\uff1a<\/p>\n<pre><code class=\"language-js\">const x = 9007199254740991n;\nconst y = 9007199254740992n;\nconsole.log(x + y); \/\/ 18014398509481983n<\/code><\/pre>\n<ol start=\"7\">\n<li>\u5176\u4ed6\u6539\u8fdb\uff1a\u8fd8\u6709\u4e00\u4e9b\u5176\u4ed6\u7684\u6539\u8fdb\uff0c\u4f8b\u5982\uff0cArray.prototype.sort()\u65b9\u6cd5\u73b0\u5728\u4f7f\u7528TimSort\u7b97\u6cd5\uff0c\u4ee5\u53caFunction.prototype.toString()\u65b9\u6cd5\u73b0\u5728\u8fd4\u56de\u5b8c\u6574\u7684\u51fd\u6570\u6e90\u4ee3\u7801\u7b49\u7b49\u3002<\/li>\n<\/ol>\n<h4>ECMAScript 2020 (ES11)<\/h4>\n<p>\u65f6\u95f4\uff1a2020\u5e746\u6708<\/p>\n<p>ECMAScript 2020\u662fJavaScript\u8bed\u8a00\u7684\u6700\u65b0\u7248\u672c\uff0c\u4e5f\u79f0\u4e3aES11\u6216ES2020\u3002\u5b83\u57282020\u5e746\u6708\u53d1\u5e03\uff0c\u5305\u542b\u4e86\u4e00\u4e9b\u65b0\u7279\u6027\u548c\u6539\u8fdb\uff0c\u4e0b\u9762\u662f\u4e00\u4e9b\u91cd\u8981\u7684\u66f4\u65b0\uff1a<\/p>\n<ol>\n<li>Promise.allSettled()\u65b9\u6cd5\uff1aPromise.allSettled()\u65b9\u6cd5\u8fd4\u56de\u4e00\u4e2aPromise\uff0c\u8be5Promise\u4f1a\u5728\u6240\u6709\u4f20\u9012\u7684Promise\u5df2\u5b8c\u6210\u540e\u5b8c\u6210\uff0c\u800c\u4e0d\u7ba1\u5b83\u4eec\u662f\u5426\u6210\u529f\u3002<\/li>\n<\/ol>\n<p>\u793a\u4f8b\uff1a<\/p>\n<pre><code class=\"language-js\">const promises = [\n  Promise.resolve(&#039;resolved&#039;),\n  Promise.reject(&#039;rejected&#039;),\n  Promise.resolve(&#039;resolved again&#039;)\n];\n\nPromise.allSettled(promises)\n  .then(results =&gt; console.log(results));<\/code><\/pre>\n<p>\u8f93\u51fa\u7ed3\u679c\uff1a<\/p>\n<pre><code class=\"language-js\">[\n  {status: &quot;fulfilled&quot;, value: &quot;resolved&quot;},\n  {status: &quot;rejected&quot;, reason: &quot;rejected&quot;},\n  {status: &quot;fulfilled&quot;, value: &quot;resolved again&quot;}\n]<\/code><\/pre>\n<ol>\n<li>\u53ef\u9009\u94fe\u64cd\u4f5c\u7b26\uff08Optional chaining operator\uff09\uff1a\u53ef\u9009\u94fe\u64cd\u4f5c\u7b26\u5141\u8bb8\u60a8\u5728\u4e0d\u9a8c\u8bc1\u524d\u9762\u6bcf\u4e2a\u5f15\u7528\u662f\u5426\u5b58\u5728\u7684\u60c5\u51b5\u4e0b\u5b89\u5168\u5730\u8bbf\u95ee\u6df1\u5c42\u5d4c\u5957\u7684\u5bf9\u8c61\u3002<\/li>\n<\/ol>\n<p>\u793a\u4f8b\uff1a<\/p>\n<pre><code class=\"language-js\">const user = {\n  name: &#039;John&#039;,\n  address: {\n    street: &#039;123 Main St&#039;,\n    city: &#039;Anytown&#039;,\n    state: &#039;CA&#039;,\n    zip: &#039;12345&#039;\n  }\n};\n\nconsole.log(user?.address?.street); \/\/ 123 Main St\nconsole.log(user?.phone?.number); \/\/ undefined<\/code><\/pre>\n<ol>\n<li>\n<p>\u7a7a\u503c\u5408\u5e76\u8fd0\u7b97\u7b26\uff08Nullish coalescing operator\uff09\uff1a\u7a7a\u503c\u5408\u5e76\u8fd0\u7b97\u7b26\uff08??\uff09\u662f\u4e00\u79cd\u7528\u4e8e\u5904\u7406null\u6216undefined\u503c\u7684\u65b0\u8fd0\u7b97\u7b26\u3002\u5982\u679c\u5de6\u4fa7\u7684\u64cd\u4f5c\u6570\u4e3anull\u6216undefined\uff0c\u5219\u8fd4\u56de\u53f3\u4fa7\u7684\u64cd\u4f5c\u6570\uff0c\u5426\u5219\u8fd4\u56de\u5de6\u4fa7<\/p>\n<\/li>\n<li>\n<p>\u7684\u64cd\u4f5c\u6570\u3002<\/p>\n<p>\u793a\u4f8b\uff1a<\/p>\n<pre><code class=\"language-js\">const someValue = null;\nconst anotherValue = 'Hello';\n\nconsole.log(someValue ?? 'Default Value'); \/\/ Default Value\nconsole.log(anotherValue ?? 'Default Value'); \/\/ Hello<\/code><\/pre>\n<ol>\n<li>\u53ef\u8fed\u4ee3\u5bf9\u8c61\u7684\u65b0\u65b9\u6cd5\uff1a\u8be5\u7248\u672c\u4e2d\u8fd8\u5f15\u5165\u4e86\u4e00\u4e9b\u65b0\u7684\u53ef\u8fed\u4ee3\u5bf9\u8c61\u65b9\u6cd5\uff0c\u5982BigInt\u3001String\u3001Array\u7b49\u5bf9\u8c61\u7684\u65b0\u65b9\u6cd5\u3002<\/li>\n<\/ol>\n<p>\u793a\u4f8b\uff1a<\/p>\n<pre><code class=\"language-js\">\/\/ BigInt\u65b0\u65b9\u6cd5\nconst bigNum = 123456789n;\nconsole.log(bigNum.toLocaleString('en-US')); \/\/ 123,456,789\n\n\/\/ String\u65b0\u65b9\u6cd5\nconst str = 'Hello World';\nconsole.log(str.startsWith('Hello')); \/\/ true\nconsole.log(str.endsWith('World')); \/\/ true\nconsole.log(str.trimEnd()); \/\/ 'Hello World'\n\n\/\/ Array\u65b0\u65b9\u6cd5\nconst arr = [1, 2, 3];\nconsole.log(arr.copyWithin(1, 0)); \/\/ [1, 1, 2]\nconsole.log(arr.flat()); \/\/ [1, 1, 2]<\/code><\/pre>\n<\/li>\n<\/ol>\n<h4>ECMAScript 2021(ES12)<\/h4>\n<p>\u65f6\u95f4\uff1a2021\u5e746\u6708<\/p>\n<p>ECMAScript 2021\u662fJavaScript\u8bed\u8a00\u7684\u6700\u65b0\u7248\u672c\uff0c\u4e5f\u79f0\u4e3aES12\u6216ES2021\u3002\u5b83\u57282021\u5e746\u6708\u53d1\u5e03\uff0c\u5305\u542b\u4e86\u4e00\u4e9b\u65b0\u7279\u6027\u548c\u6539\u8fdb\uff0c\u4e0b\u9762\u662f\u4e00\u4e9b\u91cd\u8981\u7684\u66f4\u65b0\uff1a<\/p>\n<ol>\n<li>Promise.any()\u65b9\u6cd5\uff1aPromise.any()\u65b9\u6cd5\u63a5\u6536\u4e00\u4e2a\u7531\u591a\u4e2aPromise\u5bf9\u8c61\u7ec4\u6210\u7684\u6570\u7ec4\uff0c\u8fd4\u56de\u6700\u5feb\u89e3\u51b3\u7684Promise\u7684\u7ed3\u679c\u3002<\/li>\n<\/ol>\n<p>\u793a\u4f8b\uff1a<\/p>\n<pre><code class=\"language-js\">const promises = [\n  new Promise((resolve) =&gt; setTimeout(resolve, 5000, &#039;first&#039;)),\n  new Promise((resolve) =&gt; setTimeout(resolve, 2000, &#039;second&#039;)),\n  new Promise((resolve, reject) =&gt; setTimeout(reject, 3000, &#039;rejected&#039;))\n];\n\nPromise.any(promises)\n  .then(result =&gt; console.log(result)); \/\/ &#039;second&#039;<\/code><\/pre>\n<ol>\n<li>WeakRefs\uff1aWeakRefs\u662f\u4e00\u79cd\u65b0\u7684\u5783\u573e\u56de\u6536\u673a\u5236\uff0c\u53ef\u4ee5\u5728\u4e0d\u5f71\u54cd\u5185\u5b58\u7ba1\u7406\u7684\u60c5\u51b5\u4e0b\uff0c\u5c06\u5bf9\u8c61\u5b58\u50a8\u5728\u5f31\u5f15\u7528\u4e2d\u3002<\/li>\n<\/ol>\n<p>\u793a\u4f8b\uff1a<\/p>\n<pre><code class=\"language-js\">let obj = {a: 1};\nconst weakRef = new WeakRef(obj);\n\nobj = null;\n\nsetTimeout(() =&gt; {\n  if (weakRef.deref() === undefined) {\n    console.log(&#039;Object is garbage collected&#039;);\n  }\n}, 5000);<\/code><\/pre>\n<ol>\n<li>\u6570\u503c\u5206\u9694\u7b26\uff08Numeric separators\uff09\uff1a\u6570\u503c\u5206\u9694\u7b26\u5141\u8bb8\u5728\u6570\u5b57\u5b57\u9762\u91cf\u4e2d\u4f7f\u7528\u4e0b\u5212\u7ebf\u6765\u5206\u9694\u6570\u5b57\uff0c\u4ee5\u63d0\u9ad8\u4ee3\u7801\u7684\u53ef\u8bfb\u6027\u3002<\/li>\n<\/ol>\n<p>\u793a\u4f8b\uff1a<\/p>\n<pre><code class=\"language-js\">const bigNumber = 1_000_000_000;\nconst binaryNumber = 0b1010_0001;\nconst hexNumber = 0xFF_00_FF;<\/code><\/pre>\n<ol>\n<li>String.prototype.replaceAll()\u65b9\u6cd5\uff1aString.prototype.replaceAll()\u65b9\u6cd5\u53ef\u4ee5\u66ff\u6362\u5b57\u7b26\u4e32\u4e2d\u6240\u6709\u51fa\u73b0\u7684\u5b50\u5b57\u7b26\u4e32\u3002<\/li>\n<\/ol>\n<p>\u793a\u4f8b\uff1a<\/p>\n<pre><code class=\"language-js\">const str = &#039;Hello World&#039;;\nconsole.log(str.replaceAll(&#039;l&#039;, &#039;X&#039;)); \/\/ &#039;HeXXo WorXd&#039;<\/code><\/pre>\n<p>\u8fd9\u4e9b\u662fECMAScript 2021\u7684\u4e00\u4e9b\u91cd\u8981\u66f4\u65b0\u548c\u793a\u4f8b\u3002\u8fd9\u4e2a\u7248\u672c\u4e2d\u8fd8\u6709\u5176\u4ed6\u7684\u6539\u8fdb\u548c\u66f4\u65b0\uff0c\u53ef\u4ee5\u5728\u5b98\u65b9\u6587\u6863\u4e2d\u4e86\u89e3\u5230\u66f4\u591a\u4fe1\u606f\u3002<\/p>\n","protected":false},"excerpt":{"rendered":"<p>ECMAScript 1\uff1a \u53d1\u5e03\u65f6\u95f4\uff1a1997\u5e746\u6708 \u66f4\u65b0\u5185\u5bb9\uff1a\u7b2c\u4e00\u4e2aECMAScript\u6807\u51c6\uff0c\u5305\u62ec\u57fa\u672c\u8bed\u6cd5\u3001 [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":[],"categories":[107,4],"tags":[96,97,98],"_links":{"self":[{"href":"https:\/\/fugary.com\/index.php?rest_route=\/wp\/v2\/posts\/450"}],"collection":[{"href":"https:\/\/fugary.com\/index.php?rest_route=\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/fugary.com\/index.php?rest_route=\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/fugary.com\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/fugary.com\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=450"}],"version-history":[{"count":1,"href":"https:\/\/fugary.com\/index.php?rest_route=\/wp\/v2\/posts\/450\/revisions"}],"predecessor-version":[{"id":451,"href":"https:\/\/fugary.com\/index.php?rest_route=\/wp\/v2\/posts\/450\/revisions\/451"}],"wp:attachment":[{"href":"https:\/\/fugary.com\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=450"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/fugary.com\/index.php?rest_route=%2Fwp%2Fv2%2Fcategories&post=450"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/fugary.com\/index.php?rest_route=%2Fwp%2Fv2%2Ftags&post=450"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}