{"id":1204,"date":"2022-05-24T22:38:27","date_gmt":"2022-05-24T14:38:27","guid":{"rendered":"http:\/\/zhuxinyong.com\/?p=1204"},"modified":"2022-05-25T13:36:48","modified_gmt":"2022-05-25T05:36:48","slug":"symbol-xu-yao-zhi-dao-de-zhi-shi-dian","status":"publish","type":"post","link":"https:\/\/zhuxinyong.com\/?p=1204","title":{"rendered":"Symbol \u9700\u8981\u77e5\u9053\u7684\u77e5\u8bc6\u70b9"},"content":{"rendered":"<p><img decoding=\"async\" src=\"http:\/\/zhuxinyong.com\/wp-content\/uploads\/2022\/05\/2022-05-2512_09_00.png\" alt=\"2022-05-25+12_09_00\" \/><\/p>\n<h2><a id=\"%E6%98%AF%E4%BB%80%E4%B9%88%EF%BC%9F\" class=\"anchor\" aria-hidden=\"true\"><span class=\"octicon octicon-link\"><\/span><\/a>\u662f\u4ec0\u4e48\uff1f<\/h2>\n<p>Symbol \u662f ES6 \u65b0\u589e\u7684\u57fa\u672c\u6570\u636e\u7c7b\u578b&#8211;\u7b26\u53f7\uff0c\u5b83\u5177\u6709<strong>\u552f\u4e00\u6027\u3001\u4e0d\u53ef\u53d8\u6027<\/strong>\u3002\u56e0\u6b64\u80fd\u786e\u4fdd\u5bf9\u8c61\u5c5e\u6027\u7684\u552f\u4e00\u6027\uff0c\u4e0d\u4f1a\u53d1\u751f\u51b2\u7a81\u3002<\/p>\n<p>Symbol \u548c\u5176\u4ed6\u57fa\u672c\u7c7b\u578b\uff1anull\u3001undefined\u3001boolean\u3001number\u3001string\u7684\u4e0d\u540c\u662f\u6ca1\u6709\u5bf9\u5e94\u7684\u5305\u88c5\u7c7b\u548c new \u4e00\u8d77\u4f7f\u7528\u3002<\/p>\n<pre class=\"line-numbers\"><code class=\"language-plain_text\">let s = new String('zhangsan')\n<\/code><\/pre>\n<p>\u800c new Symbol() \u5219\u4f1a\u62a5\u9519\uff1a<\/p>\n<pre class=\"line-numbers\"><code class=\"language-plain_text\">let s = new Symbol() \n\/\/ Uncaught TypeError: Symbol is not a constructor\n<\/code><\/pre>\n<h3><a id=\"%E5%9F%BA%E6%9C%AC%E7%94%A8%E6%B3%95\" class=\"anchor\" aria-hidden=\"true\"><span class=\"octicon octicon-link\"><\/span><\/a>\u57fa\u672c\u7528\u6cd5<\/h3>\n<p>\u521b\u5efa\uff1a<\/p>\n<pre class=\"line-numbers\"><code class=\"language-plain_text\">let s = Symbol()\nlet name = Symbol('name') \/\/ \u4f20\u5165\u5b57\u7b26\u4e32\u4f5c\u4e3a\u7b26\u53f7\u7684\u63cf\u8ff0\uff0c\u4e3b\u8981\u7528\u4e8e\u8c03\u8bd5\u4ee3\u7801\n<\/code><\/pre>\n<p>\u6bd4\u8f83\uff1a<\/p>\n<pre class=\"line-numbers\"><code class=\"language-plain_text\">let s1 = Symbol()\nlet s2 = Symbol()\n\ns1 == s2 \/\/ false\n\nlet s3 = Symbol('name')\nlet s4 = Symbol('name')\n\ns3 == s4 \/\/ false\n<\/code><\/pre>\n<p>\u4e4b\u524d\u5bf9\u8c61\u7684\u5c5e\u6027\u53ea\u80fd\u662f\u5b57\u7b26\u4e32\u7c7b\u578b\uff0c\u73b0\u5728\u53ef\u4ee5\u662f Symbol \u7684\u5b9e\u4f8b\uff1a<\/p>\n<pre class=\"line-numbers\"><code class=\"language-plain_text\">let name = Symbol('name')\nlet o = {\n    [name]:'zhangsan'\n}\n\n\/\/ or \n\nlet name = Symbol('name')\nlet o = {}\no[name] = 'zhangsan'\n<\/code><\/pre>\n<p>\u90a3\u76f8\u5bf9\u4e8e\u5b57\u7b26\u4e32\u7c7b\u578b\u7684\u4f18\u70b9\u5c31\u662f\u552f\u4e00\u6027\uff0c\u4e0d\u4f1a\u8986\u76d6\u5df2\u6709\u7684\u5c5e\u6027\uff1a\u6bd4\u5982\u60f3\u5bf9\u7b2c\u4e09\u65b9\u7684\u4e00\u4e2a\u5bf9\u8c61 people \u6dfb\u52a0\u5c5e\u6027\u65f6\uff0c\u5982\u679c\u4f7f\u7528\u5b57\u7b26\u4e32\u4f5c\u4e3a\u5c5e\u6027\u5f88\u6709\u53ef\u80fd\u4f1a\u8986\u76d6\u539f\u6709\u7684\u5c5e\u6027\uff0c\u800c\u4f7f\u7528 Symbol \u5c31\u7b97\u5c5e\u6027\u540d\u76f8\u540c\u4e5f\u4e0d\u4f1a\uff1a<\/p>\n<pre class=\"line-numbers\"><code class=\"language-plain_text\">let id = Symbol(&quot;id&quot;);\n\npeople[id] = &quot;\u65b0\u589e\u503c&quot;;\n<\/code><\/pre>\n<h3><a id=\"%E5%85%A8%E5%B1%80%E7%AC%A6%E5%8F%B7%E6%B3%A8%E5%86%8C%E8%A1%A8\" class=\"anchor\" aria-hidden=\"true\"><span class=\"octicon octicon-link\"><\/span><\/a>\u5168\u5c40\u7b26\u53f7\u6ce8\u518c\u8868<\/h3>\n<p>Symbol \u6bcf\u6b21\u521b\u5efa\u90fd\u662f\u552f\u4e00\u7684\uff0c\u90a3\u5982\u4f55\u590d\u7528\u5462\uff1f Symbol.for \u5c31\u89e3\u51b3\u4e86\u5171\u4eab\u548c\u91cd\u7528\u95ee\u9898\u3002<\/p>\n<pre class=\"line-numbers\"><code class=\"language-plain_text\">let name = Symbol.for('name') \/\/ \u7b2c\u4e00\u6b21\u65f6\u5168\u5c40\u6ce8\u518c\u8868\u4e0d\u5b58\u5728\u5219\u521b\u5efa\u5e76\u6dfb\u52a0\u5230\u6ce8\u518c\u8868\u4e2d\u3002\n\nlet otherName = Symbol.for('name') \/\/ \u540e\u7eed\u4f7f\u7528\u76f8\u540c\u5b57\u7b26\u4e32\uff0c\u5148\u68c0\u7d22\u5168\u5c40\u6ce8\u518c\u8868\u6709\u5c31\u8fd4\u56de\uff0c\u53cd\u4e4b\u521b\u5efa\u3002\n\nname == otherName \/\/ true\n<\/code><\/pre>\n<p>\u6211\u4eec\u53ef\u4ee5\u901a\u8fc7 Symbol.keyFor \u6765\u53cd\u67e5\u5b57\u7b26\u4e32\u952e\uff1a<\/p>\n<pre class=\"line-numbers\"><code class=\"language-plain_text\">let name = Symbol.for('name')\nSymbol.keyFor(name) \/\/ 'name'\n<\/code><\/pre>\n<p>\u4f7f\u7528\u666e\u901a\u7b26\u53f7\uff1a<\/p>\n<pre class=\"line-numbers\"><code class=\"language-plain_text\">let name = Symbol('name')\nSymbol.keyFor(name) \/\/ undefined\n<\/code><\/pre>\n<h3><a id=\"%E5%AF%B9%E8%B1%A1%E5%B1%9E%E6%80%A7%E9%81%8D%E5%8E%86\" class=\"anchor\" aria-hidden=\"true\"><span class=\"octicon octicon-link\"><\/span><\/a>\u5bf9\u8c61\u5c5e\u6027\u904d\u5386<\/h3>\n<p>for&#8230;in \u4f1a\u5ffd\u7565 Symbol\uff1a<\/p>\n<pre class=\"line-numbers\"><code class=\"language-plain_text\">let id = Symbol(&quot;id&quot;);\nlet user = {\n  name: &quot;John&quot;,\n  age: 30,\n  [id]: 123\n};\n\nfor (let key in user) alert(key); \/\/ name, age (no symbols)\nObject.keys(usr) \/\/ ['name','age']\nObject.getOwnPropertyNames(user) \/\/ ['name','age']\nObject.getOwnPropertySymbols(user) \/\/ [Symbol(id)]\n\n\nlet clone = Object.assign({}, user);\nclone[id] \/\/ 123\n\n\n<\/code><\/pre>\n<p>\u53c2\u8003\uff1a<\/p>\n<ol>\n<li><a href=\"https:\/\/javascript.info\/symbol\" target=\"_blank\" rel=\"noopener\">https:\/\/javascript.info\/symbol<\/a><\/li>\n<li><a href=\"https:\/\/exploringjs.com\/es6\/ch_symbols.html\" target=\"_blank\" rel=\"noopener\">https:\/\/exploringjs.com\/es6\/ch_symbols.html<\/a><\/li>\n<\/ol>\n","protected":false},"excerpt":{"rendered":"<p>\u662f\u4ec0\u4e48\uff1f Symbol \u662f ES6 \u65b0\u589e\u7684\u57fa\u672c\u6570\u636e\u7c7b\u578b&#8211;\u7b26\u53f7\uff0c\u5b83\u5177\u6709\u552f\u4e00\u6027\u3001\u4e0d\u53ef\u53d8\u6027\u3002\u56e0&#46;&#46;&#46;<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[2,20,3],"tags":[6,89],"class_list":["post-1204","post","type-post","status-publish","format-standard","hentry","category-all","category-frontend","category-tech","tag-javascript","tag-symbol"],"_links":{"self":[{"href":"https:\/\/zhuxinyong.com\/index.php?rest_route=\/wp\/v2\/posts\/1204","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/zhuxinyong.com\/index.php?rest_route=\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/zhuxinyong.com\/index.php?rest_route=\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/zhuxinyong.com\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/zhuxinyong.com\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=1204"}],"version-history":[{"count":2,"href":"https:\/\/zhuxinyong.com\/index.php?rest_route=\/wp\/v2\/posts\/1204\/revisions"}],"predecessor-version":[{"id":1206,"href":"https:\/\/zhuxinyong.com\/index.php?rest_route=\/wp\/v2\/posts\/1204\/revisions\/1206"}],"wp:attachment":[{"href":"https:\/\/zhuxinyong.com\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=1204"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/zhuxinyong.com\/index.php?rest_route=%2Fwp%2Fv2%2Fcategories&post=1204"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/zhuxinyong.com\/index.php?rest_route=%2Fwp%2Fv2%2Ftags&post=1204"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}