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