[{"data":1,"prerenderedAt":3711},["ShallowReactive",2],{"doc-\u002Fdocs\u002Ffrontend-coding-standards":3,"docs-all":3609},{"id":4,"title":5,"body":6,"category":3593,"date":3594,"description":3595,"draft":3596,"extension":3597,"meta":3598,"navigation":464,"path":3599,"seo":3600,"source":3601,"stem":3602,"tags":3603,"__hash__":3608},"docs\u002Fdocs\u002Ffrontend-coding-standards.md","前端团队编码规范",{"type":7,"value":8,"toc":3555},"minimark",[9,23,28,31,116,125,128,132,137,140,169,173,184,208,228,236,240,251,273,306,310,368,371,389,523,527,533,647,655,659,670,762,766,779,882,886,892,1019,1023,1038,1058,1060,1064,1068,1083,1115,1177,1186,1190,1197,1285,1289,1312,1367,1371,1377,1528,1531,1652,1656,1666,1756,1760,1767,1798,1802,1805,1873,1878,1880,1884,1888,1905,1997,2004,2064,2068,2071,2141,2148,2197,2204,2328,2341,2345,2352,2460,2464,2476,2542,2546,2582,2830,2834,2848,3021,3056,3060,3075,3157,3161,3178,3310,3324,3328,3334,3382,3386,3389,3438,3442,3464,3468,3478,3480,3483,3500,3506,3516,3540,3546,3552],[10,11,12,16],"blockquote",{},[13,14,15],"p",{},"本规范由团队原有的 HTML \u002F CSS \u002F JavaScript 三份规范整合而成，消解了原文中若干互相矛盾与前后颠倒之处（详见文末「整合修订说明」）。",[13,17,18,22],{},[19,20,21],"strong",{},"约束力","：本文所有条目均为团队约定，Code Review 以此为依据。标注「强制」的条目不允许例外，标注「推荐」的可在有充分理由时偏离，但需在 PR 中说明。",[24,25,27],"h2",{"id":26},"〇通用约定","〇、通用约定",[13,29,30],{},"这三条跨越所有文件类型，优先级最高。",[32,33,34,51],"table",{},[35,36,37],"thead",{},[38,39,40,44,47],"tr",{},[41,42,43],"th",{},"项目",[41,45,46],{},"约定",[41,48,50],{"align":49},"center","强制",[52,53,54,68,80,95,106],"tbody",{},[38,55,56,60,66],{},[57,58,59],"td",{},"缩进",[57,61,62,65],{},[19,63,64],{},"统一 2 个空格","，禁用 Tab",[57,67,50],{"align":49},[38,69,70,73,78],{},[57,71,72],{},"文件编码",[57,74,75],{},[19,76,77],{},"UTF-8 无 BOM",[57,79,50],{"align":49},[38,81,82,85,93],{},[57,83,84],{},"换行符",[57,86,87,88,92],{},"LF (",[89,90,91],"code",{},"\\n",")",[57,94,50],{"align":49},[38,96,97,100,103],{},[57,98,99],{},"空行",[57,101,102],{},"连续空行不超过 1 行",[57,104,105],{"align":49},"推荐",[38,107,108,111,114],{},[57,109,110],{},"大小写",[57,112,113],{},"标签名、选择器、属性名一律小写",[57,115,50],{"align":49},[10,117,118],{},[13,119,120,121,124],{},"缩进统一为 2 空格是本次整合的",[19,122,123],{},"重要修订","。原 CSS 规范文字写「四个空格」但其全部示例代码实为 2 空格，与 HTML、JS 规范冲突。以 2 空格为准。",[126,127],"hr",{},[24,129,131],{"id":130},"一html-规范","一、HTML 规范",[133,134,136],"h3",{"id":135},"_11-文档声明","1.1 文档声明",[13,138,139],{},"必须使用 HTML5 文档声明，置于文件首行。",[141,142,147],"pre",{"className":143,"code":144,"language":145,"meta":146,"style":146},"language-html shiki shiki-themes github-light github-dark","\u003C!DOCTYPE html>\n","html","",[89,148,149],{"__ignoreMap":146},[150,151,154,158,162,166],"span",{"class":152,"line":153},"line",1,[150,155,157],{"class":156},"sVt8B","\u003C!",[150,159,161],{"class":160},"s9eBZ","DOCTYPE",[150,163,165],{"class":164},"sScJk"," html",[150,167,168],{"class":156},">\n",[133,170,172],{"id":171},"_12-页面语言","1.2 页面语言",[13,174,175,176,179,180,183],{},"使用 ",[89,177,178],{},"zh-CN","。虽然 BCP 47 推荐 ",[89,181,182],{},"cmn-Hans-CN","（普通话，简体，中国大陆），但考虑浏览器与操作系统兼容性，团队统一用前者。",[141,185,187],{"className":143,"code":186,"language":145,"meta":146,"style":146},"\u003Chtml lang=\"zh-CN\">\n",[89,188,189],{"__ignoreMap":146},[150,190,191,194,196,199,202,206],{"class":152,"line":153},[150,192,193],{"class":156},"\u003C",[150,195,145],{"class":160},[150,197,198],{"class":164}," lang",[150,200,201],{"class":156},"=",[150,203,205],{"class":204},"sZZnC","\"zh-CN\"",[150,207,168],{"class":156},[13,209,210,213,214,217,218,217,221,217,224,227],{},[19,211,212],{},"已废弃写法，禁止使用","（2009 年起 ",[89,215,216],{},"cmn","\u002F",[89,219,220],{},"wuu",[89,222,223],{},"yue",[89,225,226],{},"gan"," 已由 extlang 升级为 language）：",[141,229,234],{"className":230,"code":232,"language":233},[231],"language-text","zh-cmn, zh-cmn-Hans, zh-cmn-Hant, zh-wuu, zh-yue, zh-gan\nzh-Hans-CN, zh-Hant-TW  等 zh-Hans* \u002F zh-Hant* 系列\n","text",[89,235,232],{"__ignoreMap":146},[133,237,239],{"id":238},"_13-字符编码","1.3 字符编码",[13,241,242,243,246,247,250],{},"统一 ",[89,244,245],{},"UTF-8","，且",[19,248,249],{},"必须写成大写连字符形式","。",[141,252,254],{"className":143,"code":253,"language":145,"meta":146,"style":146},"\u003Cmeta charset=\"UTF-8\">\n",[89,255,256],{"__ignoreMap":146},[150,257,258,260,263,266,268,271],{"class":152,"line":153},[150,259,193],{"class":156},[150,261,262],{"class":160},"meta",[150,264,265],{"class":164}," charset",[150,267,201],{"class":156},[150,269,270],{"class":204},"\"UTF-8\"",[150,272,168],{"class":156},[13,274,275,276,279,280,283,284,287,288,295,296,298,299,301,302,305],{},"不要写成 ",[89,277,278],{},"utf-8","、",[89,281,282],{},"utf8"," 或 ",[89,285,286],{},"UTF8","。依据 ",[289,290,294],"a",{"href":291,"rel":292},"http:\u002F\u002Fwww.ietf.org\u002Frfc\u002Frfc3629",[293],"nofollow","RFC 3629","，标准写法是 ",[89,297,245],{},"；",[89,300,286],{}," 只是某些编程系统的标识符（如 .NET 的 ",[89,303,304],{},"System.Text.Encoding.UTF8","），不是编码名。",[133,307,309],{"id":308},"_14-标签闭合","1.4 标签闭合",[13,311,312,313,217,316,217,319,217,322,217,325,217,328,217,330,217,333,217,336,217,339,217,341,217,344,217,347,217,350,353,354,217,357,360,361,217,364,367],{},"HTML 元素分五类：空元素（",[89,314,315],{},"area",[89,317,318],{},"base",[89,320,321],{},"br",[89,323,324],{},"col",[89,326,327],{},"embed",[89,329,126],{},[89,331,332],{},"img",[89,334,335],{},"input",[89,337,338],{},"link",[89,340,262],{},[89,342,343],{},"param",[89,345,346],{},"source",[89,348,349],{},"track",[89,351,352],{},"wbr","）、原始文本元素（",[89,355,356],{},"script",[89,358,359],{},"style","）、RCDATA 元素（",[89,362,363],{},"textarea",[89,365,366],{},"title","）、外来元素（MathML \u002F SVG 命名空间）、常规元素。",[13,369,370],{},"团队约定：",[372,373,374,382],"ul",{},[375,376,377,378,381],"li",{},"所有有起止标签的元素",[19,379,380],{},"都要写全","，即使规范允许省略",[375,383,384,385,388],{},"空元素标签",[19,386,387],{},"不加","结尾斜杠",[141,390,392],{"className":143,"code":391,"language":145,"meta":146,"style":146},"\u003C!-- 推荐 -->\n\u003Cdiv>\n  \u003Ch1>标题\u003C\u002Fh1>\n  \u003Cp>有始有终的段落\u003C\u002Fp>\n\u003C\u002Fdiv>\n\u003Cbr>\n\n\u003C!-- 不推荐 -->\n\u003Cdiv>\n  \u003Ch1>标题\u003C\u002Fh1>\n  \u003Cp>有始无终的段落\n\u003C\u002Fdiv>\n\u003Cbr\u002F>\n",[89,393,394,400,410,426,440,450,459,466,472,481,494,504,513],{"__ignoreMap":146},[150,395,396],{"class":152,"line":153},[150,397,399],{"class":398},"sJ8bj","\u003C!-- 推荐 -->\n",[150,401,403,405,408],{"class":152,"line":402},2,[150,404,193],{"class":156},[150,406,407],{"class":160},"div",[150,409,168],{"class":156},[150,411,413,416,419,422,424],{"class":152,"line":412},3,[150,414,415],{"class":156},"  \u003C",[150,417,418],{"class":160},"h1",[150,420,421],{"class":156},">标题\u003C\u002F",[150,423,418],{"class":160},[150,425,168],{"class":156},[150,427,429,431,433,436,438],{"class":152,"line":428},4,[150,430,415],{"class":156},[150,432,13],{"class":160},[150,434,435],{"class":156},">有始有终的段落\u003C\u002F",[150,437,13],{"class":160},[150,439,168],{"class":156},[150,441,443,446,448],{"class":152,"line":442},5,[150,444,445],{"class":156},"\u003C\u002F",[150,447,407],{"class":160},[150,449,168],{"class":156},[150,451,453,455,457],{"class":152,"line":452},6,[150,454,193],{"class":156},[150,456,321],{"class":160},[150,458,168],{"class":156},[150,460,462],{"class":152,"line":461},7,[150,463,465],{"emptyLinePlaceholder":464},true,"\n",[150,467,469],{"class":152,"line":468},8,[150,470,471],{"class":398},"\u003C!-- 不推荐 -->\n",[150,473,475,477,479],{"class":152,"line":474},9,[150,476,193],{"class":156},[150,478,407],{"class":160},[150,480,168],{"class":156},[150,482,484,486,488,490,492],{"class":152,"line":483},10,[150,485,415],{"class":156},[150,487,418],{"class":160},[150,489,421],{"class":156},[150,491,418],{"class":160},[150,493,168],{"class":156},[150,495,497,499,501],{"class":152,"line":496},11,[150,498,415],{"class":156},[150,500,13],{"class":160},[150,502,503],{"class":156},">有始无终的段落\n",[150,505,507,509,511],{"class":152,"line":506},12,[150,508,445],{"class":156},[150,510,407],{"class":160},[150,512,168],{"class":156},[150,514,516,518,520],{"class":152,"line":515},13,[150,517,193],{"class":156},[150,519,321],{"class":160},[150,521,522],{"class":156},"\u002F>\n",[133,524,526],{"id":525},"_15-类型属性","1.5 类型属性",[13,528,529,530,250],{},"HTML5 中 CSS 与 JS 的类型属性已有默认值，",[19,531,532],{},"应当省略",[141,534,536],{"className":143,"code":535,"language":145,"meta":146,"style":146},"\u003C!-- 推荐 -->\n\u003Clink rel=\"stylesheet\" href=\"\">\n\u003Cscript src=\"\">\u003C\u002Fscript>\n\n\u003C!-- 不推荐 -->\n\u003Clink rel=\"stylesheet\" type=\"text\u002Fcss\" href=\"\">\n\u003Cscript type=\"text\u002Fjavascript\" src=\"\">\u003C\u002Fscript>\n",[89,537,538,542,566,586,590,594,622],{"__ignoreMap":146},[150,539,540],{"class":152,"line":153},[150,541,399],{"class":398},[150,543,544,546,548,551,553,556,559,561,564],{"class":152,"line":402},[150,545,193],{"class":156},[150,547,338],{"class":160},[150,549,550],{"class":164}," rel",[150,552,201],{"class":156},[150,554,555],{"class":204},"\"stylesheet\"",[150,557,558],{"class":164}," href",[150,560,201],{"class":156},[150,562,563],{"class":204},"\"\"",[150,565,168],{"class":156},[150,567,568,570,572,575,577,579,582,584],{"class":152,"line":412},[150,569,193],{"class":156},[150,571,356],{"class":160},[150,573,574],{"class":164}," src",[150,576,201],{"class":156},[150,578,563],{"class":204},[150,580,581],{"class":156},">\u003C\u002F",[150,583,356],{"class":160},[150,585,168],{"class":156},[150,587,588],{"class":152,"line":428},[150,589,465],{"emptyLinePlaceholder":464},[150,591,592],{"class":152,"line":442},[150,593,471],{"class":398},[150,595,596,598,600,602,604,606,609,611,614,616,618,620],{"class":152,"line":452},[150,597,193],{"class":156},[150,599,338],{"class":160},[150,601,550],{"class":164},[150,603,201],{"class":156},[150,605,555],{"class":204},[150,607,608],{"class":164}," type",[150,610,201],{"class":156},[150,612,613],{"class":204},"\"text\u002Fcss\"",[150,615,558],{"class":164},[150,617,201],{"class":156},[150,619,563],{"class":204},[150,621,168],{"class":156},[150,623,624,626,628,630,632,635,637,639,641,643,645],{"class":152,"line":461},[150,625,193],{"class":156},[150,627,356],{"class":160},[150,629,608],{"class":164},[150,631,201],{"class":156},[150,633,634],{"class":204},"\"text\u002Fjavascript\"",[150,636,574],{"class":164},[150,638,201],{"class":156},[150,640,563],{"class":204},[150,642,581],{"class":156},[150,644,356],{"class":160},[150,646,168],{"class":156},[10,648,649],{},[13,650,651,654],{},[19,652,653],{},"注","：原规范此节的推荐 \u002F 不推荐示例标反了。此处已修正为符合其文字表述（「不需要为 CSS、JS 指定类型属性」）的版本。",[133,656,658],{"id":657},"_16-元素属性","1.6 元素属性",[372,660,661,667],{},[375,662,663,664],{},"属性值统一使用",[19,665,666],{},"双引号",[375,668,669],{},"布尔属性可写全值以求明确",[141,671,673],{"className":143,"code":672,"language":145,"meta":146,"style":146},"\u003C!-- 推荐 -->\n\u003Cinput type=\"text\">\n\u003Cinput type=\"radio\" name=\"name\" checked=\"checked\">\n\n\u003C!-- 不推荐 -->\n\u003Cinput type=text>\n\u003Cinput type='text'>\n",[89,674,675,679,694,725,729,733,747],{"__ignoreMap":146},[150,676,677],{"class":152,"line":153},[150,678,399],{"class":398},[150,680,681,683,685,687,689,692],{"class":152,"line":402},[150,682,193],{"class":156},[150,684,335],{"class":160},[150,686,608],{"class":164},[150,688,201],{"class":156},[150,690,691],{"class":204},"\"text\"",[150,693,168],{"class":156},[150,695,696,698,700,702,704,707,710,712,715,718,720,723],{"class":152,"line":412},[150,697,193],{"class":156},[150,699,335],{"class":160},[150,701,608],{"class":164},[150,703,201],{"class":156},[150,705,706],{"class":204},"\"radio\"",[150,708,709],{"class":164}," name",[150,711,201],{"class":156},[150,713,714],{"class":204},"\"name\"",[150,716,717],{"class":164}," checked",[150,719,201],{"class":156},[150,721,722],{"class":204},"\"checked\"",[150,724,168],{"class":156},[150,726,727],{"class":152,"line":428},[150,728,465],{"emptyLinePlaceholder":464},[150,730,731],{"class":152,"line":442},[150,732,471],{"class":398},[150,734,735,737,739,741,743,745],{"class":152,"line":452},[150,736,193],{"class":156},[150,738,335],{"class":160},[150,740,608],{"class":164},[150,742,201],{"class":156},[150,744,233],{"class":204},[150,746,168],{"class":156},[150,748,749,751,753,755,757,760],{"class":152,"line":461},[150,750,193],{"class":156},[150,752,335],{"class":160},[150,754,608],{"class":164},[150,756,201],{"class":156},[150,758,759],{"class":204},"'text'",[150,761,168],{"class":156},[133,763,765],{"id":764},"_17-特殊字符转义","1.7 特殊字符转义",[13,767,768,770,771,774,775,778],{},[89,769,193],{}," 与 ",[89,772,773],{},">"," 在文本中必须用字符实体，否则浏览器会当作标签解析。",[89,776,777],{},"href"," 不允许为空字符串。",[141,780,782],{"className":143,"code":781,"language":145,"meta":146,"style":146},"\u003C!-- 推荐 -->\n\u003Ca href=\"#\">more&gt;&gt;\u003C\u002Fa>\n\u003Ca href=\"javascript:;\">more&gt;&gt;\u003C\u002Fa>\n\n\u003C!-- 不推荐 -->\n\u003Ca href=\"#\">more>>\u003C\u002Fa>\n\u003Ca href=\"\">more>>\u003C\u002Fa>\n",[89,783,784,788,814,837,841,845,864],{"__ignoreMap":146},[150,785,786],{"class":152,"line":153},[150,787,399],{"class":398},[150,789,790,792,794,796,798,801,804,808,810,812],{"class":152,"line":402},[150,791,193],{"class":156},[150,793,289],{"class":160},[150,795,558],{"class":164},[150,797,201],{"class":156},[150,799,800],{"class":204},"\"#\"",[150,802,803],{"class":156},">more",[150,805,807],{"class":806},"sj4cs","&gt;&gt;",[150,809,445],{"class":156},[150,811,289],{"class":160},[150,813,168],{"class":156},[150,815,816,818,820,822,824,827,829,831,833,835],{"class":152,"line":412},[150,817,193],{"class":156},[150,819,289],{"class":160},[150,821,558],{"class":164},[150,823,201],{"class":156},[150,825,826],{"class":204},"\"javascript:;\"",[150,828,803],{"class":156},[150,830,807],{"class":806},[150,832,445],{"class":156},[150,834,289],{"class":160},[150,836,168],{"class":156},[150,838,839],{"class":152,"line":428},[150,840,465],{"emptyLinePlaceholder":464},[150,842,843],{"class":152,"line":442},[150,844,471],{"class":398},[150,846,847,849,851,853,855,857,860,862],{"class":152,"line":452},[150,848,193],{"class":156},[150,850,289],{"class":160},[150,852,558],{"class":164},[150,854,201],{"class":156},[150,856,800],{"class":204},[150,858,859],{"class":156},">more>>\u003C\u002F",[150,861,289],{"class":160},[150,863,168],{"class":156},[150,865,866,868,870,872,874,876,878,880],{"class":152,"line":461},[150,867,193],{"class":156},[150,869,289],{"class":160},[150,871,558],{"class":164},[150,873,201],{"class":156},[150,875,563],{"class":204},[150,877,859],{"class":156},[150,879,289],{"class":160},[150,881,168],{"class":156},[133,883,885],{"id":884},"_18-嵌套规则","1.8 嵌套规则",[13,887,888,889,250],{},"块级元素独占一行，内联元素可同行。段落与标题元素",[19,890,891],{},"只能嵌套内联元素",[141,893,895],{"className":143,"code":894,"language":145,"meta":146,"style":146},"\u003C!-- 推荐 -->\n\u003Cdiv>\n  \u003Ch1>\u003C\u002Fh1>\n  \u003Cp>\u003C\u002Fp>\n\u003C\u002Fdiv>\n\u003Cp>\u003Cspan>\u003C\u002Fspan>\u003Cspan>\u003C\u002Fspan>\u003C\u002Fp>\n\n\u003C!-- 不推荐：块级元素嵌进了 h1 \u002F p -->\n\u003Ch1>\u003Cdiv>\u003C\u002Fdiv>\u003C\u002Fh1>\n\u003Cp>\u003Cdiv>\u003C\u002Fdiv>\u003C\u002Fp>\n",[89,896,897,901,909,921,933,941,970,974,979,999],{"__ignoreMap":146},[150,898,899],{"class":152,"line":153},[150,900,399],{"class":398},[150,902,903,905,907],{"class":152,"line":402},[150,904,193],{"class":156},[150,906,407],{"class":160},[150,908,168],{"class":156},[150,910,911,913,915,917,919],{"class":152,"line":412},[150,912,415],{"class":156},[150,914,418],{"class":160},[150,916,581],{"class":156},[150,918,418],{"class":160},[150,920,168],{"class":156},[150,922,923,925,927,929,931],{"class":152,"line":428},[150,924,415],{"class":156},[150,926,13],{"class":160},[150,928,581],{"class":156},[150,930,13],{"class":160},[150,932,168],{"class":156},[150,934,935,937,939],{"class":152,"line":442},[150,936,445],{"class":156},[150,938,407],{"class":160},[150,940,168],{"class":156},[150,942,943,945,947,950,952,954,956,958,960,962,964,966,968],{"class":152,"line":452},[150,944,193],{"class":156},[150,946,13],{"class":160},[150,948,949],{"class":156},">\u003C",[150,951,150],{"class":160},[150,953,581],{"class":156},[150,955,150],{"class":160},[150,957,949],{"class":156},[150,959,150],{"class":160},[150,961,581],{"class":156},[150,963,150],{"class":160},[150,965,581],{"class":156},[150,967,13],{"class":160},[150,969,168],{"class":156},[150,971,972],{"class":152,"line":461},[150,973,465],{"emptyLinePlaceholder":464},[150,975,976],{"class":152,"line":468},[150,977,978],{"class":398},"\u003C!-- 不推荐：块级元素嵌进了 h1 \u002F p -->\n",[150,980,981,983,985,987,989,991,993,995,997],{"class":152,"line":474},[150,982,193],{"class":156},[150,984,418],{"class":160},[150,986,949],{"class":156},[150,988,407],{"class":160},[150,990,581],{"class":156},[150,992,407],{"class":160},[150,994,581],{"class":156},[150,996,418],{"class":160},[150,998,168],{"class":156},[150,1000,1001,1003,1005,1007,1009,1011,1013,1015,1017],{"class":152,"line":483},[150,1002,193],{"class":156},[150,1004,13],{"class":160},[150,1006,949],{"class":156},[150,1008,407],{"class":160},[150,1010,581],{"class":156},[150,1012,407],{"class":160},[150,1014,581],{"class":156},[150,1016,13],{"class":160},[150,1018,168],{"class":156},[133,1020,1022],{"id":1021},"_19-数字输入框","1.9 数字输入框",[13,1024,1025,1026,1029,1030,1033,1034,1037],{},"移动端纯数字输入使用 ",[89,1027,1028],{},"type=\"tel\""," 而非 ",[89,1031,1032],{},"type=\"number\"","，避免 ",[89,1035,1036],{},"number"," 类型在各浏览器下的步进器与格式化差异。",[141,1039,1041],{"className":143,"code":1040,"language":145,"meta":146,"style":146},"\u003Cinput type=\"tel\">\n",[89,1042,1043],{"__ignoreMap":146},[150,1044,1045,1047,1049,1051,1053,1056],{"class":152,"line":153},[150,1046,193],{"class":156},[150,1048,335],{"class":160},[150,1050,608],{"class":164},[150,1052,201],{"class":156},[150,1054,1055],{"class":204},"\"tel\"",[150,1057,168],{"class":156},[126,1059],{},[24,1061,1063],{"id":1062},"二css-规范","二、CSS 规范",[133,1065,1067],{"id":1066},"_21-charset-规则","2.1 @charset 规则",[13,1069,1070,1071,1074,1075,1078,1079,1082],{},"样式文件",[19,1072,1073],{},"必须","写 ",[89,1076,1077],{},"@charset","，且必须在",[19,1080,1081],{},"文件第一行第一个字符","开始，否则可能被 BOM 覆盖。",[141,1084,1088],{"className":1085,"code":1086,"language":1087,"meta":146,"style":146},"language-css shiki shiki-themes github-light github-dark","\u002F* 推荐 *\u002F\n@charset \"UTF-8\";\n\n.jdc { }\n","css",[89,1089,1090,1095,1103,1107],{"__ignoreMap":146},[150,1091,1092],{"class":152,"line":153},[150,1093,1094],{"class":398},"\u002F* 推荐 *\u002F\n",[150,1096,1097,1100],{"class":152,"line":402},[150,1098,1077],{"class":1099},"szBVR",[150,1101,1102],{"class":156}," \"UTF-8\";\n",[150,1104,1105],{"class":152,"line":412},[150,1106,465],{"emptyLinePlaceholder":464},[150,1108,1109,1112],{"class":152,"line":428},[150,1110,1111],{"class":164},".jdc",[150,1113,1114],{"class":156}," { }\n",[141,1116,1118],{"className":1085,"code":1117,"language":1087,"meta":146,"style":146},"\u002F* 不推荐：前面有注释，规则未在首行首字符 *\u002F\n\u002F**\n * @desc File Info\n *\u002F\n@charset \"UTF-8\";\n\n\u002F* 不推荐：大写 *\u002F\n@CHARSET \"UTF-8\";\n\n\u002F* 不推荐：完全缺失 *\u002F\n.jdc { }\n",[89,1119,1120,1125,1130,1135,1140,1146,1150,1155,1162,1166,1171],{"__ignoreMap":146},[150,1121,1122],{"class":152,"line":153},[150,1123,1124],{"class":398},"\u002F* 不推荐：前面有注释，规则未在首行首字符 *\u002F\n",[150,1126,1127],{"class":152,"line":402},[150,1128,1129],{"class":398},"\u002F**\n",[150,1131,1132],{"class":152,"line":412},[150,1133,1134],{"class":398}," * @desc File Info\n",[150,1136,1137],{"class":152,"line":428},[150,1138,1139],{"class":398}," *\u002F\n",[150,1141,1142,1144],{"class":152,"line":442},[150,1143,1077],{"class":1099},[150,1145,1102],{"class":156},[150,1147,1148],{"class":152,"line":452},[150,1149,465],{"emptyLinePlaceholder":464},[150,1151,1152],{"class":152,"line":461},[150,1153,1154],{"class":398},"\u002F* 不推荐：大写 *\u002F\n",[150,1156,1157,1160],{"class":152,"line":468},[150,1158,1159],{"class":1099},"@CHARSET",[150,1161,1102],{"class":156},[150,1163,1164],{"class":152,"line":474},[150,1165,465],{"emptyLinePlaceholder":464},[150,1167,1168],{"class":152,"line":483},[150,1169,1170],{"class":398},"\u002F* 不推荐：完全缺失 *\u002F\n",[150,1172,1173,1175],{"class":152,"line":496},[150,1174,1111],{"class":164},[150,1176,1114],{"class":156},[13,1178,1179,1182,1183,250],{},[89,1180,1181],{},"@charset \"\";"," 十个字符须全小写、不含转义符，编码名允许大小写混写。",[19,1184,1185],{},"坚决不使用 BOM",[133,1187,1189],{"id":1188},"_22-代码格式","2.2 代码格式",[13,1191,1192,1193,1196],{},"统一使用",[19,1194,1195],{},"展开格式","（Expanded），禁用紧凑格式（Compact）。",[141,1198,1200],{"className":1085,"code":1199,"language":1087,"meta":146,"style":146},"\u002F* 推荐 *\u002F\n.jdc {\n  display: block;\n  width: 50px;\n}\n\n\u002F* 不推荐 *\u002F\n.jdc { display: block;width: 50px;}\n",[89,1201,1202,1206,1213,1227,1242,1247,1251,1256],{"__ignoreMap":146},[150,1203,1204],{"class":152,"line":153},[150,1205,1094],{"class":398},[150,1207,1208,1210],{"class":152,"line":402},[150,1209,1111],{"class":164},[150,1211,1212],{"class":156}," {\n",[150,1214,1215,1218,1221,1224],{"class":152,"line":412},[150,1216,1217],{"class":806},"  display",[150,1219,1220],{"class":156},": ",[150,1222,1223],{"class":806},"block",[150,1225,1226],{"class":156},";\n",[150,1228,1229,1232,1234,1237,1240],{"class":152,"line":428},[150,1230,1231],{"class":806},"  width",[150,1233,1220],{"class":156},[150,1235,1236],{"class":806},"50",[150,1238,1239],{"class":1099},"px",[150,1241,1226],{"class":156},[150,1243,1244],{"class":152,"line":442},[150,1245,1246],{"class":156},"}\n",[150,1248,1249],{"class":152,"line":452},[150,1250,465],{"emptyLinePlaceholder":464},[150,1252,1253],{"class":152,"line":461},[150,1254,1255],{"class":398},"\u002F* 不推荐 *\u002F\n",[150,1257,1258,1260,1263,1266,1268,1270,1273,1276,1278,1280,1282],{"class":152,"line":468},[150,1259,1111],{"class":164},[150,1261,1262],{"class":156}," { ",[150,1264,1265],{"class":806},"display",[150,1267,1220],{"class":156},[150,1269,1223],{"class":806},[150,1271,1272],{"class":156},";",[150,1274,1275],{"class":806},"width",[150,1277,1220],{"class":156},[150,1279,1236],{"class":806},[150,1281,1239],{"class":1099},[150,1283,1284],{"class":156},";}\n",[133,1286,1288],{"id":1287},"_23-选择器","2.3 选择器",[372,1290,1291,1297,1302,1305],{},[375,1292,1293,1294],{},"尽量少用通用选择器 ",[89,1295,1296],{},"*",[375,1298,1299],{},[19,1300,1301],{},"不使用 ID 选择器",[375,1303,1304],{},"不使用无语义的标签选择器",[375,1306,1307,1308,1311],{},"命名使用",[19,1309,1310],{},"中划线","分隔",[141,1313,1315],{"className":1085,"code":1314,"language":1087,"meta":146,"style":146},"\u002F* 推荐 *\u002F\n.jdc {}\n.jdc .test {}\n\n\u002F* 不推荐 *\u002F\n* {}\n#jdc {}\n.jdc div {}\n",[89,1316,1317,1321,1328,1337,1341,1345,1351,1358],{"__ignoreMap":146},[150,1318,1319],{"class":152,"line":153},[150,1320,1094],{"class":398},[150,1322,1323,1325],{"class":152,"line":402},[150,1324,1111],{"class":164},[150,1326,1327],{"class":156}," {}\n",[150,1329,1330,1332,1335],{"class":152,"line":412},[150,1331,1111],{"class":164},[150,1333,1334],{"class":164}," .test",[150,1336,1327],{"class":156},[150,1338,1339],{"class":152,"line":428},[150,1340,465],{"emptyLinePlaceholder":464},[150,1342,1343],{"class":152,"line":442},[150,1344,1255],{"class":398},[150,1346,1347,1349],{"class":152,"line":452},[150,1348,1296],{"class":160},[150,1350,1327],{"class":156},[150,1352,1353,1356],{"class":152,"line":461},[150,1354,1355],{"class":164},"#jdc",[150,1357,1327],{"class":156},[150,1359,1360,1362,1365],{"class":152,"line":468},[150,1361,1111],{"class":164},[150,1363,1364],{"class":160}," div",[150,1366,1327],{"class":156},[133,1368,1370],{"id":1369},"_24-可读性细节","2.4 可读性细节",[13,1372,1373,1374,1376],{},"每条声明末尾",[19,1375,1073],{},"加分号。以下空格规则均为强制：",[141,1378,1380],{"className":1085,"code":1379,"language":1087,"meta":146,"style":146},"\u002F* 左括号前一个空格，冒号后一个空格 *\u002F\n.jdc {\n  width: 100%;\n}\n\n\u002F* 逗号后一个空格 *\u002F\n.jdc {\n  box-shadow: 1px 1px 1px #333, 2px 2px 2px #ccc;\n}\n\n\u002F* 颜色函数括号内不留空格 *\u002F\n.jdc {\n  color: rgba(255, 255, 255, 0.5);\n}\n",[89,1381,1382,1387,1393,1407,1411,1415,1420,1426,1472,1476,1480,1485,1491,1523],{"__ignoreMap":146},[150,1383,1384],{"class":152,"line":153},[150,1385,1386],{"class":398},"\u002F* 左括号前一个空格，冒号后一个空格 *\u002F\n",[150,1388,1389,1391],{"class":152,"line":402},[150,1390,1111],{"class":164},[150,1392,1212],{"class":156},[150,1394,1395,1397,1399,1402,1405],{"class":152,"line":412},[150,1396,1231],{"class":806},[150,1398,1220],{"class":156},[150,1400,1401],{"class":806},"100",[150,1403,1404],{"class":1099},"%",[150,1406,1226],{"class":156},[150,1408,1409],{"class":152,"line":428},[150,1410,1246],{"class":156},[150,1412,1413],{"class":152,"line":442},[150,1414,465],{"emptyLinePlaceholder":464},[150,1416,1417],{"class":152,"line":452},[150,1418,1419],{"class":398},"\u002F* 逗号后一个空格 *\u002F\n",[150,1421,1422,1424],{"class":152,"line":461},[150,1423,1111],{"class":164},[150,1425,1212],{"class":156},[150,1427,1428,1431,1433,1436,1438,1441,1443,1445,1447,1450,1453,1456,1458,1461,1463,1465,1467,1470],{"class":152,"line":468},[150,1429,1430],{"class":806},"  box-shadow",[150,1432,1220],{"class":156},[150,1434,1435],{"class":806},"1",[150,1437,1239],{"class":1099},[150,1439,1440],{"class":806}," 1",[150,1442,1239],{"class":1099},[150,1444,1440],{"class":806},[150,1446,1239],{"class":1099},[150,1448,1449],{"class":806}," #333",[150,1451,1452],{"class":156},", ",[150,1454,1455],{"class":806},"2",[150,1457,1239],{"class":1099},[150,1459,1460],{"class":806}," 2",[150,1462,1239],{"class":1099},[150,1464,1460],{"class":806},[150,1466,1239],{"class":1099},[150,1468,1469],{"class":806}," #ccc",[150,1471,1226],{"class":156},[150,1473,1474],{"class":152,"line":474},[150,1475,1246],{"class":156},[150,1477,1478],{"class":152,"line":483},[150,1479,465],{"emptyLinePlaceholder":464},[150,1481,1482],{"class":152,"line":496},[150,1483,1484],{"class":398},"\u002F* 颜色函数括号内不留空格 *\u002F\n",[150,1486,1487,1489],{"class":152,"line":506},[150,1488,1111],{"class":164},[150,1490,1212],{"class":156},[150,1492,1493,1496,1498,1501,1504,1507,1509,1511,1513,1515,1517,1520],{"class":152,"line":515},[150,1494,1495],{"class":806},"  color",[150,1497,1220],{"class":156},[150,1499,1500],{"class":806},"rgba",[150,1502,1503],{"class":156},"(",[150,1505,1506],{"class":806},"255",[150,1508,1452],{"class":156},[150,1510,1506],{"class":806},[150,1512,1452],{"class":156},[150,1514,1506],{"class":806},[150,1516,1452],{"class":156},[150,1518,1519],{"class":806},"0.5",[150,1521,1522],{"class":156},");\n",[150,1524,1526],{"class":152,"line":1525},14,[150,1527,1246],{"class":156},[13,1529,1530],{},"多个选择器各占一行，新声明块另起一行：",[141,1532,1534],{"className":1085,"code":1533,"language":1087,"meta":146,"style":146},"\u002F* 推荐 *\u002F\n.jdc,\n.jdc_logo,\n.jdc_hd {\n  color: #ff0;\n}\n.nav {\n  color: #fff;\n}\n\n\u002F* 不推荐 *\u002F\n.jdc,jdc_logo,.jdc_hd {\n  color: #ff0;\n}.nav {\n  color: #fff;\n}\n",[89,1535,1536,1540,1547,1554,1561,1572,1576,1583,1594,1598,1602,1606,1617,1627,1636,1647],{"__ignoreMap":146},[150,1537,1538],{"class":152,"line":153},[150,1539,1094],{"class":398},[150,1541,1542,1544],{"class":152,"line":402},[150,1543,1111],{"class":164},[150,1545,1546],{"class":156},",\n",[150,1548,1549,1552],{"class":152,"line":412},[150,1550,1551],{"class":164},".jdc_logo",[150,1553,1546],{"class":156},[150,1555,1556,1559],{"class":152,"line":428},[150,1557,1558],{"class":164},".jdc_hd",[150,1560,1212],{"class":156},[150,1562,1563,1565,1567,1570],{"class":152,"line":442},[150,1564,1495],{"class":806},[150,1566,1220],{"class":156},[150,1568,1569],{"class":806},"#ff0",[150,1571,1226],{"class":156},[150,1573,1574],{"class":152,"line":452},[150,1575,1246],{"class":156},[150,1577,1578,1581],{"class":152,"line":461},[150,1579,1580],{"class":164},".nav",[150,1582,1212],{"class":156},[150,1584,1585,1587,1589,1592],{"class":152,"line":468},[150,1586,1495],{"class":806},[150,1588,1220],{"class":156},[150,1590,1591],{"class":806},"#fff",[150,1593,1226],{"class":156},[150,1595,1596],{"class":152,"line":474},[150,1597,1246],{"class":156},[150,1599,1600],{"class":152,"line":483},[150,1601,465],{"emptyLinePlaceholder":464},[150,1603,1604],{"class":152,"line":496},[150,1605,1255],{"class":398},[150,1607,1608,1610,1613,1615],{"class":152,"line":506},[150,1609,1111],{"class":164},[150,1611,1612],{"class":156},",jdc_logo,",[150,1614,1558],{"class":164},[150,1616,1212],{"class":156},[150,1618,1619,1621,1623,1625],{"class":152,"line":515},[150,1620,1495],{"class":806},[150,1622,1220],{"class":156},[150,1624,1569],{"class":806},[150,1626,1226],{"class":156},[150,1628,1629,1632,1634],{"class":152,"line":1525},[150,1630,1631],{"class":156},"}",[150,1633,1580],{"class":164},[150,1635,1212],{"class":156},[150,1637,1639,1641,1643,1645],{"class":152,"line":1638},15,[150,1640,1495],{"class":806},[150,1642,1220],{"class":156},[150,1644,1591],{"class":806},[150,1646,1226],{"class":156},[150,1648,1650],{"class":152,"line":1649},16,[150,1651,1246],{"class":156},[133,1653,1655],{"id":1654},"_25-取值简写","2.5 取值简写",[13,1657,1658,1659,1662,1663,250],{},"十六进制颜色能简写则简写；",[89,1660,1661],{},"0"," 值",[19,1664,1665],{},"不带单位",[141,1667,1669],{"className":1085,"code":1668,"language":1087,"meta":146,"style":146},"\u002F* 推荐 *\u002F\n.jdc {\n  color: #fff;\n  margin: 0 10px;\n}\n\n\u002F* 不推荐 *\u002F\n.jdc {\n  color: #ffffff;\n  margin: 0px 10px;\n}\n",[89,1670,1671,1675,1681,1691,1707,1711,1715,1719,1725,1736,1752],{"__ignoreMap":146},[150,1672,1673],{"class":152,"line":153},[150,1674,1094],{"class":398},[150,1676,1677,1679],{"class":152,"line":402},[150,1678,1111],{"class":164},[150,1680,1212],{"class":156},[150,1682,1683,1685,1687,1689],{"class":152,"line":412},[150,1684,1495],{"class":806},[150,1686,1220],{"class":156},[150,1688,1591],{"class":806},[150,1690,1226],{"class":156},[150,1692,1693,1696,1698,1700,1703,1705],{"class":152,"line":428},[150,1694,1695],{"class":806},"  margin",[150,1697,1220],{"class":156},[150,1699,1661],{"class":806},[150,1701,1702],{"class":806}," 10",[150,1704,1239],{"class":1099},[150,1706,1226],{"class":156},[150,1708,1709],{"class":152,"line":442},[150,1710,1246],{"class":156},[150,1712,1713],{"class":152,"line":452},[150,1714,465],{"emptyLinePlaceholder":464},[150,1716,1717],{"class":152,"line":461},[150,1718,1255],{"class":398},[150,1720,1721,1723],{"class":152,"line":468},[150,1722,1111],{"class":164},[150,1724,1212],{"class":156},[150,1726,1727,1729,1731,1734],{"class":152,"line":474},[150,1728,1495],{"class":806},[150,1730,1220],{"class":156},[150,1732,1733],{"class":806},"#ffffff",[150,1735,1226],{"class":156},[150,1737,1738,1740,1742,1744,1746,1748,1750],{"class":152,"line":483},[150,1739,1695],{"class":806},[150,1741,1220],{"class":156},[150,1743,1661],{"class":806},[150,1745,1239],{"class":1099},[150,1747,1702],{"class":806},[150,1749,1239],{"class":1099},[150,1751,1226],{"class":156},[150,1753,1754],{"class":152,"line":496},[150,1755,1246],{"class":156},[133,1757,1759],{"id":1758},"_26-属性值引号","2.6 属性值引号",[13,1761,1762,1763,1766],{},"CSS 中需要引号时统一用",[19,1764,1765],{},"单引号","（注意：与 HTML 属性用双引号的规则相反，勿混淆）。",[141,1768,1770],{"className":1085,"code":1769,"language":1087,"meta":146,"style":146},"\u002F* 推荐 *\u002F\n.jdc {\n  font-family: 'Hiragino Sans GB';\n}\n",[89,1771,1772,1776,1782,1794],{"__ignoreMap":146},[150,1773,1774],{"class":152,"line":153},[150,1775,1094],{"class":398},[150,1777,1778,1780],{"class":152,"line":402},[150,1779,1111],{"class":164},[150,1781,1212],{"class":156},[150,1783,1784,1787,1789,1792],{"class":152,"line":412},[150,1785,1786],{"class":806},"  font-family",[150,1788,1220],{"class":156},[150,1790,1791],{"class":204},"'Hiragino Sans GB'",[150,1793,1226],{"class":156},[150,1795,1796],{"class":152,"line":428},[150,1797,1246],{"class":156},[133,1799,1801],{"id":1800},"_27-私有前缀","2.7 私有前缀",[13,1803,1804],{},"浏览器私有前缀在前，标准属性在后，确保标准实现最终生效。",[141,1806,1808],{"className":1085,"code":1807,"language":1087,"meta":146,"style":146},".jdc {\n  -webkit-border-radius: 10px;\n  -moz-border-radius: 10px;\n  -ms-border-radius: 10px;\n  border-radius: 10px;\n}\n",[89,1809,1810,1816,1830,1843,1856,1869],{"__ignoreMap":146},[150,1811,1812,1814],{"class":152,"line":153},[150,1813,1111],{"class":164},[150,1815,1212],{"class":156},[150,1817,1818,1821,1823,1826,1828],{"class":152,"line":402},[150,1819,1820],{"class":806},"  -webkit-border-radius",[150,1822,1220],{"class":156},[150,1824,1825],{"class":806},"10",[150,1827,1239],{"class":1099},[150,1829,1226],{"class":156},[150,1831,1832,1835,1837,1839,1841],{"class":152,"line":412},[150,1833,1834],{"class":806},"  -moz-border-radius",[150,1836,1220],{"class":156},[150,1838,1825],{"class":806},[150,1840,1239],{"class":1099},[150,1842,1226],{"class":156},[150,1844,1845,1848,1850,1852,1854],{"class":152,"line":428},[150,1846,1847],{"class":806},"  -ms-border-radius",[150,1849,1220],{"class":156},[150,1851,1825],{"class":806},[150,1853,1239],{"class":1099},[150,1855,1226],{"class":156},[150,1857,1858,1861,1863,1865,1867],{"class":152,"line":442},[150,1859,1860],{"class":806},"  border-radius",[150,1862,1220],{"class":156},[150,1864,1825],{"class":806},[150,1866,1239],{"class":1099},[150,1868,1226],{"class":156},[150,1870,1871],{"class":152,"line":452},[150,1872,1246],{"class":156},[10,1874,1875],{},[13,1876,1877],{},"现代项目建议交由 Autoprefixer 处理，不手写前缀。手写仅用于工具链不可用的场景。",[126,1879],{},[24,1881,1883],{"id":1882},"三javascript-规范","三、JavaScript 规范",[133,1885,1887],{"id":1886},"_31-变量声明","3.1 变量声明",[13,1889,1890,1904],{},[19,1891,1892,1893,1896,1897,1900,1901,250],{},"一律使用 ",[89,1894,1895],{},"const","，需要重新赋值时才用 ",[89,1898,1899],{},"let","，禁用 ",[89,1902,1903],{},"var"," 未加关键字的赋值会污染全局作用域，绝对禁止。",[141,1906,1910],{"className":1907,"code":1908,"language":1909,"meta":146,"style":146},"language-js shiki shiki-themes github-light github-dark","\u002F\u002F bad\nvar a = 1;\ndemo = new Demo();\n\n\u002F\u002F good\nconst a = 1;\nlet count = 1;\nconst demo = new Demo();\n","js",[89,1911,1912,1917,1930,1946,1950,1955,1969,1982],{"__ignoreMap":146},[150,1913,1914],{"class":152,"line":153},[150,1915,1916],{"class":398},"\u002F\u002F bad\n",[150,1918,1919,1921,1924,1926,1928],{"class":152,"line":402},[150,1920,1903],{"class":1099},[150,1922,1923],{"class":156}," a ",[150,1925,201],{"class":1099},[150,1927,1440],{"class":806},[150,1929,1226],{"class":156},[150,1931,1932,1935,1937,1940,1943],{"class":152,"line":412},[150,1933,1934],{"class":156},"demo ",[150,1936,201],{"class":1099},[150,1938,1939],{"class":1099}," new",[150,1941,1942],{"class":164}," Demo",[150,1944,1945],{"class":156},"();\n",[150,1947,1948],{"class":152,"line":428},[150,1949,465],{"emptyLinePlaceholder":464},[150,1951,1952],{"class":152,"line":442},[150,1953,1954],{"class":398},"\u002F\u002F good\n",[150,1956,1957,1959,1962,1965,1967],{"class":152,"line":452},[150,1958,1895],{"class":1099},[150,1960,1961],{"class":806}," a",[150,1963,1964],{"class":1099}," =",[150,1966,1440],{"class":806},[150,1968,1226],{"class":156},[150,1970,1971,1973,1976,1978,1980],{"class":152,"line":461},[150,1972,1899],{"class":1099},[150,1974,1975],{"class":156}," count ",[150,1977,201],{"class":1099},[150,1979,1440],{"class":806},[150,1981,1226],{"class":156},[150,1983,1984,1986,1989,1991,1993,1995],{"class":152,"line":468},[150,1985,1895],{"class":1099},[150,1987,1988],{"class":806}," demo",[150,1990,1964],{"class":1099},[150,1992,1939],{"class":1099},[150,1994,1942],{"class":164},[150,1996,1945],{"class":156},[13,1998,1999,770,2001,2003],{},[89,2000,1895],{},[89,2002,1899],{}," 分组声明：",[141,2005,2007],{"className":1907,"code":2006,"language":1909,"meta":146,"style":146},"\u002F\u002F bad\nlet a;\nconst b;\nlet c;\n\n\u002F\u002F good\nconst b;\nlet a;\nlet c;\n",[89,2008,2009,2013,2020,2029,2036,2040,2044,2052,2058],{"__ignoreMap":146},[150,2010,2011],{"class":152,"line":153},[150,2012,1916],{"class":398},[150,2014,2015,2017],{"class":152,"line":402},[150,2016,1899],{"class":1099},[150,2018,2019],{"class":156}," a;\n",[150,2021,2022,2024,2027],{"class":152,"line":412},[150,2023,1895],{"class":1099},[150,2025,2026],{"class":806}," b",[150,2028,1226],{"class":156},[150,2030,2031,2033],{"class":152,"line":428},[150,2032,1899],{"class":1099},[150,2034,2035],{"class":156}," c;\n",[150,2037,2038],{"class":152,"line":442},[150,2039,465],{"emptyLinePlaceholder":464},[150,2041,2042],{"class":152,"line":452},[150,2043,1954],{"class":398},[150,2045,2046,2048,2050],{"class":152,"line":461},[150,2047,1895],{"class":1099},[150,2049,2026],{"class":806},[150,2051,1226],{"class":156},[150,2053,2054,2056],{"class":152,"line":468},[150,2055,1899],{"class":1099},[150,2057,2019],{"class":156},[150,2059,2060,2062],{"class":152,"line":474},[150,2061,1899],{"class":1099},[150,2063,2035],{"class":156},[133,2065,2067],{"id":2066},"_32-对象与数组","3.2 对象与数组",[13,2069,2070],{},"一律使用字面量创建，禁用构造函数形式。",[141,2072,2074],{"className":1907,"code":2073,"language":1909,"meta":146,"style":146},"\u002F\u002F bad\nconst a = new Object();\nconst items = new Array();\n\n\u002F\u002F good\nconst a = {};\nconst items = [];\n",[89,2075,2076,2080,2095,2111,2115,2119,2130],{"__ignoreMap":146},[150,2077,2078],{"class":152,"line":153},[150,2079,1916],{"class":398},[150,2081,2082,2084,2086,2088,2090,2093],{"class":152,"line":402},[150,2083,1895],{"class":1099},[150,2085,1961],{"class":806},[150,2087,1964],{"class":1099},[150,2089,1939],{"class":1099},[150,2091,2092],{"class":164}," Object",[150,2094,1945],{"class":156},[150,2096,2097,2099,2102,2104,2106,2109],{"class":152,"line":412},[150,2098,1895],{"class":1099},[150,2100,2101],{"class":806}," items",[150,2103,1964],{"class":1099},[150,2105,1939],{"class":1099},[150,2107,2108],{"class":164}," Array",[150,2110,1945],{"class":156},[150,2112,2113],{"class":152,"line":428},[150,2114,465],{"emptyLinePlaceholder":464},[150,2116,2117],{"class":152,"line":442},[150,2118,1954],{"class":398},[150,2120,2121,2123,2125,2127],{"class":152,"line":452},[150,2122,1895],{"class":1099},[150,2124,1961],{"class":806},[150,2126,1964],{"class":1099},[150,2128,2129],{"class":156}," {};\n",[150,2131,2132,2134,2136,2138],{"class":152,"line":461},[150,2133,1895],{"class":1099},[150,2135,2101],{"class":806},[150,2137,1964],{"class":1099},[150,2139,2140],{"class":156}," [];\n",[13,2142,2143,2144,2147],{},"添加数组元素用 ",[89,2145,2146],{},"push","，不要用索引赋值：",[141,2149,2151],{"className":1907,"code":2150,"language":1909,"meta":146,"style":146},"\u002F\u002F bad\nitems[items.length] = 'test';\n\n\u002F\u002F good\nitems.push('test');\n",[89,2152,2153,2157,2175,2179,2183],{"__ignoreMap":146},[150,2154,2155],{"class":152,"line":153},[150,2156,1916],{"class":398},[150,2158,2159,2162,2165,2168,2170,2173],{"class":152,"line":402},[150,2160,2161],{"class":156},"items[items.",[150,2163,2164],{"class":806},"length",[150,2166,2167],{"class":156},"] ",[150,2169,201],{"class":1099},[150,2171,2172],{"class":204}," 'test'",[150,2174,1226],{"class":156},[150,2176,2177],{"class":152,"line":412},[150,2178,465],{"emptyLinePlaceholder":464},[150,2180,2181],{"class":152,"line":428},[150,2182,1954],{"class":398},[150,2184,2185,2188,2190,2192,2195],{"class":152,"line":442},[150,2186,2187],{"class":156},"items.",[150,2189,2146],{"class":164},[150,2191,1503],{"class":156},[150,2193,2194],{"class":204},"'test'",[150,2196,1522],{"class":156},[13,2198,2199,2200,2203],{},"使用属性与方法简写，且简写属性",[19,2201,2202],{},"集中放在前面","：",[141,2205,2207],{"className":1907,"code":2206,"language":1909,"meta":146,"style":146},"const job = 'FrontEnd';\nconst department = 'JDC';\n\n\u002F\u002F good\nconst item = {\n  job,\n  department,\n  sex: 'male',\n  age: 25,\n\n  addValue(val) {\n    return item.value + val;\n  }\n};\n",[89,2208,2209,2223,2237,2241,2245,2256,2261,2266,2276,2286,2290,2304,2318,2323],{"__ignoreMap":146},[150,2210,2211,2213,2216,2218,2221],{"class":152,"line":153},[150,2212,1895],{"class":1099},[150,2214,2215],{"class":806}," job",[150,2217,1964],{"class":1099},[150,2219,2220],{"class":204}," 'FrontEnd'",[150,2222,1226],{"class":156},[150,2224,2225,2227,2230,2232,2235],{"class":152,"line":402},[150,2226,1895],{"class":1099},[150,2228,2229],{"class":806}," department",[150,2231,1964],{"class":1099},[150,2233,2234],{"class":204}," 'JDC'",[150,2236,1226],{"class":156},[150,2238,2239],{"class":152,"line":412},[150,2240,465],{"emptyLinePlaceholder":464},[150,2242,2243],{"class":152,"line":428},[150,2244,1954],{"class":398},[150,2246,2247,2249,2252,2254],{"class":152,"line":442},[150,2248,1895],{"class":1099},[150,2250,2251],{"class":806}," item",[150,2253,1964],{"class":1099},[150,2255,1212],{"class":156},[150,2257,2258],{"class":152,"line":452},[150,2259,2260],{"class":156},"  job,\n",[150,2262,2263],{"class":152,"line":461},[150,2264,2265],{"class":156},"  department,\n",[150,2267,2268,2271,2274],{"class":152,"line":468},[150,2269,2270],{"class":156},"  sex: ",[150,2272,2273],{"class":204},"'male'",[150,2275,1546],{"class":156},[150,2277,2278,2281,2284],{"class":152,"line":474},[150,2279,2280],{"class":156},"  age: ",[150,2282,2283],{"class":806},"25",[150,2285,1546],{"class":156},[150,2287,2288],{"class":152,"line":483},[150,2289,465],{"emptyLinePlaceholder":464},[150,2291,2292,2295,2297,2301],{"class":152,"line":496},[150,2293,2294],{"class":164},"  addValue",[150,2296,1503],{"class":156},[150,2298,2300],{"class":2299},"s4XuR","val",[150,2302,2303],{"class":156},") {\n",[150,2305,2306,2309,2312,2315],{"class":152,"line":506},[150,2307,2308],{"class":1099},"    return",[150,2310,2311],{"class":156}," item.value ",[150,2313,2314],{"class":1099},"+",[150,2316,2317],{"class":156}," val;\n",[150,2319,2320],{"class":152,"line":515},[150,2321,2322],{"class":156},"  }\n",[150,2324,2325],{"class":152,"line":1525},[150,2326,2327],{"class":156},"};\n",[13,2329,2330,2331,279,2334,279,2337,2340],{},"不要用保留字作为键名（",[89,2332,2333],{},"default",[89,2335,2336],{},"class",[89,2338,2339],{},"new"," 等）。",[133,2342,2344],{"id":2343},"_33-解构赋值","3.3 解构赋值",[13,2346,2347,2348,2351],{},"取对象多个属性、数组多个值时使用解构。",[19,2349,2350],{},"函数返回多值时用对象解构而非数组解构","——数组解构强迫调用方记住顺序。",[141,2353,2355],{"className":1907,"code":2354,"language":1909,"meta":146,"style":146},"\u002F\u002F good\nfunction getFullName ({ firstName, lastName }) {\n  return `${firstName} ${lastName}`;\n}\n\n\u002F\u002F good：调用方无需关心顺序\nfunction doSomething () {\n  return { top, right, bottom, left };\n}\nconst { top, left } = doSomething();\n",[89,2356,2357,2361,2383,2403,2407,2411,2416,2426,2433,2437],{"__ignoreMap":146},[150,2358,2359],{"class":152,"line":153},[150,2360,1954],{"class":398},[150,2362,2363,2366,2369,2372,2375,2377,2380],{"class":152,"line":402},[150,2364,2365],{"class":1099},"function",[150,2367,2368],{"class":164}," getFullName",[150,2370,2371],{"class":156}," ({ ",[150,2373,2374],{"class":2299},"firstName",[150,2376,1452],{"class":156},[150,2378,2379],{"class":2299},"lastName",[150,2381,2382],{"class":156}," }) {\n",[150,2384,2385,2388,2391,2393,2396,2398,2401],{"class":152,"line":412},[150,2386,2387],{"class":1099},"  return",[150,2389,2390],{"class":204}," `${",[150,2392,2374],{"class":156},[150,2394,2395],{"class":204},"} ${",[150,2397,2379],{"class":156},[150,2399,2400],{"class":204},"}`",[150,2402,1226],{"class":156},[150,2404,2405],{"class":152,"line":428},[150,2406,1246],{"class":156},[150,2408,2409],{"class":152,"line":442},[150,2410,465],{"emptyLinePlaceholder":464},[150,2412,2413],{"class":152,"line":452},[150,2414,2415],{"class":398},"\u002F\u002F good：调用方无需关心顺序\n",[150,2417,2418,2420,2423],{"class":152,"line":461},[150,2419,2365],{"class":1099},[150,2421,2422],{"class":164}," doSomething",[150,2424,2425],{"class":156}," () {\n",[150,2427,2428,2430],{"class":152,"line":468},[150,2429,2387],{"class":1099},[150,2431,2432],{"class":156}," { top, right, bottom, left };\n",[150,2434,2435],{"class":152,"line":474},[150,2436,1246],{"class":156},[150,2438,2439,2441,2443,2446,2448,2451,2454,2456,2458],{"class":152,"line":483},[150,2440,1895],{"class":1099},[150,2442,1262],{"class":156},[150,2444,2445],{"class":806},"top",[150,2447,1452],{"class":156},[150,2449,2450],{"class":806},"left",[150,2452,2453],{"class":156}," } ",[150,2455,201],{"class":1099},[150,2457,2422],{"class":164},[150,2459,1945],{"class":156},[133,2461,2463],{"id":2462},"_34-字符串","3.4 字符串",[13,2465,2466,2467,2469,2470,2472,2473,250],{},"统一",[19,2468,1765],{},"。拼接用模板字符串，长字符串换行用 ",[89,2471,2314],{}," 且运算符置于行尾，禁用续行符 ",[89,2474,2475],{},"\\",[141,2477,2479],{"className":1907,"code":2478,"language":1909,"meta":146,"style":146},"\u002F\u002F good\nconst department = 'JDC';\nconst str = `ab${test}`;\n\nconst long = '凹凸实验室 凹凸实验室' +\n  '凹凸实验室 凹凸实验室';\n",[89,2480,2481,2485,2497,2516,2520,2535],{"__ignoreMap":146},[150,2482,2483],{"class":152,"line":153},[150,2484,1954],{"class":398},[150,2486,2487,2489,2491,2493,2495],{"class":152,"line":402},[150,2488,1895],{"class":1099},[150,2490,2229],{"class":806},[150,2492,1964],{"class":1099},[150,2494,2234],{"class":204},[150,2496,1226],{"class":156},[150,2498,2499,2501,2504,2506,2509,2512,2514],{"class":152,"line":412},[150,2500,1895],{"class":1099},[150,2502,2503],{"class":806}," str",[150,2505,1964],{"class":1099},[150,2507,2508],{"class":204}," `ab${",[150,2510,2511],{"class":156},"test",[150,2513,2400],{"class":204},[150,2515,1226],{"class":156},[150,2517,2518],{"class":152,"line":428},[150,2519,465],{"emptyLinePlaceholder":464},[150,2521,2522,2524,2527,2529,2532],{"class":152,"line":442},[150,2523,1895],{"class":1099},[150,2525,2526],{"class":806}," long",[150,2528,1964],{"class":1099},[150,2530,2531],{"class":204}," '凹凸实验室 凹凸实验室'",[150,2533,2534],{"class":1099}," +\n",[150,2536,2537,2540],{"class":152,"line":452},[150,2538,2539],{"class":204},"  '凹凸实验室 凹凸实验室'",[150,2541,1226],{"class":156},[133,2543,2545],{"id":2544},"_35-函数","3.5 函数",[372,2547,2548,2555,2558,2568,2571],{},[375,2549,2550,2551,2554],{},"优先使用",[19,2552,2553],{},"函数声明","而非函数表达式（声明会被完整提升，利于组织代码）",[375,2556,2557],{},"参数不超过 5 个",[375,2559,2560,2561,217,2564,2567],{},"不在非函数代码块（",[89,2562,2563],{},"if",[89,2565,2566],{},"for","）内声明函数",[375,2569,2570],{},"用默认参数替代对参数重新赋值",[375,2572,2573,2574,2577,2578,2581],{},"用剩余参数 ",[89,2575,2576],{},"...args"," 替代 ",[89,2579,2580],{},"arguments","（前者是真数组）",[141,2583,2585],{"className":1907,"code":2584,"language":1909,"meta":146,"style":146},"\u002F\u002F bad\nconst foo = function () {};\nfunction test (opts) {\n  opts = opts || {};\n}\nfunction test () {\n  const args = Array.prototype.slice.call(arguments);\n}\n\n\u002F\u002F good\nfunction foo () {}\nfunction test (opts = {}) {}\nfunction test (...args) {\n  return args.join('');\n}\n\n\u002F\u002F bad：块内声明函数\nif (isUse) {\n  function test () {}\n}\n\n\u002F\u002F good\nlet test;\nif (isUse) {\n  test = () => {};\n}\n",[89,2586,2587,2591,2606,2621,2636,2640,2648,2678,2682,2686,2690,2699,2714,2730,2747,2751,2755,2761,2769,2779,2784,2789,2794,2802,2809,2825],{"__ignoreMap":146},[150,2588,2589],{"class":152,"line":153},[150,2590,1916],{"class":398},[150,2592,2593,2595,2598,2600,2603],{"class":152,"line":402},[150,2594,1895],{"class":1099},[150,2596,2597],{"class":164}," foo",[150,2599,1964],{"class":1099},[150,2601,2602],{"class":1099}," function",[150,2604,2605],{"class":156}," () {};\n",[150,2607,2608,2610,2613,2616,2619],{"class":152,"line":412},[150,2609,2365],{"class":1099},[150,2611,2612],{"class":164}," test",[150,2614,2615],{"class":156}," (",[150,2617,2618],{"class":2299},"opts",[150,2620,2303],{"class":156},[150,2622,2623,2626,2628,2631,2634],{"class":152,"line":428},[150,2624,2625],{"class":156},"  opts ",[150,2627,201],{"class":1099},[150,2629,2630],{"class":156}," opts ",[150,2632,2633],{"class":1099},"||",[150,2635,2129],{"class":156},[150,2637,2638],{"class":152,"line":442},[150,2639,1246],{"class":156},[150,2641,2642,2644,2646],{"class":152,"line":452},[150,2643,2365],{"class":1099},[150,2645,2612],{"class":164},[150,2647,2425],{"class":156},[150,2649,2650,2653,2656,2658,2660,2663,2666,2669,2672,2674,2676],{"class":152,"line":461},[150,2651,2652],{"class":1099},"  const",[150,2654,2655],{"class":806}," args",[150,2657,1964],{"class":1099},[150,2659,2108],{"class":806},[150,2661,2662],{"class":156},".",[150,2664,2665],{"class":806},"prototype",[150,2667,2668],{"class":156},".slice.",[150,2670,2671],{"class":164},"call",[150,2673,1503],{"class":156},[150,2675,2580],{"class":806},[150,2677,1522],{"class":156},[150,2679,2680],{"class":152,"line":468},[150,2681,1246],{"class":156},[150,2683,2684],{"class":152,"line":474},[150,2685,465],{"emptyLinePlaceholder":464},[150,2687,2688],{"class":152,"line":483},[150,2689,1954],{"class":398},[150,2691,2692,2694,2696],{"class":152,"line":496},[150,2693,2365],{"class":1099},[150,2695,2597],{"class":164},[150,2697,2698],{"class":156}," () {}\n",[150,2700,2701,2703,2705,2707,2709,2711],{"class":152,"line":506},[150,2702,2365],{"class":1099},[150,2704,2612],{"class":164},[150,2706,2615],{"class":156},[150,2708,2618],{"class":2299},[150,2710,1964],{"class":1099},[150,2712,2713],{"class":156}," {}) {}\n",[150,2715,2716,2718,2720,2722,2725,2728],{"class":152,"line":515},[150,2717,2365],{"class":1099},[150,2719,2612],{"class":164},[150,2721,2615],{"class":156},[150,2723,2724],{"class":1099},"...",[150,2726,2727],{"class":2299},"args",[150,2729,2303],{"class":156},[150,2731,2732,2734,2737,2740,2742,2745],{"class":152,"line":1525},[150,2733,2387],{"class":1099},[150,2735,2736],{"class":156}," args.",[150,2738,2739],{"class":164},"join",[150,2741,1503],{"class":156},[150,2743,2744],{"class":204},"''",[150,2746,1522],{"class":156},[150,2748,2749],{"class":152,"line":1638},[150,2750,1246],{"class":156},[150,2752,2753],{"class":152,"line":1649},[150,2754,465],{"emptyLinePlaceholder":464},[150,2756,2758],{"class":152,"line":2757},17,[150,2759,2760],{"class":398},"\u002F\u002F bad：块内声明函数\n",[150,2762,2764,2766],{"class":152,"line":2763},18,[150,2765,2563],{"class":1099},[150,2767,2768],{"class":156}," (isUse) {\n",[150,2770,2772,2775,2777],{"class":152,"line":2771},19,[150,2773,2774],{"class":1099},"  function",[150,2776,2612],{"class":164},[150,2778,2698],{"class":156},[150,2780,2782],{"class":152,"line":2781},20,[150,2783,1246],{"class":156},[150,2785,2787],{"class":152,"line":2786},21,[150,2788,465],{"emptyLinePlaceholder":464},[150,2790,2792],{"class":152,"line":2791},22,[150,2793,1954],{"class":398},[150,2795,2797,2799],{"class":152,"line":2796},23,[150,2798,1899],{"class":1099},[150,2800,2801],{"class":156}," test;\n",[150,2803,2805,2807],{"class":152,"line":2804},24,[150,2806,2563],{"class":1099},[150,2808,2768],{"class":156},[150,2810,2812,2815,2817,2820,2823],{"class":152,"line":2811},25,[150,2813,2814],{"class":164},"  test",[150,2816,1964],{"class":1099},[150,2818,2819],{"class":156}," () ",[150,2821,2822],{"class":1099},"=>",[150,2824,2129],{"class":156},[150,2826,2828],{"class":152,"line":2827},26,[150,2829,1246],{"class":156},[133,2831,2833],{"id":2832},"_36-类与原型","3.6 类与原型",[13,2835,175,2836,2838,2839,250,2841,2844,2845,250],{},[89,2837,2336],{}," 语法，避免直接操作 ",[89,2840,2665],{},[19,2842,2843],{},"派生类","的 constructor 中必须调用 ",[89,2846,2847],{},"super()",[141,2849,2851],{"className":1907,"code":2850,"language":1909,"meta":146,"style":146},"\u002F\u002F good\nclass Queue {\n  constructor (contents = []) {\n    this._queue = [...contents];\n  }\n\n  pop () {\n    const value = this._queue[0];\n    this._queue.splice(0, 1);\n    return value;\n  }\n}\n\n\u002F\u002F 派生类才需要 super()\nclass PriorityQueue extends Queue {\n  constructor (contents = []) {\n    super(contents);\n  }\n}\n",[89,2852,2853,2857,2866,2881,2899,2903,2907,2914,2935,2955,2962,2966,2970,2974,2979,2993,3005,3013,3017],{"__ignoreMap":146},[150,2854,2855],{"class":152,"line":153},[150,2856,1954],{"class":398},[150,2858,2859,2861,2864],{"class":152,"line":402},[150,2860,2336],{"class":1099},[150,2862,2863],{"class":164}," Queue",[150,2865,1212],{"class":156},[150,2867,2868,2871,2873,2876,2878],{"class":152,"line":412},[150,2869,2870],{"class":1099},"  constructor",[150,2872,2615],{"class":156},[150,2874,2875],{"class":2299},"contents",[150,2877,1964],{"class":1099},[150,2879,2880],{"class":156}," []) {\n",[150,2882,2883,2886,2889,2891,2894,2896],{"class":152,"line":428},[150,2884,2885],{"class":806},"    this",[150,2887,2888],{"class":156},"._queue ",[150,2890,201],{"class":1099},[150,2892,2893],{"class":156}," [",[150,2895,2724],{"class":1099},[150,2897,2898],{"class":156},"contents];\n",[150,2900,2901],{"class":152,"line":442},[150,2902,2322],{"class":156},[150,2904,2905],{"class":152,"line":452},[150,2906,465],{"emptyLinePlaceholder":464},[150,2908,2909,2912],{"class":152,"line":461},[150,2910,2911],{"class":164},"  pop",[150,2913,2425],{"class":156},[150,2915,2916,2919,2922,2924,2927,2930,2932],{"class":152,"line":468},[150,2917,2918],{"class":1099},"    const",[150,2920,2921],{"class":806}," value",[150,2923,1964],{"class":1099},[150,2925,2926],{"class":806}," this",[150,2928,2929],{"class":156},"._queue[",[150,2931,1661],{"class":806},[150,2933,2934],{"class":156},"];\n",[150,2936,2937,2939,2942,2945,2947,2949,2951,2953],{"class":152,"line":474},[150,2938,2885],{"class":806},[150,2940,2941],{"class":156},"._queue.",[150,2943,2944],{"class":164},"splice",[150,2946,1503],{"class":156},[150,2948,1661],{"class":806},[150,2950,1452],{"class":156},[150,2952,1435],{"class":806},[150,2954,1522],{"class":156},[150,2956,2957,2959],{"class":152,"line":483},[150,2958,2308],{"class":1099},[150,2960,2961],{"class":156}," value;\n",[150,2963,2964],{"class":152,"line":496},[150,2965,2322],{"class":156},[150,2967,2968],{"class":152,"line":506},[150,2969,1246],{"class":156},[150,2971,2972],{"class":152,"line":515},[150,2973,465],{"emptyLinePlaceholder":464},[150,2975,2976],{"class":152,"line":1525},[150,2977,2978],{"class":398},"\u002F\u002F 派生类才需要 super()\n",[150,2980,2981,2983,2986,2989,2991],{"class":152,"line":1638},[150,2982,2336],{"class":1099},[150,2984,2985],{"class":164}," PriorityQueue",[150,2987,2988],{"class":1099}," extends",[150,2990,2863],{"class":164},[150,2992,1212],{"class":156},[150,2994,2995,2997,2999,3001,3003],{"class":152,"line":1649},[150,2996,2870],{"class":1099},[150,2998,2615],{"class":156},[150,3000,2875],{"class":2299},[150,3002,1964],{"class":1099},[150,3004,2880],{"class":156},[150,3006,3007,3010],{"class":152,"line":2757},[150,3008,3009],{"class":806},"    super",[150,3011,3012],{"class":156},"(contents);\n",[150,3014,3015],{"class":152,"line":2763},[150,3016,2322],{"class":156},[150,3018,3019],{"class":152,"line":2771},[150,3020,1246],{"class":156},[10,3022,3023],{},[13,3024,3025,3028,3029,3031,3032,3035,3036,3038,3039,3041,3042,250,3045,3047,3048,3051,3052,3055],{},[19,3026,3027],{},"修订说明","：原规范写「constructor 必须加 ",[89,3030,2847],{},"」并在一个",[19,3033,3034],{},"非派生类","示例中调用 ",[89,3037,2847],{},"。这是错误的——基类 constructor 中调用 ",[89,3040,2847],{}," 会抛 ",[89,3043,3044],{},"SyntaxError",[89,3046,2847],{}," 仅在 ",[89,3049,3050],{},"extends"," 派生类中必需且必须在使用 ",[89,3053,3054],{},"this"," 之前调用。",[133,3057,3059],{"id":3058},"_37-模块","3.7 模块",[13,3061,3062,3063,3066,3067,3070,3071,3074],{},"使用 ES6 ",[89,3064,3065],{},"import"," \u002F ",[89,3068,3069],{},"export","，不使用 ",[89,3072,3073],{},"require","。避免通配符导入。",[141,3076,3078],{"className":1907,"code":3077,"language":1909,"meta":146,"style":146},"\u002F\u002F bad\nconst util = require('.\u002Futil');\nimport * as Util from '.\u002Futil';\n\n\u002F\u002F good\nimport Util from '.\u002Futil';\nimport { Util } from '.\u002Futil';\n",[89,3079,3080,3084,3103,3124,3128,3132,3144],{"__ignoreMap":146},[150,3081,3082],{"class":152,"line":153},[150,3083,1916],{"class":398},[150,3085,3086,3088,3091,3093,3096,3098,3101],{"class":152,"line":402},[150,3087,1895],{"class":1099},[150,3089,3090],{"class":806}," util",[150,3092,1964],{"class":1099},[150,3094,3095],{"class":164}," require",[150,3097,1503],{"class":156},[150,3099,3100],{"class":204},"'.\u002Futil'",[150,3102,1522],{"class":156},[150,3104,3105,3107,3110,3113,3116,3119,3122],{"class":152,"line":412},[150,3106,3065],{"class":1099},[150,3108,3109],{"class":806}," *",[150,3111,3112],{"class":1099}," as",[150,3114,3115],{"class":156}," Util ",[150,3117,3118],{"class":1099},"from",[150,3120,3121],{"class":204}," '.\u002Futil'",[150,3123,1226],{"class":156},[150,3125,3126],{"class":152,"line":428},[150,3127,465],{"emptyLinePlaceholder":464},[150,3129,3130],{"class":152,"line":442},[150,3131,1954],{"class":398},[150,3133,3134,3136,3138,3140,3142],{"class":152,"line":452},[150,3135,3065],{"class":1099},[150,3137,3115],{"class":156},[150,3139,3118],{"class":1099},[150,3141,3121],{"class":204},[150,3143,1226],{"class":156},[150,3145,3146,3148,3151,3153,3155],{"class":152,"line":461},[150,3147,3065],{"class":1099},[150,3149,3150],{"class":156}," { Util } ",[150,3152,3118],{"class":1099},[150,3154,3121],{"class":204},[150,3156,1226],{"class":156},[133,3158,3160],{"id":3159},"_38-迭代与属性访问","3.8 迭代与属性访问",[13,3162,3163,3164,217,3167,217,3170,3173,3174,3177],{},"优先使用数组高阶方法（",[89,3165,3166],{},"forEach",[89,3168,3169],{},"map",[89,3171,3172],{},"reduce","）而非 ",[89,3175,3176],{},"for...of","。访问对象属性用点号，仅在键名为变量时用方括号。",[141,3179,3181],{"className":1907,"code":3180,"language":1909,"meta":146,"style":146},"const numbers = [1, 2, 3, 4, 5];\n\n\u002F\u002F good\nconst sum = numbers.reduce((total, num) => total + num, 0);\n\n\u002F\u002F bad\nconst name = joke['name'];\n\n\u002F\u002F good\nconst name = joke.name;\n",[89,3182,3183,3217,3221,3225,3267,3271,3275,3291,3295,3299],{"__ignoreMap":146},[150,3184,3185,3187,3190,3192,3194,3196,3198,3200,3202,3205,3207,3210,3212,3215],{"class":152,"line":153},[150,3186,1895],{"class":1099},[150,3188,3189],{"class":806}," numbers",[150,3191,1964],{"class":1099},[150,3193,2893],{"class":156},[150,3195,1435],{"class":806},[150,3197,1452],{"class":156},[150,3199,1455],{"class":806},[150,3201,1452],{"class":156},[150,3203,3204],{"class":806},"3",[150,3206,1452],{"class":156},[150,3208,3209],{"class":806},"4",[150,3211,1452],{"class":156},[150,3213,3214],{"class":806},"5",[150,3216,2934],{"class":156},[150,3218,3219],{"class":152,"line":402},[150,3220,465],{"emptyLinePlaceholder":464},[150,3222,3223],{"class":152,"line":412},[150,3224,1954],{"class":398},[150,3226,3227,3229,3232,3234,3237,3239,3242,3245,3247,3250,3253,3255,3258,3260,3263,3265],{"class":152,"line":428},[150,3228,1895],{"class":1099},[150,3230,3231],{"class":806}," sum",[150,3233,1964],{"class":1099},[150,3235,3236],{"class":156}," numbers.",[150,3238,3172],{"class":164},[150,3240,3241],{"class":156},"((",[150,3243,3244],{"class":2299},"total",[150,3246,1452],{"class":156},[150,3248,3249],{"class":2299},"num",[150,3251,3252],{"class":156},") ",[150,3254,2822],{"class":1099},[150,3256,3257],{"class":156}," total ",[150,3259,2314],{"class":1099},[150,3261,3262],{"class":156}," num, ",[150,3264,1661],{"class":806},[150,3266,1522],{"class":156},[150,3268,3269],{"class":152,"line":442},[150,3270,465],{"emptyLinePlaceholder":464},[150,3272,3273],{"class":152,"line":452},[150,3274,1916],{"class":398},[150,3276,3277,3279,3281,3283,3286,3289],{"class":152,"line":461},[150,3278,1895],{"class":1099},[150,3280,709],{"class":806},[150,3282,1964],{"class":1099},[150,3284,3285],{"class":156}," joke[",[150,3287,3288],{"class":204},"'name'",[150,3290,2934],{"class":156},[150,3292,3293],{"class":152,"line":468},[150,3294,465],{"emptyLinePlaceholder":464},[150,3296,3297],{"class":152,"line":474},[150,3298,1954],{"class":398},[150,3300,3301,3303,3305,3307],{"class":152,"line":483},[150,3302,1895],{"class":1099},[150,3304,709],{"class":806},[150,3306,1964],{"class":1099},[150,3308,3309],{"class":156}," joke.name;\n",[13,3311,3312,217,3314,217,3316,3319,3320,3323],{},[89,3313,3169],{},[89,3315,3172],{},[89,3317,3318],{},"filter"," 回调必须有 ",[89,3321,3322],{},"return","（单表达式箭头函数的隐式返回除外）。",[133,3325,3327],{"id":3326},"_39-分号","3.9 分号",[13,3329,3330,3333],{},[19,3331,3332],{},"强制使用分号","，遵循 Standard 规范。",[141,3335,3337],{"className":1907,"code":3336,"language":1909,"meta":146,"style":146},"\u002F\u002F good\nconst test = 'good';\n(function () {\n  const str = 'hahaha';\n})();\n",[89,3338,3339,3343,3356,3364,3377],{"__ignoreMap":146},[150,3340,3341],{"class":152,"line":153},[150,3342,1954],{"class":398},[150,3344,3345,3347,3349,3351,3354],{"class":152,"line":402},[150,3346,1895],{"class":1099},[150,3348,2612],{"class":806},[150,3350,1964],{"class":1099},[150,3352,3353],{"class":204}," 'good'",[150,3355,1226],{"class":156},[150,3357,3358,3360,3362],{"class":152,"line":412},[150,3359,1503],{"class":156},[150,3361,2365],{"class":1099},[150,3363,2425],{"class":156},[150,3365,3366,3368,3370,3372,3375],{"class":152,"line":428},[150,3367,2652],{"class":1099},[150,3369,2503],{"class":806},[150,3371,1964],{"class":1099},[150,3373,3374],{"class":204}," 'hahaha'",[150,3376,1226],{"class":156},[150,3378,3379],{"class":152,"line":442},[150,3380,3381],{"class":156},"})();\n",[133,3383,3385],{"id":3384},"_310-禁用项","3.10 禁用项",[13,3387,3388],{},"以下一律禁止，无例外：",[32,3390,3391,3401],{},[35,3392,3393],{},[38,3394,3395,3398],{},[41,3396,3397],{},"禁用",[41,3399,3400],{},"原因",[52,3402,3403,3413,3423],{},[38,3404,3405,3410],{},[57,3406,3407],{},[89,3408,3409],{},"eval()",[57,3411,3412],{},"任意代码执行，安全风险与性能损耗",[38,3414,3415,3420],{},[57,3416,3417],{},[89,3418,3419],{},"with () {}",[57,3421,3422],{},"产生不可预测的作用域链",[38,3424,3425,3428],{},[57,3426,3427],{},"修改内置对象原型",[57,3429,3430,3431,3066,3434,3437],{},"污染 ",[89,3432,3433],{},"Object",[89,3435,3436],{},"Array"," 等全局原型，破坏第三方库",[133,3439,3441],{"id":3440},"_311-for-in-检查","3.11 for-in 检查",[13,3443,3444,3445,3448,3449,3452,3453,3456,3457,3459,3460,3463],{},"对对象使用 ",[89,3446,3447],{},"for...in"," 时必须配合 ",[89,3450,3451],{},"hasOwnProperty"," 检查，团队已启用 ESLint 的 ",[89,3454,3455],{},"guard-for-in"," 规则强制此项。注意对数组做 ",[89,3458,3447],{}," 时",[19,3461,3462],{},"遍历顺序不保证","，应改用索引循环或数组方法。",[133,3465,3467],{"id":3466},"_312-标准特性","3.12 标准特性",[13,3469,3470,3471,3474,3475,250],{},"优先使用标准方法以保证可移植性，例如 ",[89,3472,3473],{},"string.charAt(3)"," 优于 ",[89,3476,3477],{},"string[3]",[126,3479],{},[24,3481,3482],{"id":3482},"整合修订说明",[13,3484,3485,3486,279,3489,279,3492,3495,3496,3499],{},"本文由 ",[89,3487,3488],{},"rules\u002Fhtml.md",[89,3490,3491],{},"rules\u002Fcss.md",[89,3493,3494],{},"rules\u002Fjs.md"," 三份原始规范整合。",[19,3497,3498],{},"逐条核对原文后，做了以下修订","，均为原文自身矛盾或技术错误：",[13,3501,3502,3505],{},[19,3503,3504],{},"修订一 · 缩进统一为 2 空格。"," 原 CSS 规范文字写「统一使用四个空格」，但该节及全文所有示例代码实际均为 2 空格，且 HTML、JS 两份规范都明确要求 2 空格。判定为文字笔误，统一为 2 空格。",[13,3507,3508,3511,3512,3515],{},[19,3509,3510],{},"修订二 · HTML「类型属性」示例颠倒。"," 原文文字说「不需要为 CSS、JS 指定类型属性」，但标注为「推荐」的示例恰恰写了 ",[89,3513,3514],{},"type=\"text\u002Fcss\"","，「不推荐」的示例反而是省略版本。已按文字表述对调。",[13,3517,3518,3524,3525,3527,3528,3531,3532,3041,3534,3536,3537,3539],{},[19,3519,3520,3521,3523],{},"修订三 · ",[89,3522,2847],{}," 适用范围。"," 原文写「constructor 必须加 ",[89,3526,2847],{},"」并在非派生类 ",[89,3529,3530],{},"class Queue"," 中调用。此为技术错误：基类中调用 ",[89,3533,2847],{},[89,3535,3044],{},"，仅 ",[89,3538,3050],{}," 派生类需要。已修正表述并补充正确示例。",[13,3541,3542,3545],{},[19,3543,3544],{},"修订四 · 补充双引号 \u002F 单引号的适用边界。"," HTML 属性用双引号、CSS 属性值用单引号、JS 字符串用单引号——三条规则分散在三份文档中容易混淆，已在 CSS 一节加注提示。",[13,3547,3548,3551],{},[19,3549,3550],{},"保留但标注的内容："," CSS 私有前缀手写规则予以保留，但补充说明现代项目应交由 Autoprefixer 处理。原文中被 HTML 注释掉的段落（数组展开运算符、分号可选性讨论）未纳入，因其已被后续条目取代。",[359,3553,3554],{},"html pre.shiki code .sVt8B, html code.shiki .sVt8B{--shiki-default:#24292E;--shiki-dark:#E1E4E8}html pre.shiki code .s9eBZ, html code.shiki .s9eBZ{--shiki-default:#22863A;--shiki-dark:#85E89D}html pre.shiki code .sScJk, html code.shiki .sScJk{--shiki-default:#6F42C1;--shiki-dark:#B392F0}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 .sZZnC, html code.shiki .sZZnC{--shiki-default:#032F62;--shiki-dark:#9ECBFF}html pre.shiki code .sJ8bj, html code.shiki .sJ8bj{--shiki-default:#6A737D;--shiki-dark:#6A737D}html pre.shiki code .sj4cs, html code.shiki .sj4cs{--shiki-default:#005CC5;--shiki-dark:#79B8FF}html pre.shiki code .szBVR, html code.shiki .szBVR{--shiki-default:#D73A49;--shiki-dark:#F97583}html pre.shiki code .s4XuR, html code.shiki .s4XuR{--shiki-default:#E36209;--shiki-dark:#FFAB70}",{"title":146,"searchDepth":412,"depth":412,"links":3556},[3557,3558,3569,3578,3592],{"id":26,"depth":402,"text":27},{"id":130,"depth":402,"text":131,"children":3559},[3560,3561,3562,3563,3564,3565,3566,3567,3568],{"id":135,"depth":412,"text":136},{"id":171,"depth":412,"text":172},{"id":238,"depth":412,"text":239},{"id":308,"depth":412,"text":309},{"id":525,"depth":412,"text":526},{"id":657,"depth":412,"text":658},{"id":764,"depth":412,"text":765},{"id":884,"depth":412,"text":885},{"id":1021,"depth":412,"text":1022},{"id":1062,"depth":402,"text":1063,"children":3570},[3571,3572,3573,3574,3575,3576,3577],{"id":1066,"depth":412,"text":1067},{"id":1188,"depth":412,"text":1189},{"id":1287,"depth":412,"text":1288},{"id":1369,"depth":412,"text":1370},{"id":1654,"depth":412,"text":1655},{"id":1758,"depth":412,"text":1759},{"id":1800,"depth":412,"text":1801},{"id":1882,"depth":402,"text":1883,"children":3579},[3580,3581,3582,3583,3584,3585,3586,3587,3588,3589,3590,3591],{"id":1886,"depth":412,"text":1887},{"id":2066,"depth":412,"text":2067},{"id":2343,"depth":412,"text":2344},{"id":2462,"depth":412,"text":2463},{"id":2544,"depth":412,"text":2545},{"id":2832,"depth":412,"text":2833},{"id":3058,"depth":412,"text":3059},{"id":3159,"depth":412,"text":3160},{"id":3326,"depth":412,"text":3327},{"id":3384,"depth":412,"text":3385},{"id":3440,"depth":412,"text":3441},{"id":3466,"depth":412,"text":3467},{"id":3482,"depth":402,"text":3482},"standards","2025-12-17","HTML \u002F CSS \u002F JavaScript 三端统一的团队编码约定，含缩进、命名、语法与禁用项，可直接作为 Code Review 依据。",false,"md",{},"\u002Fdocs\u002Ffrontend-coding-standards",{"title":5,"description":3595},null,"docs\u002Ffrontend-coding-standards",[145,1087,3604,3605,3606,3607],"javascript","es6","best-practice","guide","HcfDs-u5oIWHhKEQTEt3g6yJiBQLxuKykD8AqmcTM3Q",[3610,3612,3621,3627,3637,3645,3654,3659,3667,3672,3679,3685,3692,3699,3705],{"path":3599,"title":5,"description":3595,"date":3594,"category":3593,"tags":3611},[145,1087,3604,3605,3606,3607],{"path":3613,"title":3614,"description":3615,"date":3616,"category":3617,"tags":3618},"\u002Fdocs\u002Fwindows-mklink","Windows mklink 符号链接用法","mklink 各参数区别与实用场景：目录联接、符号链接与硬链接的选择。","2024-12-18","toolchain",[3619,3620],"windows","cheatsheet",{"path":3622,"title":3623,"description":3624,"date":3625,"category":3617,"tags":3626},"\u002Fdocs\u002Frandom-color-utils","JS 随机颜色生成方法","几种生成随机 RGB \u002F HEX 颜色的实现方式与各自适用场景。","2024-12-11",[3604,3620],{"path":3628,"title":3629,"description":3630,"date":3631,"category":3632,"tags":3633},"\u002Fdocs\u002Fcanvas-vs-svg","Canvas 与 SVG 绘图方案选型","对比 Canvas 与 SVG 两种绘图方案的优缺点与适用场景，给出选型判断依据。","2024-12-09","visualization",[3634,3635,3636,3606],"canvas","svg","performance",{"path":3638,"title":3639,"description":3640,"date":3641,"category":3617,"tags":3642},"\u002Fdocs\u002Ffree-commercial-fonts","免费可商用字体整理","整理思源黑体、思源宋体等可商用中文字体，规避字体版权风险。","2024-11-03",[3643,1087,3644],"font","notes",{"path":3646,"title":3647,"description":3648,"date":3641,"category":3649,"tags":3650},"\u002Fdocs\u002Finterview-browser-network","浏览器与网络考点","从输入 URL 到页面呈现的完整链路，涵盖渲染流程、回流重绘、HTTP 报文与状态码、跨域同源策略与常见攻击方式。","interview",[3651,3652,3653,3636,3644],"browser","http","network",{"path":3655,"title":3656,"description":3657,"date":3641,"category":3649,"tags":3658},"\u002Fdocs\u002Finterview-css-layout","CSS 与布局考点","em 与 rem 的区别、移动端三种适配方案对比、viewport 标准设置与 REM 布局的媒体查询实现。",[1087,145,3606,3644],{"path":3660,"title":3661,"description":3662,"date":3641,"category":3649,"tags":3663},"\u002Fdocs\u002Finterview-framework-tooling","框架与工程化考点","React diff 与 setState 机制、Redux 核心组成、Vue 常考清单，以及 Webpack、Vite、Git 的面试要点。",[3664,3604,3665,3666,3644],"vue","webpack","vite",{"path":3668,"title":3669,"description":3670,"date":3641,"category":3649,"tags":3671},"\u002Fdocs\u002Finterview-javascript-core","JavaScript 核心考点","数据类型、this 绑定、闭包、原型链、异步与数组方法，前端面试中 JS 部分的高频考点与代码示例。",[3604,3605,3644],{"path":3673,"title":3674,"description":3675,"date":3641,"category":3676,"tags":3677},"\u002Fdocs\u002Fjs-module-systems","JavaScript 模块化方案","梳理 CommonJS、AMD、ES Module 等模块化方案的差异与使用方式。","fundamentals",[3604,3678,3605,3644],"module-system",{"path":3680,"title":3681,"description":3682,"date":3641,"category":3676,"tags":3683},"\u002Fdocs\u002Fwebsocket-basics","WebSocket 基础","WebSocket 全双工通信协议的事件、方法与基本用法整理。",[3684,3653,3604,3644],"websocket",{"path":3686,"title":3687,"description":3688,"date":3689,"category":3632,"tags":3690},"\u002Fdocs\u002Fgojs-getting-started","GoJS 入门实战","从引入方式、画布初始化到节点模板与数据绑定，一份可直接上手的 GoJS 流程图开发笔记。","2024-08-22",[3691,3604,3644],"gojs",{"path":3693,"title":3694,"description":3695,"date":3696,"category":3632,"tags":3697},"\u002Fdocs\u002Fecharts-options-notes","ECharts 配置项速查","整理 ECharts 常用 option 配置：数据格式、坐标轴、图例与交互项的实际用法。","2024-08-09",[3698,3604,3620],"echarts",{"path":3700,"title":3701,"description":3702,"date":3703,"category":3676,"tags":3704},"\u002Fdocs\u002Fhttp-status-codes","HTTP 响应状态码详解","按 1xx 到 5xx 分类梳理 HTTP 状态码的含义与典型使用场景。","2024-06-27",[3652,3653,3620],{"path":3706,"title":3707,"description":3708,"date":3709,"category":3676,"tags":3710},"\u002Fdocs\u002Fhtml-basics","HTML 基础笔记","HTML 语法规范、常用标签、表格与表单元素速查。","2022-06-10",[145,3644,3620],1788337378615]