[{"data":1,"prerenderedAt":2111},["ShallowReactive",2],{"doc-\u002Fdocs\u002Fes6-basics":3,"docs-all":1936},{"id":4,"title":5,"body":6,"category":1922,"date":1923,"description":1924,"draft":1925,"extension":1926,"meta":1927,"navigation":298,"path":24,"seo":1928,"source":1929,"stem":1930,"tags":1931,"__hash__":1935},"docs\u002Fdocs\u002Fes6-basics.md","ES6 基础：作用域、解构与模板字符串",{"type":7,"value":8,"toc":1909},"minimark",[9,14,18,53,58,69,170,174,188,387,390,408,496,502,510,514,519,625,629,704,718,725,816,819,822,1092,1107,1110,1113,1254,1263,1404,1419,1422,1577,1580,1583,1767,1770,1773,1780,1870,1873,1905],[10,11,13],"h1",{"id":12},"es6-基础","ES6 基础",[15,16,17],"p",{},"ES6 即 ES2015。本系列也收录课程中讲到的后续标准特性，并在对应位置标明。各代码块是独立示例，运行时不要把同名变量的片段直接拼在一起。",[15,19,20,21,26,27,26,31,26,35,26,39,26,43,47,48,52],{},"学习顺序：",[22,23,25],"a",{"href":24},"\u002Fdocs\u002Fes6-basics","基础"," → ",[22,28,30],{"href":29},"\u002Fdocs\u002Fes6-arrays-objects","数组与对象",[22,32,34],{"href":33},"\u002Fdocs\u002Fes6-functions-classes","函数与类",[22,36,38],{"href":37},"\u002Fdocs\u002Fjs-promise-async","异步编程",[22,40,42],{"href":41},"\u002Fdocs\u002Fjs-proxy-reflect","Proxy 与 Reflect",[22,44,46],{"href":45},"\u002Fdocs\u002Fjs-module-systems","模块化","。转译工具另见 ",[22,49,51],{"href":50},"\u002Fdocs\u002Fbabel-basics","Babel","。",[54,55,57],"h2",{"id":56},"let-与块级作用域","let 与块级作用域",[15,59,60,64,65,68],{},[61,62,63],"code",{},"let"," 声明的变量受所在词法作用域约束。块语句、循环等可以引入块级作用域；对象字面量中的 ",[61,66,67],{},"{}"," 不是块语句，不能简单理解为“出现大括号就有新作用域”。",[70,71,76],"pre",{"className":72,"code":73,"language":74,"meta":75,"style":75},"language-js shiki shiki-themes github-light github-dark","let outer = 12;\n{\n  let inner = 13;\n  console.log(outer + inner); \u002F\u002F 25\n}\nconsole.log(typeof inner); \u002F\u002F undefined：块外没有这个绑定\n","js","",[61,77,78,100,106,122,145,151],{"__ignoreMap":75},[79,80,83,86,90,93,97],"span",{"class":81,"line":82},"line",1,[79,84,63],{"class":85},"szBVR",[79,87,89],{"class":88},"sVt8B"," outer ",[79,91,92],{"class":85},"=",[79,94,96],{"class":95},"sj4cs"," 12",[79,98,99],{"class":88},";\n",[79,101,103],{"class":81,"line":102},2,[79,104,105],{"class":88},"{\n",[79,107,109,112,115,117,120],{"class":81,"line":108},3,[79,110,111],{"class":85},"  let",[79,113,114],{"class":88}," inner ",[79,116,92],{"class":85},[79,118,119],{"class":95}," 13",[79,121,99],{"class":88},[79,123,125,128,132,135,138,141],{"class":81,"line":124},4,[79,126,127],{"class":88},"  console.",[79,129,131],{"class":130},"sScJk","log",[79,133,134],{"class":88},"(outer ",[79,136,137],{"class":85},"+",[79,139,140],{"class":88}," inner); ",[79,142,144],{"class":143},"sJ8bj","\u002F\u002F 25\n",[79,146,148],{"class":81,"line":147},5,[79,149,150],{"class":88},"}\n",[79,152,154,157,159,162,165,167],{"class":81,"line":153},6,[79,155,156],{"class":88},"console.",[79,158,131],{"class":130},[79,160,161],{"class":88},"(",[79,163,164],{"class":85},"typeof",[79,166,140],{"class":88},[79,168,169],{"class":143},"\u002F\u002F undefined：块外没有这个绑定\n",[171,172,173],"h3",{"id":173},"循环中的闭包",[15,175,176,179,180,182,183,185,186,52],{},[61,177,178],{},"var"," 循环复用同一个变量；",[61,181,63],{}," 循环会为每次迭代建立相应绑定。原课程用 IIFE 保存 ",[61,184,178],{}," 的当前值，ES6 可以直接用 ",[61,187,63],{},[70,189,191],{"className":72,"code":190,"language":74,"meta":75,"style":75},"const shared = [];\nfor (var i = 1; i \u003C= 3; i++) {\n  shared.push(() => i);\n}\nconsole.log(shared.map(fn => fn())); \u002F\u002F [4, 4, 4]\n\nconst separate = [];\nfor (let k = 1; k \u003C= 3; k++) {\n  separate.push(() => k);\n}\nconsole.log(separate.map(fn => fn())); \u002F\u002F [1, 2, 3]\n",[61,192,193,207,243,260,264,294,300,312,342,357,362],{"__ignoreMap":75},[79,194,195,198,201,204],{"class":81,"line":82},[79,196,197],{"class":85},"const",[79,199,200],{"class":95}," shared",[79,202,203],{"class":85}," =",[79,205,206],{"class":88}," [];\n",[79,208,209,212,215,217,220,222,225,228,231,234,237,240],{"class":81,"line":102},[79,210,211],{"class":85},"for",[79,213,214],{"class":88}," (",[79,216,178],{"class":85},[79,218,219],{"class":88}," i ",[79,221,92],{"class":85},[79,223,224],{"class":95}," 1",[79,226,227],{"class":88},"; i ",[79,229,230],{"class":85},"\u003C=",[79,232,233],{"class":95}," 3",[79,235,236],{"class":88},"; i",[79,238,239],{"class":85},"++",[79,241,242],{"class":88},") {\n",[79,244,245,248,251,254,257],{"class":81,"line":108},[79,246,247],{"class":88},"  shared.",[79,249,250],{"class":130},"push",[79,252,253],{"class":88},"(() ",[79,255,256],{"class":85},"=>",[79,258,259],{"class":88}," i);\n",[79,261,262],{"class":81,"line":124},[79,263,150],{"class":88},[79,265,266,268,270,273,276,278,282,285,288,291],{"class":81,"line":147},[79,267,156],{"class":88},[79,269,131],{"class":130},[79,271,272],{"class":88},"(shared.",[79,274,275],{"class":130},"map",[79,277,161],{"class":88},[79,279,281],{"class":280},"s4XuR","fn",[79,283,284],{"class":85}," =>",[79,286,287],{"class":130}," fn",[79,289,290],{"class":88},"())); ",[79,292,293],{"class":143},"\u002F\u002F [4, 4, 4]\n",[79,295,296],{"class":81,"line":153},[79,297,299],{"emptyLinePlaceholder":298},true,"\n",[79,301,303,305,308,310],{"class":81,"line":302},7,[79,304,197],{"class":85},[79,306,307],{"class":95}," separate",[79,309,203],{"class":85},[79,311,206],{"class":88},[79,313,315,317,319,321,324,326,328,331,333,335,338,340],{"class":81,"line":314},8,[79,316,211],{"class":85},[79,318,214],{"class":88},[79,320,63],{"class":85},[79,322,323],{"class":88}," k ",[79,325,92],{"class":85},[79,327,224],{"class":95},[79,329,330],{"class":88},"; k ",[79,332,230],{"class":85},[79,334,233],{"class":95},[79,336,337],{"class":88},"; k",[79,339,239],{"class":85},[79,341,242],{"class":88},[79,343,345,348,350,352,354],{"class":81,"line":344},9,[79,346,347],{"class":88},"  separate.",[79,349,250],{"class":130},[79,351,253],{"class":88},[79,353,256],{"class":85},[79,355,356],{"class":88}," k);\n",[79,358,360],{"class":81,"line":359},10,[79,361,150],{"class":88},[79,363,365,367,369,372,374,376,378,380,382,384],{"class":81,"line":364},11,[79,366,156],{"class":88},[79,368,131],{"class":130},[79,370,371],{"class":88},"(separate.",[79,373,275],{"class":130},[79,375,161],{"class":88},[79,377,281],{"class":280},[79,379,284],{"class":85},[79,381,287],{"class":130},[79,383,290],{"class":88},[79,385,386],{"class":143},"\u002F\u002F [1, 2, 3]\n",[171,388,389],{"id":389},"暂时性死区与重复声明",[15,391,392,394,395,398,399,401,402,404,405,52],{},[61,393,63],{}," 绑定在进入作用域时已经存在，但执行到声明之前尚未初始化，这一段称为暂时性死区（TDZ）。访问它会抛出 ",[61,396,397],{},"ReferenceError","，包括对该绑定使用 ",[61,400,164],{},"。课程中“不存在变量提升”的说法，实际强调的是不能像 ",[61,403,178],{}," 那样在声明前读到 ",[61,406,407],{},"undefined",[70,409,411],{"className":72,"code":410,"language":74,"meta":75,"style":75},"let count = 1;\ntry {\n  console.log(count); \u002F\u002F 访问的是下面的局部绑定，不是外层 count\n  let count = 3;\n} catch (error) {\n  console.log(error.name); \u002F\u002F ReferenceError\n}\nconsole.log(count); \u002F\u002F 1\n",[61,412,413,426,434,446,458,469,481,485],{"__ignoreMap":75},[79,414,415,417,420,422,424],{"class":81,"line":82},[79,416,63],{"class":85},[79,418,419],{"class":88}," count ",[79,421,92],{"class":85},[79,423,224],{"class":95},[79,425,99],{"class":88},[79,427,428,431],{"class":81,"line":102},[79,429,430],{"class":85},"try",[79,432,433],{"class":88}," {\n",[79,435,436,438,440,443],{"class":81,"line":108},[79,437,127],{"class":88},[79,439,131],{"class":130},[79,441,442],{"class":88},"(count); ",[79,444,445],{"class":143},"\u002F\u002F 访问的是下面的局部绑定，不是外层 count\n",[79,447,448,450,452,454,456],{"class":81,"line":124},[79,449,111],{"class":85},[79,451,419],{"class":88},[79,453,92],{"class":85},[79,455,233],{"class":95},[79,457,99],{"class":88},[79,459,460,463,466],{"class":81,"line":147},[79,461,462],{"class":88},"} ",[79,464,465],{"class":85},"catch",[79,467,468],{"class":88}," (error) {\n",[79,470,471,473,475,478],{"class":81,"line":153},[79,472,127],{"class":88},[79,474,131],{"class":130},[79,476,477],{"class":88},"(error.name); ",[79,479,480],{"class":143},"\u002F\u002F ReferenceError\n",[79,482,483],{"class":81,"line":302},[79,484,150],{"class":88},[79,486,487,489,491,493],{"class":81,"line":314},[79,488,156],{"class":88},[79,490,131],{"class":130},[79,492,442],{"class":88},[79,494,495],{"class":143},"\u002F\u002F 1\n",[15,497,498,499,501],{},"同一作用域中重复声明同名 ",[61,500,63],{}," 会产生语法错误；内层作用域可以声明同名变量。下面是故意报错的反例，不能作为正常脚本运行：",[70,503,508],{"className":504,"code":506,"language":507,"meta":75},[505],"language-text","let value = 1;\nlet value = 2; \u002F\u002F SyntaxError\n","text",[61,509,506],{"__ignoreMap":75},[54,511,513],{"id":512},"const-固定绑定","const 固定绑定",[15,515,516,518],{},[61,517,197],{}," 具备块级作用域、TDZ 和不能重复声明的特点，普通声明时必须初始化。它禁止重新赋值，但不会冻结对象内部数据。",[70,520,522],{"className":72,"code":521,"language":74,"meta":75,"style":75},"const user = { name: 'kevin' };\nuser.name = 'lily';\nuser.age = 12;\nconsole.log(user); \u002F\u002F { name: 'lily', age: 12 }\n\ntry {\n  user = { name: 'lucy' };\n} catch (error) {\n  console.log(error.name); \u002F\u002F TypeError\n}\n",[61,523,524,543,555,566,578,582,588,602,610,621],{"__ignoreMap":75},[79,525,526,528,531,533,536,540],{"class":81,"line":82},[79,527,197],{"class":85},[79,529,530],{"class":95}," user",[79,532,203],{"class":85},[79,534,535],{"class":88}," { name: ",[79,537,539],{"class":538},"sZZnC","'kevin'",[79,541,542],{"class":88}," };\n",[79,544,545,548,550,553],{"class":81,"line":102},[79,546,547],{"class":88},"user.name ",[79,549,92],{"class":85},[79,551,552],{"class":538}," 'lily'",[79,554,99],{"class":88},[79,556,557,560,562,564],{"class":81,"line":108},[79,558,559],{"class":88},"user.age ",[79,561,92],{"class":85},[79,563,96],{"class":95},[79,565,99],{"class":88},[79,567,568,570,572,575],{"class":81,"line":124},[79,569,156],{"class":88},[79,571,131],{"class":130},[79,573,574],{"class":88},"(user); ",[79,576,577],{"class":143},"\u002F\u002F { name: 'lily', age: 12 }\n",[79,579,580],{"class":81,"line":147},[79,581,299],{"emptyLinePlaceholder":298},[79,583,584,586],{"class":81,"line":153},[79,585,430],{"class":85},[79,587,433],{"class":88},[79,589,590,593,595,597,600],{"class":81,"line":302},[79,591,592],{"class":88},"  user ",[79,594,92],{"class":85},[79,596,535],{"class":88},[79,598,599],{"class":538},"'lucy'",[79,601,542],{"class":88},[79,603,604,606,608],{"class":81,"line":314},[79,605,462],{"class":88},[79,607,465],{"class":85},[79,609,468],{"class":88},[79,611,612,614,616,618],{"class":81,"line":344},[79,613,127],{"class":88},[79,615,131],{"class":130},[79,617,477],{"class":88},[79,619,620],{"class":143},"\u002F\u002F TypeError\n",[79,622,623],{"class":81,"line":359},[79,624,150],{"class":88},[54,626,628],{"id":627},"全局对象与-this","全局对象与 this",[630,631,632,645],"table",{},[633,634,635],"thead",{},[636,637,638,642],"tr",{},[639,640,641],"th",{},"环境",[639,643,644],{},"顶层绑定与 this",[646,647,648,676,690],"tbody",{},[636,649,650,657],{},[651,652,653,654],"td",{},"浏览器经典 ",[61,655,656],{},"\u003Cscript>",[651,658,659,660,662,663,666,667,669,670,669,672,675],{},"顶层 ",[61,661,178],{},"、函数声明通常关联 ",[61,664,665],{},"window"," 属性；",[61,668,63],{},"、",[61,671,197],{},[61,673,674],{},"class"," 不会以此方式创建属性",[636,677,678,681],{},[651,679,680],{},"浏览器或 Node 的 ES Module",[651,682,683,684,687,688],{},"顶层声明属于模块作用域，顶层 ",[61,685,686],{},"this"," 是 ",[61,689,407],{},[636,691,692,695],{},[651,693,694],{},"Node CommonJS 模块",[651,696,697,698,700,701],{},"顶层变量属于模块；顶层 ",[61,699,686],{}," 初始为 ",[61,702,703],{},"module.exports",[15,705,706,709,710,712,713,715,716,52],{},[61,707,708],{},"globalThis"," 提供跨环境访问全局对象的名称，属于 ES2020。普通函数直接调用时，非严格模式的 ",[61,711,686],{}," 通常为全局对象，严格模式为 ",[61,714,407],{},"；对象方法调用、显式绑定和箭头函数另有规则，见 ",[22,717,34],{"href":33},[15,719,720,721,724],{},"浏览器经典脚本示例（不要改为 ",[61,722,723],{},"type=\"module\""," 后仍期待相同结果）：",[70,726,730],{"className":727,"code":728,"language":729,"meta":75,"style":75},"language-html shiki shiki-themes github-light github-dark","\u003Cscript>\n  var courseGlobalA = 1;\n  let courseGlobalB = 2;\n  console.log(window.courseGlobalA); \u002F\u002F 1\n  console.log(window.courseGlobalB); \u002F\u002F undefined\n  console.log(courseGlobalB); \u002F\u002F 2\n\u003C\u002Fscript>\n","html",[61,731,732,744,758,772,783,795,807],{"__ignoreMap":75},[79,733,734,737,741],{"class":81,"line":82},[79,735,736],{"class":88},"\u003C",[79,738,740],{"class":739},"s9eBZ","script",[79,742,743],{"class":88},">\n",[79,745,746,749,752,754,756],{"class":81,"line":102},[79,747,748],{"class":85},"  var",[79,750,751],{"class":88}," courseGlobalA ",[79,753,92],{"class":85},[79,755,224],{"class":95},[79,757,99],{"class":88},[79,759,760,762,765,767,770],{"class":81,"line":108},[79,761,111],{"class":85},[79,763,764],{"class":88}," courseGlobalB ",[79,766,92],{"class":85},[79,768,769],{"class":95}," 2",[79,771,99],{"class":88},[79,773,774,776,778,781],{"class":81,"line":124},[79,775,127],{"class":88},[79,777,131],{"class":130},[79,779,780],{"class":88},"(window.courseGlobalA); ",[79,782,495],{"class":143},[79,784,785,787,789,792],{"class":81,"line":147},[79,786,127],{"class":88},[79,788,131],{"class":130},[79,790,791],{"class":88},"(window.courseGlobalB); ",[79,793,794],{"class":143},"\u002F\u002F undefined\n",[79,796,797,799,801,804],{"class":81,"line":153},[79,798,127],{"class":88},[79,800,131],{"class":130},[79,802,803],{"class":88},"(courseGlobalB); ",[79,805,806],{"class":143},"\u002F\u002F 2\n",[79,808,809,812,814],{"class":81,"line":302},[79,810,811],{"class":88},"\u003C\u002F",[79,813,740],{"class":739},[79,815,743],{"class":88},[54,817,818],{"id":818},"数组解构",[15,820,821],{},"数组解构按迭代顺序取值，可以跳过元素、匹配嵌套数组、设置默认值和收集剩余项。",[70,823,825],{"className":72,"code":824,"language":74,"meta":75,"style":75},"const [first, , third] = [1, 2, 3];\nconsole.log(first, third); \u002F\u002F 1 3\n\nconst [, [, value3, [, value5, , [, , value9, [value10]]]]] =\n  [1, [2, 3, [4, 5, 6, [7, 8, 9, [10]]]]];\nconsole.log(value3, value5, value9, value10); \u002F\u002F 3 5 9 10\n\nconst [head, ...tail] = [1, 2, 3, 4];\nconsole.log(head, tail); \u002F\u002F 1 [2, 3, 4]\n\nconst [fallback = 2, explicitNull = 9] = [undefined, null];\nconsole.log(fallback, explicitNull); \u002F\u002F 2 null\n",[61,826,827,867,879,883,917,970,982,986,1025,1037,1041,1079],{"__ignoreMap":75},[79,828,829,831,834,837,840,843,846,848,850,853,856,859,861,864],{"class":81,"line":82},[79,830,197],{"class":85},[79,832,833],{"class":88}," [",[79,835,836],{"class":95},"first",[79,838,839],{"class":88},", , ",[79,841,842],{"class":95},"third",[79,844,845],{"class":88},"] ",[79,847,92],{"class":85},[79,849,833],{"class":88},[79,851,852],{"class":95},"1",[79,854,855],{"class":88},", ",[79,857,858],{"class":95},"2",[79,860,855],{"class":88},[79,862,863],{"class":95},"3",[79,865,866],{"class":88},"];\n",[79,868,869,871,873,876],{"class":81,"line":102},[79,870,156],{"class":88},[79,872,131],{"class":130},[79,874,875],{"class":88},"(first, third); ",[79,877,878],{"class":143},"\u002F\u002F 1 3\n",[79,880,881],{"class":81,"line":108},[79,882,299],{"emptyLinePlaceholder":298},[79,884,885,887,890,893,896,899,902,905,908,911,914],{"class":81,"line":124},[79,886,197],{"class":85},[79,888,889],{"class":88}," [, [, ",[79,891,892],{"class":95},"value3",[79,894,895],{"class":88},", [, ",[79,897,898],{"class":95},"value5",[79,900,901],{"class":88},", , [, , ",[79,903,904],{"class":95},"value9",[79,906,907],{"class":88},", [",[79,909,910],{"class":95},"value10",[79,912,913],{"class":88},"]]]]] ",[79,915,916],{"class":85},"=\n",[79,918,919,922,924,926,928,930,932,934,937,939,942,944,947,949,952,954,957,959,962,964,967],{"class":81,"line":147},[79,920,921],{"class":88},"  [",[79,923,852],{"class":95},[79,925,907],{"class":88},[79,927,858],{"class":95},[79,929,855],{"class":88},[79,931,863],{"class":95},[79,933,907],{"class":88},[79,935,936],{"class":95},"4",[79,938,855],{"class":88},[79,940,941],{"class":95},"5",[79,943,855],{"class":88},[79,945,946],{"class":95},"6",[79,948,907],{"class":88},[79,950,951],{"class":95},"7",[79,953,855],{"class":88},[79,955,956],{"class":95},"8",[79,958,855],{"class":88},[79,960,961],{"class":95},"9",[79,963,907],{"class":88},[79,965,966],{"class":95},"10",[79,968,969],{"class":88},"]]]]];\n",[79,971,972,974,976,979],{"class":81,"line":153},[79,973,156],{"class":88},[79,975,131],{"class":130},[79,977,978],{"class":88},"(value3, value5, value9, value10); ",[79,980,981],{"class":143},"\u002F\u002F 3 5 9 10\n",[79,983,984],{"class":81,"line":302},[79,985,299],{"emptyLinePlaceholder":298},[79,987,988,990,992,995,997,1000,1003,1005,1007,1009,1011,1013,1015,1017,1019,1021,1023],{"class":81,"line":314},[79,989,197],{"class":85},[79,991,833],{"class":88},[79,993,994],{"class":95},"head",[79,996,855],{"class":88},[79,998,999],{"class":85},"...",[79,1001,1002],{"class":95},"tail",[79,1004,845],{"class":88},[79,1006,92],{"class":85},[79,1008,833],{"class":88},[79,1010,852],{"class":95},[79,1012,855],{"class":88},[79,1014,858],{"class":95},[79,1016,855],{"class":88},[79,1018,863],{"class":95},[79,1020,855],{"class":88},[79,1022,936],{"class":95},[79,1024,866],{"class":88},[79,1026,1027,1029,1031,1034],{"class":81,"line":344},[79,1028,156],{"class":88},[79,1030,131],{"class":130},[79,1032,1033],{"class":88},"(head, tail); ",[79,1035,1036],{"class":143},"\u002F\u002F 1 [2, 3, 4]\n",[79,1038,1039],{"class":81,"line":359},[79,1040,299],{"emptyLinePlaceholder":298},[79,1042,1043,1045,1047,1050,1052,1054,1056,1059,1061,1064,1066,1068,1070,1072,1074,1077],{"class":81,"line":364},[79,1044,197],{"class":85},[79,1046,833],{"class":88},[79,1048,1049],{"class":95},"fallback",[79,1051,203],{"class":85},[79,1053,769],{"class":95},[79,1055,855],{"class":88},[79,1057,1058],{"class":95},"explicitNull",[79,1060,203],{"class":85},[79,1062,1063],{"class":95}," 9",[79,1065,845],{"class":88},[79,1067,92],{"class":85},[79,1069,833],{"class":88},[79,1071,407],{"class":95},[79,1073,855],{"class":88},[79,1075,1076],{"class":95},"null",[79,1078,866],{"class":88},[79,1080,1082,1084,1086,1089],{"class":81,"line":1081},12,[79,1083,156],{"class":88},[79,1085,131],{"class":130},[79,1087,1088],{"class":88},"(fallback, explicitNull); ",[79,1090,1091],{"class":143},"\u002F\u002F 2 null\n",[15,1093,1094,1095,1097,1098,669,1100,669,1103,1106],{},"默认值只在值为 ",[61,1096,407],{}," 时生效，",[61,1099,1076],{},[61,1101,1102],{},"0",[61,1104,1105],{},"false"," 不会触发默认值。过深的嵌套适合练习匹配规则，实际代码可分步取值以便阅读。",[54,1108,1109],{"id":1109},"对象解构",[15,1111,1112],{},"对象解构按属性名匹配，与属性顺序无关；冒号既能引入新变量名，也能继续描述嵌套结构。",[70,1114,1116],{"className":72,"code":1115,"language":74,"meta":75,"style":75},"const user = {\n  uname: 'kevin',\n  friends: { 1: { uname: 'lily' }, 2: { uname: 'lucy' } }\n};\nconst {\n  uname: owner,\n  friends: { 1: { uname: firstFriend }, 2: { uname: secondFriend } },\n  age = 12\n} = user;\nconsole.log(owner, firstFriend, secondFriend, age); \u002F\u002F kevin lily lucy 12\n",[61,1117,1118,1128,1138,1163,1168,1174,1187,1223,1233,1242],{"__ignoreMap":75},[79,1119,1120,1122,1124,1126],{"class":81,"line":82},[79,1121,197],{"class":85},[79,1123,530],{"class":95},[79,1125,203],{"class":85},[79,1127,433],{"class":88},[79,1129,1130,1133,1135],{"class":81,"line":102},[79,1131,1132],{"class":88},"  uname: ",[79,1134,539],{"class":538},[79,1136,1137],{"class":88},",\n",[79,1139,1140,1143,1145,1148,1151,1154,1156,1158,1160],{"class":81,"line":108},[79,1141,1142],{"class":88},"  friends: { ",[79,1144,852],{"class":95},[79,1146,1147],{"class":88},": { uname: ",[79,1149,1150],{"class":538},"'lily'",[79,1152,1153],{"class":88}," }, ",[79,1155,858],{"class":95},[79,1157,1147],{"class":88},[79,1159,599],{"class":538},[79,1161,1162],{"class":88}," } }\n",[79,1164,1165],{"class":81,"line":124},[79,1166,1167],{"class":88},"};\n",[79,1169,1170,1172],{"class":81,"line":147},[79,1171,197],{"class":85},[79,1173,433],{"class":88},[79,1175,1176,1179,1182,1185],{"class":81,"line":153},[79,1177,1178],{"class":280},"  uname",[79,1180,1181],{"class":88},": ",[79,1183,1184],{"class":95},"owner",[79,1186,1137],{"class":88},[79,1188,1189,1192,1195,1197,1199,1202,1204,1207,1209,1211,1213,1215,1217,1220],{"class":81,"line":302},[79,1190,1191],{"class":280},"  friends",[79,1193,1194],{"class":88},": { ",[79,1196,852],{"class":95},[79,1198,1194],{"class":88},[79,1200,1201],{"class":280},"uname",[79,1203,1181],{"class":88},[79,1205,1206],{"class":95},"firstFriend",[79,1208,1153],{"class":88},[79,1210,858],{"class":95},[79,1212,1194],{"class":88},[79,1214,1201],{"class":280},[79,1216,1181],{"class":88},[79,1218,1219],{"class":95},"secondFriend",[79,1221,1222],{"class":88}," } },\n",[79,1224,1225,1228,1230],{"class":81,"line":314},[79,1226,1227],{"class":95},"  age",[79,1229,203],{"class":85},[79,1231,1232],{"class":95}," 12\n",[79,1234,1235,1237,1239],{"class":81,"line":344},[79,1236,462],{"class":88},[79,1238,92],{"class":85},[79,1240,1241],{"class":88}," user;\n",[79,1243,1244,1246,1248,1251],{"class":81,"line":359},[79,1245,156],{"class":88},[79,1247,131],{"class":130},[79,1249,1250],{"class":88},"(owner, firstFriend, secondFriend, age); ",[79,1252,1253],{"class":143},"\u002F\u002F kevin lily lucy 12\n",[15,1255,1256,1257,1260,1261,52],{},"这里的 ",[61,1258,1259],{},"friends"," 是匹配路径，不会自动创建同名变量；若同时需要整个对象，再写一项 ",[61,1262,1259],{},[70,1264,1266],{"className":72,"code":1265,"language":74,"meta":75,"style":75},"const source = { info: { tel: '123', address: '上海' } };\nconst { info, info: { tel: phone, address } } = source;\nconsole.log(info.tel === phone, address); \u002F\u002F true 上海\n\nconst { a = 2, ...rest } = { a: 1, b: 2, c: 3 };\nconsole.log(a, rest); \u002F\u002F 1 { b: 2, c: 3 }\n",[61,1267,1268,1292,1329,1347,1351,1392],{"__ignoreMap":75},[79,1269,1270,1272,1275,1277,1280,1283,1286,1289],{"class":81,"line":82},[79,1271,197],{"class":85},[79,1273,1274],{"class":95}," source",[79,1276,203],{"class":85},[79,1278,1279],{"class":88}," { info: { tel: ",[79,1281,1282],{"class":538},"'123'",[79,1284,1285],{"class":88},", address: ",[79,1287,1288],{"class":538},"'上海'",[79,1290,1291],{"class":88}," } };\n",[79,1293,1294,1296,1299,1302,1304,1306,1308,1311,1313,1316,1318,1321,1324,1326],{"class":81,"line":102},[79,1295,197],{"class":85},[79,1297,1298],{"class":88}," { ",[79,1300,1301],{"class":95},"info",[79,1303,855],{"class":88},[79,1305,1301],{"class":280},[79,1307,1194],{"class":88},[79,1309,1310],{"class":280},"tel",[79,1312,1181],{"class":88},[79,1314,1315],{"class":95},"phone",[79,1317,855],{"class":88},[79,1319,1320],{"class":95},"address",[79,1322,1323],{"class":88}," } } ",[79,1325,92],{"class":85},[79,1327,1328],{"class":88}," source;\n",[79,1330,1331,1333,1335,1338,1341,1344],{"class":81,"line":108},[79,1332,156],{"class":88},[79,1334,131],{"class":130},[79,1336,1337],{"class":88},"(info.tel ",[79,1339,1340],{"class":85},"===",[79,1342,1343],{"class":88}," phone, address); ",[79,1345,1346],{"class":143},"\u002F\u002F true 上海\n",[79,1348,1349],{"class":81,"line":124},[79,1350,299],{"emptyLinePlaceholder":298},[79,1352,1353,1355,1357,1359,1361,1363,1365,1367,1370,1373,1375,1378,1380,1383,1385,1388,1390],{"class":81,"line":147},[79,1354,197],{"class":85},[79,1356,1298],{"class":88},[79,1358,22],{"class":95},[79,1360,203],{"class":85},[79,1362,769],{"class":95},[79,1364,855],{"class":88},[79,1366,999],{"class":85},[79,1368,1369],{"class":95},"rest",[79,1371,1372],{"class":88}," } ",[79,1374,92],{"class":85},[79,1376,1377],{"class":88}," { a: ",[79,1379,852],{"class":95},[79,1381,1382],{"class":88},", b: ",[79,1384,858],{"class":95},[79,1386,1387],{"class":88},", c: ",[79,1389,863],{"class":95},[79,1391,542],{"class":88},[79,1393,1394,1396,1398,1401],{"class":81,"line":153},[79,1395,156],{"class":88},[79,1397,131],{"class":130},[79,1399,1400],{"class":88},"(a, rest); ",[79,1402,1403],{"class":143},"\u002F\u002F 1 { b: 2, c: 3 }\n",[15,1405,1406,1407,1410,1411,1413,1414,1416,1417,52],{},"对象剩余属性 ",[61,1408,1409],{},"...rest"," 属于 ES2018，它收集未匹配的自身可枚举属性。对 ",[61,1412,1076],{}," 或 ",[61,1415,407],{}," 直接做对象解构会抛错；外层默认值只能处理 ",[61,1418,407],{},[15,1420,1421],{},"课程中的电脑部件练习，归纳为相同属性名在不同层级的重命名：",[70,1423,1425],{"className":72,"code":1424,"language":74,"meta":75,"style":75},"const computer = {\n  name: '电脑',\n  main: [{ name: '电源' }, { name: 'CPU' }],\n  accessories: [{ name: '键盘' }, { name: '鼠标' }]\n};\nconst {\n  name: device,\n  main: [{ name: power }, { name: cpu }],\n  accessories: [{ name: keyboard }, { name: mouse }]\n} = computer;\nconsole.log(device, power, cpu, keyboard, mouse); \u002F\u002F 电脑 电源 CPU 键盘 鼠标\n",[61,1426,1427,1438,1448,1465,1481,1485,1491,1503,1531,1556,1565],{"__ignoreMap":75},[79,1428,1429,1431,1434,1436],{"class":81,"line":82},[79,1430,197],{"class":85},[79,1432,1433],{"class":95}," computer",[79,1435,203],{"class":85},[79,1437,433],{"class":88},[79,1439,1440,1443,1446],{"class":81,"line":102},[79,1441,1442],{"class":88},"  name: ",[79,1444,1445],{"class":538},"'电脑'",[79,1447,1137],{"class":88},[79,1449,1450,1453,1456,1459,1462],{"class":81,"line":108},[79,1451,1452],{"class":88},"  main: [{ name: ",[79,1454,1455],{"class":538},"'电源'",[79,1457,1458],{"class":88}," }, { name: ",[79,1460,1461],{"class":538},"'CPU'",[79,1463,1464],{"class":88}," }],\n",[79,1466,1467,1470,1473,1475,1478],{"class":81,"line":124},[79,1468,1469],{"class":88},"  accessories: [{ name: ",[79,1471,1472],{"class":538},"'键盘'",[79,1474,1458],{"class":88},[79,1476,1477],{"class":538},"'鼠标'",[79,1479,1480],{"class":88}," }]\n",[79,1482,1483],{"class":81,"line":147},[79,1484,1167],{"class":88},[79,1486,1487,1489],{"class":81,"line":153},[79,1488,197],{"class":85},[79,1490,433],{"class":88},[79,1492,1493,1496,1498,1501],{"class":81,"line":302},[79,1494,1495],{"class":280},"  name",[79,1497,1181],{"class":88},[79,1499,1500],{"class":95},"device",[79,1502,1137],{"class":88},[79,1504,1505,1508,1511,1514,1516,1519,1522,1524,1526,1529],{"class":81,"line":314},[79,1506,1507],{"class":280},"  main",[79,1509,1510],{"class":88},": [{ ",[79,1512,1513],{"class":280},"name",[79,1515,1181],{"class":88},[79,1517,1518],{"class":95},"power",[79,1520,1521],{"class":88}," }, { ",[79,1523,1513],{"class":280},[79,1525,1181],{"class":88},[79,1527,1528],{"class":95},"cpu",[79,1530,1464],{"class":88},[79,1532,1533,1536,1538,1540,1542,1545,1547,1549,1551,1554],{"class":81,"line":344},[79,1534,1535],{"class":280},"  accessories",[79,1537,1510],{"class":88},[79,1539,1513],{"class":280},[79,1541,1181],{"class":88},[79,1543,1544],{"class":95},"keyboard",[79,1546,1521],{"class":88},[79,1548,1513],{"class":280},[79,1550,1181],{"class":88},[79,1552,1553],{"class":95},"mouse",[79,1555,1480],{"class":88},[79,1557,1558,1560,1562],{"class":81,"line":359},[79,1559,462],{"class":88},[79,1561,92],{"class":85},[79,1563,1564],{"class":88}," computer;\n",[79,1566,1567,1569,1571,1574],{"class":81,"line":364},[79,1568,156],{"class":88},[79,1570,131],{"class":130},[79,1572,1573],{"class":88},"(device, power, cpu, keyboard, mouse); ",[79,1575,1576],{"class":143},"\u002F\u002F 电脑 电源 CPU 键盘 鼠标\n",[54,1578,1579],{"id":1579},"函数参数解构",[15,1581,1582],{},"形参解构用于提取传入数组或对象的数据，参数整体的默认值用于允许省略参数。",[70,1584,1586],{"className":72,"code":1585,"language":74,"meta":75,"style":75},"function sum([a = 1, b = 2] = []) {\n  return a + b;\n}\nfunction describe({ title = '未命名', author = '未知' } = {}) {\n  return `${title} - ${author}`;\n}\nconsole.log(sum(), sum([5])); \u002F\u002F 3 7\nconsole.log(describe({ title: '歌曲', author: '歌手' })); \u002F\u002F 歌曲 - 歌手\nconsole.log(describe()); \u002F\u002F 未命名 - 未知\n",[61,1587,1588,1621,1634,1638,1673,1692,1696,1722,1751],{"__ignoreMap":75},[79,1589,1590,1593,1596,1599,1601,1603,1605,1607,1610,1612,1614,1616,1618],{"class":81,"line":82},[79,1591,1592],{"class":85},"function",[79,1594,1595],{"class":130}," sum",[79,1597,1598],{"class":88},"([",[79,1600,22],{"class":280},[79,1602,203],{"class":85},[79,1604,224],{"class":95},[79,1606,855],{"class":88},[79,1608,1609],{"class":280},"b",[79,1611,203],{"class":85},[79,1613,769],{"class":95},[79,1615,845],{"class":88},[79,1617,92],{"class":85},[79,1619,1620],{"class":88}," []) {\n",[79,1622,1623,1626,1629,1631],{"class":81,"line":102},[79,1624,1625],{"class":85},"  return",[79,1627,1628],{"class":88}," a ",[79,1630,137],{"class":85},[79,1632,1633],{"class":88}," b;\n",[79,1635,1636],{"class":81,"line":108},[79,1637,150],{"class":88},[79,1639,1640,1642,1645,1648,1651,1653,1656,1658,1661,1663,1666,1668,1670],{"class":81,"line":124},[79,1641,1592],{"class":85},[79,1643,1644],{"class":130}," describe",[79,1646,1647],{"class":88},"({ ",[79,1649,1650],{"class":280},"title",[79,1652,203],{"class":85},[79,1654,1655],{"class":538}," '未命名'",[79,1657,855],{"class":88},[79,1659,1660],{"class":280},"author",[79,1662,203],{"class":85},[79,1664,1665],{"class":538}," '未知'",[79,1667,1372],{"class":88},[79,1669,92],{"class":85},[79,1671,1672],{"class":88}," {}) {\n",[79,1674,1675,1677,1680,1682,1685,1687,1690],{"class":81,"line":147},[79,1676,1625],{"class":85},[79,1678,1679],{"class":538}," `${",[79,1681,1650],{"class":88},[79,1683,1684],{"class":538},"} - ${",[79,1686,1660],{"class":88},[79,1688,1689],{"class":538},"}`",[79,1691,99],{"class":88},[79,1693,1694],{"class":81,"line":153},[79,1695,150],{"class":88},[79,1697,1698,1700,1702,1704,1707,1710,1712,1714,1716,1719],{"class":81,"line":302},[79,1699,156],{"class":88},[79,1701,131],{"class":130},[79,1703,161],{"class":88},[79,1705,1706],{"class":130},"sum",[79,1708,1709],{"class":88},"(), ",[79,1711,1706],{"class":130},[79,1713,1598],{"class":88},[79,1715,941],{"class":95},[79,1717,1718],{"class":88},"])); ",[79,1720,1721],{"class":143},"\u002F\u002F 3 7\n",[79,1723,1724,1726,1728,1730,1733,1736,1739,1742,1745,1748],{"class":81,"line":314},[79,1725,156],{"class":88},[79,1727,131],{"class":130},[79,1729,161],{"class":88},[79,1731,1732],{"class":130},"describe",[79,1734,1735],{"class":88},"({ title: ",[79,1737,1738],{"class":538},"'歌曲'",[79,1740,1741],{"class":88},", author: ",[79,1743,1744],{"class":538},"'歌手'",[79,1746,1747],{"class":88}," })); ",[79,1749,1750],{"class":143},"\u002F\u002F 歌曲 - 歌手\n",[79,1752,1753,1755,1757,1759,1761,1764],{"class":81,"line":344},[79,1754,156],{"class":88},[79,1756,131],{"class":130},[79,1758,161],{"class":88},[79,1760,1732],{"class":130},[79,1762,1763],{"class":88},"()); ",[79,1765,1766],{"class":143},"\u002F\u002F 未命名 - 未知\n",[15,1768,1769],{},"把对象先解构为变量，再作为实参传入，也是同一套赋值规则，并非另一种“实参解构”语法。",[54,1771,1772],{"id":1772},"模板字符串",[15,1774,1775,1776,1779],{},"反引号支持多行文本，",[61,1777,1778],{},"${表达式}"," 插入计算结果。缩进和换行也会成为字符串内容。",[70,1781,1783],{"className":72,"code":1782,"language":74,"meta":75,"style":75},"const poem = { line: '举头望明月' };\nconst lastLine = '低头思故乡';\nconst text = `床前明月光，\n疑是地上霜。\n${poem.line}，\n${lastLine}。`;\nconsole.log(text);\n",[61,1784,1785,1802,1816,1828,1833,1849,1861],{"__ignoreMap":75},[79,1786,1787,1789,1792,1794,1797,1800],{"class":81,"line":82},[79,1788,197],{"class":85},[79,1790,1791],{"class":95}," poem",[79,1793,203],{"class":85},[79,1795,1796],{"class":88}," { line: ",[79,1798,1799],{"class":538},"'举头望明月'",[79,1801,542],{"class":88},[79,1803,1804,1806,1809,1811,1814],{"class":81,"line":102},[79,1805,197],{"class":85},[79,1807,1808],{"class":95}," lastLine",[79,1810,203],{"class":85},[79,1812,1813],{"class":538}," '低头思故乡'",[79,1815,99],{"class":88},[79,1817,1818,1820,1823,1825],{"class":81,"line":108},[79,1819,197],{"class":85},[79,1821,1822],{"class":95}," text",[79,1824,203],{"class":85},[79,1826,1827],{"class":538}," `床前明月光，\n",[79,1829,1830],{"class":81,"line":124},[79,1831,1832],{"class":538},"疑是地上霜。\n",[79,1834,1835,1838,1841,1844,1846],{"class":81,"line":147},[79,1836,1837],{"class":538},"${",[79,1839,1840],{"class":88},"poem",[79,1842,1843],{"class":538},".",[79,1845,81],{"class":88},[79,1847,1848],{"class":538},"}，\n",[79,1850,1851,1853,1856,1859],{"class":81,"line":153},[79,1852,1837],{"class":538},[79,1854,1855],{"class":88},"lastLine",[79,1857,1858],{"class":538},"}。`",[79,1860,99],{"class":88},[79,1862,1863,1865,1867],{"class":81,"line":302},[79,1864,156],{"class":88},[79,1866,131],{"class":130},[79,1868,1869],{"class":88},"(text);\n",[54,1871,1872],{"id":1872},"来源记录",[1874,1875,1876,1883,1893,1899],"ul",{},[1877,1878,1879,1882],"li",{},[61,1880,1881],{},"002_es6\u002Fcode\u002Freadme.md","：let、const、解构、模板字符串；Babel 和数组部分分入对应专题。",[1877,1884,1885,1888,1889,1892],{},[61,1886,1887],{},"002_es6\u002Fcode\u002Fes6\u002F02_let.js"," 至 ",[61,1890,1891],{},"07_string.js","：作用域、嵌套解构、参数与字符串示例。",[1877,1894,1895,1898],{},[61,1896,1897],{},"002_es6\u002Fcode\u002Findex.html","：作为浏览器脚本运行方式的参考。",[1877,1900,1901,1904],{},[61,1902,1903],{},"003_es6\u002Fcode\u002Freadme.md"," 的复习部分：合并重复内容。",[1906,1907,1908],"style",{},"html pre.shiki code .szBVR, html code.shiki .szBVR{--shiki-default:#D73A49;--shiki-dark:#F97583}html pre.shiki code .sVt8B, html code.shiki .sVt8B{--shiki-default:#24292E;--shiki-dark:#E1E4E8}html pre.shiki code .sj4cs, html code.shiki .sj4cs{--shiki-default:#005CC5;--shiki-dark:#79B8FF}html pre.shiki code .sScJk, html code.shiki .sScJk{--shiki-default:#6F42C1;--shiki-dark:#B392F0}html pre.shiki code .sJ8bj, html code.shiki .sJ8bj{--shiki-default:#6A737D;--shiki-dark:#6A737D}html .default .shiki span {color: var(--shiki-default);background: var(--shiki-default-bg);font-style: var(--shiki-default-font-style);font-weight: var(--shiki-default-font-weight);text-decoration: var(--shiki-default-text-decoration);}html .shiki span {color: var(--shiki-default);background: var(--shiki-default-bg);font-style: var(--shiki-default-font-style);font-weight: var(--shiki-default-font-weight);text-decoration: var(--shiki-default-text-decoration);}html .dark .shiki span {color: var(--shiki-dark);background: var(--shiki-dark-bg);font-style: var(--shiki-dark-font-style);font-weight: var(--shiki-dark-font-weight);text-decoration: var(--shiki-dark-text-decoration);}html.dark .shiki span {color: var(--shiki-dark);background: var(--shiki-dark-bg);font-style: var(--shiki-dark-font-style);font-weight: var(--shiki-dark-font-weight);text-decoration: var(--shiki-dark-text-decoration);}html pre.shiki code .s4XuR, html code.shiki .s4XuR{--shiki-default:#E36209;--shiki-dark:#FFAB70}html pre.shiki code .sZZnC, html code.shiki .sZZnC{--shiki-default:#032F62;--shiki-dark:#9ECBFF}html pre.shiki code .s9eBZ, html code.shiki .s9eBZ{--shiki-default:#22863A;--shiki-dark:#85E89D}",{"title":75,"searchDepth":108,"depth":108,"links":1910},[1911,1915,1916,1917,1918,1919,1920,1921],{"id":56,"depth":102,"text":57,"children":1912},[1913,1914],{"id":173,"depth":108,"text":173},{"id":389,"depth":108,"text":389},{"id":512,"depth":102,"text":513},{"id":627,"depth":102,"text":628},{"id":818,"depth":102,"text":818},{"id":1109,"depth":102,"text":1109},{"id":1579,"depth":102,"text":1579},{"id":1772,"depth":102,"text":1772},{"id":1872,"depth":102,"text":1872},"fundamentals","2026-09-09","从课程示例整理 let、const、暂时性死区、全局对象、数组与对象解构及模板字符串。",false,"md",{},{"title":5,"description":1924},"尚学堂 ES6 课程 002_es6、003_es6 学习笔记与代码","docs\u002Fes6-basics",[1932,1933,1934],"javascript","es6","notes","KB8FNgUUe51pxqsnN-l0YRm_cwqn1wegAOyoa22863w",[1937,1943,1947,1949,1953,1962,1972,1979,1985,1995,2002,2011,2016,2023,2028,2033,2039,2046,2053,2060,2069,2075,2081,2086,2091,2095,2100,2105],{"path":50,"title":1938,"description":1939,"date":1923,"category":1940,"tags":1941},"Babel 转译基础与构建集成","Babel 7 的 CLI、preset、plugin、目标环境以及 Gulp、Webpack 和 JSX 转译配置摘录。","toolchain",[1932,1933,1942,1934],"webpack",{"path":29,"title":1944,"description":1945,"date":1923,"category":1922,"tags":1946},"ES6 数组与对象扩展","展开运算符、Array.from、Object.assign、属性描述符与图片预加载示例。",[1932,1933,1934],{"path":24,"title":5,"description":1924,"date":1923,"category":1922,"tags":1948},[1932,1933,1934],{"path":37,"title":1950,"description":1951,"date":1923,"category":1922,"tags":1952},"Promise、Generator 与 async\u002Fawait","从回调到 Promise 链、组合方法、Generator 执行与 async 错误处理的课程示例整理。",[1932,1933,1934],{"path":1954,"title":1955,"description":1956,"date":1957,"category":1940,"tags":1958},"\u002Fdocs\u002Flinux-commands-cheatsheet","Linux 常用命令与权限管理速查","cp\u002Fmv\u002Frm、目录导航、查找、压缩、网络等基础命令速查，以及 chmod\u002Fchown 的数字与符号写法、常用组合和 WSL 下的坑。","2026-05-28",[1959,1960,1961],"linux","wsl2","cheatsheet",{"path":1963,"title":1964,"description":1965,"date":1966,"category":1967,"tags":1968},"\u002Fdocs\u002Ffrontend-coding-standards","前端团队编码规范","HTML \u002F CSS \u002F JavaScript 三端统一的团队编码约定，含缩进、命名、语法与禁用项，可直接作为 Code Review 依据。","2025-12-17","standards",[729,1969,1932,1933,1970,1971],"css","best-practice","guide",{"path":1973,"title":1974,"description":1975,"date":1976,"category":1940,"tags":1977},"\u002Fdocs\u002Fwindows-mklink","Windows mklink 符号链接用法","mklink 各参数区别与实用场景：目录联接、符号链接与硬链接的选择。","2024-12-18",[1978,1961],"windows",{"path":1980,"title":1981,"description":1982,"date":1983,"category":1940,"tags":1984},"\u002Fdocs\u002Frandom-color-utils","JS 随机颜色生成方法","几种生成随机 RGB \u002F HEX 颜色的实现方式与各自适用场景。","2024-12-11",[1932,1961],{"path":1986,"title":1987,"description":1988,"date":1989,"category":1990,"tags":1991},"\u002Fdocs\u002Fcanvas-vs-svg","Canvas 与 SVG 绘图方案选型","对比 Canvas 与 SVG 两种绘图方案的优缺点与适用场景，给出选型判断依据。","2024-12-09","visualization",[1992,1993,1994,1970],"canvas","svg","performance",{"path":1996,"title":1997,"description":1998,"date":1999,"category":1940,"tags":2000},"\u002Fdocs\u002Ffree-commercial-fonts","免费可商用字体整理","整理思源黑体、思源宋体等可商用中文字体，规避字体版权风险。","2024-11-03",[2001,1969,1934],"font",{"path":2003,"title":2004,"description":2005,"date":1999,"category":2006,"tags":2007},"\u002Fdocs\u002Finterview-browser-network","浏览器与网络考点","从输入 URL 到页面呈现的完整链路，涵盖渲染流程、回流重绘、HTTP 报文与状态码、跨域同源策略与常见攻击方式。","interview",[2008,2009,2010,1994,1934],"browser","http","network",{"path":2012,"title":2013,"description":2014,"date":1999,"category":2006,"tags":2015},"\u002Fdocs\u002Finterview-css-layout","CSS 与布局考点","em 与 rem 的区别、移动端三种适配方案对比、viewport 标准设置与 REM 布局的媒体查询实现。",[1969,729,1970,1934],{"path":2017,"title":2018,"description":2019,"date":1999,"category":2006,"tags":2020},"\u002Fdocs\u002Finterview-framework-tooling","框架与工程化考点","React diff 与 setState 机制、Redux 核心组成、Vue 常考清单，以及 Webpack、Vite、Git 的面试要点。",[2021,1932,1942,2022,1934],"vue","vite",{"path":2024,"title":2025,"description":2026,"date":1999,"category":2006,"tags":2027},"\u002Fdocs\u002Finterview-javascript-core","JavaScript 核心考点","数据类型、this 绑定、闭包、原型链、异步与数组方法，前端面试中 JS 部分的高频考点与代码示例。",[1932,1933,1934],{"path":45,"title":2029,"description":2030,"date":1999,"category":1922,"tags":2031},"JavaScript 模块化方案","梳理 CommonJS、AMD、ES Module 等模块化方案的差异与使用方式。",[1932,2032,1933,1934],"module-system",{"path":2034,"title":2035,"description":2036,"date":1999,"category":1922,"tags":2037},"\u002Fdocs\u002Fwebsocket-basics","WebSocket 基础","WebSocket 全双工通信协议的事件、方法与基本用法整理。",[2038,2010,1932,1934],"websocket",{"path":2040,"title":2041,"description":2042,"date":2043,"category":1940,"tags":2044},"\u002Fdocs\u002Fmarkdown-syntax","Markdown 语法速查","Markdown 标题、强调、列表、区块引用、代码、表格、转义与 Mermaid 图表语法整理。","2024-10-18",[2045,1961,1934],"markdown",{"path":2047,"title":2048,"description":2049,"date":2050,"category":1990,"tags":2051},"\u002Fdocs\u002Fgojs-getting-started","GoJS 入门实战","从引入方式、画布初始化到节点模板与数据绑定，一份可直接上手的 GoJS 流程图开发笔记。","2024-08-22",[2052,1932,1934],"gojs",{"path":2054,"title":2055,"description":2056,"date":2057,"category":1990,"tags":2058},"\u002Fdocs\u002Fecharts-options-notes","ECharts 配置项速查","整理 ECharts 常用 option 配置：数据格式、坐标轴、图例与交互项的实际用法。","2024-08-09",[2059,1932,1961],"echarts",{"path":2061,"title":2062,"description":2063,"date":2064,"category":1940,"tags":2065},"\u002Fdocs\u002Fyarn-npm-install-errors","yarn \u002F npm 安装报错处理","yarn 引擎版本不兼容时的 ignore-engines 绕过、Windows 刷新 DNS 解析缓存、npm 缓存清理与校验。","2024-08-06",[2066,2067,1978,2068],"npm","nodejs","troubleshooting",{"path":2070,"title":2071,"description":2072,"date":2073,"category":1990,"tags":2074},"\u002Fdocs\u002Fgojs-grid-panel","GoJS 网格面板用法","Diagram.grid 默认网格与网格捕捉、单元格尺寸定制，用 LineH\u002FLineV\u002FBarH\u002FBarV 自定义网格样式，以及把 Grid 面板当作节点元素使用。","2024-07-01",[2052,1932,1934],{"path":2076,"title":2077,"description":2078,"date":2079,"category":1922,"tags":2080},"\u002Fdocs\u002Fhttp-status-codes","HTTP 响应状态码详解","按 1xx 到 5xx 分类梳理 HTTP 状态码的含义与典型使用场景。","2024-06-27",[2009,2010,1961],{"path":33,"title":2082,"description":2083,"date":2084,"category":1922,"tags":2085},"ES6 函数与 Class","默认参数、rest、箭头函数的 this、Class 方法、访问器、静态成员与继承。","2023-04-26",[1932,1933,1934],{"path":2087,"title":2088,"description":2089,"date":2084,"category":1940,"tags":2090},"\u002Fdocs\u002Fgulp-basics","Gulp 4 任务与文件流","Gulp 任务完成信号、串并行组合、文件流、资源处理、分阶段输出和文件监听。",[1932,2067,1934],{"path":41,"title":2092,"description":2093,"date":2084,"category":1922,"tags":2094},"Proxy 与 Reflect 入门","通过属性读取和赋值示例理解 Proxy、Reflect、receiver 与拦截限制。",[1932,1933,1934],{"path":2096,"title":2097,"description":2098,"date":2084,"category":1940,"tags":2099},"\u002Fdocs\u002Fless-basics","Less 语法与编译笔记","变量、嵌套、混合、extend、导入、内置函数和递归生成列的课程示例。",[1969,1934,1961],{"path":2101,"title":2102,"description":2103,"date":2084,"category":1940,"tags":2104},"\u002Fdocs\u002Fwebpack-basics","Webpack 4 配置与开发服务器笔记","课程中的入口出口、loader、plugin、source map、开发代理以及 React 环境配置片段。",[1942,1932,2067,1934],{"path":2106,"title":2107,"description":2108,"date":2109,"category":1922,"tags":2110},"\u002Fdocs\u002Fhtml-basics","HTML 基础笔记","HTML 语法规范、常用标签、表格、表单、Canvas 入门与 JavaScript 输出方式速查。","2022-06-10",[729,1934,1961],1789635934092]