cainiaoblog 23.2.171

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (401) hide show
  1. package/CNAME +1 -0
  2. package/MP_verify_o6dHCK5mIkxNpzvZ.txt +1 -0
  3. package/README.md +8 -0
  4. package/about/index.html +54 -0
  5. package/ads.txt +1 -0
  6. package/app/manual.html +104 -0
  7. package/appConfigs/config +1 -0
  8. package/archives/2018/index.html +48 -0
  9. package/archives/2019/index.html +48 -0
  10. package/archives/2019/page/2/index.html +48 -0
  11. package/archives/2020/index.html +48 -0
  12. package/archives/2021/index.html +48 -0
  13. package/archives/2022/index.html +48 -0
  14. package/archives/2023/index.html +48 -0
  15. package/archives/index.html +48 -0
  16. package/archives/page/2/index.html +48 -0
  17. package/archives/page/3/index.html +48 -0
  18. package/article/10047.html +148 -0
  19. package/article/10164.html +64 -0
  20. package/article/10624.html +436 -0
  21. package/article/10745.html +586 -0
  22. package/article/11674.html +71 -0
  23. package/article/11939.html +72 -0
  24. package/article/12238.html +86 -0
  25. package/article/1230.html +533 -0
  26. package/article/13265.html +69 -0
  27. package/article/13823.html +78 -0
  28. package/article/14125.html +72 -0
  29. package/article/14192.html +561 -0
  30. package/article/14375.html +85 -0
  31. package/article/14744.html +83 -0
  32. package/article/14936.html +451 -0
  33. package/article/1518.html +250 -0
  34. package/article/15428.html +71 -0
  35. package/article/15518.html +288 -0
  36. package/article/15569.html +418 -0
  37. package/article/1566.html +122 -0
  38. package/article/16017.html +156 -0
  39. package/article/16947.html +440 -0
  40. package/article/17096.html +82 -0
  41. package/article/17246.html +89 -0
  42. package/article/17575.html +350 -0
  43. package/article/179.html +757 -0
  44. package/article/18039.html +233 -0
  45. package/article/18071.html +375 -0
  46. package/article/18142.html +71 -0
  47. package/article/19909.html +160 -0
  48. package/article/20014.html +89 -0
  49. package/article/20021.html +389 -0
  50. package/article/20037.html +280 -0
  51. package/article/20056.html +95 -0
  52. package/article/20093.html +404 -0
  53. package/article/2021.html +607 -0
  54. package/article/20459.html +115 -0
  55. package/article/20613.html +263 -0
  56. package/article/20635.html +71 -0
  57. package/article/21317.html +71 -0
  58. package/article/21320.html +90 -0
  59. package/article/21782.html +548 -0
  60. package/article/22230.html +435 -0
  61. package/article/22237.html +347 -0
  62. package/article/22398.html +109 -0
  63. package/article/22422.html +270 -0
  64. package/article/22565.html +300 -0
  65. package/article/23046.html +250 -0
  66. package/article/23083.html +215 -0
  67. package/article/23195.html +297 -0
  68. package/article/23301.html +835 -0
  69. package/article/23589.html +285 -0
  70. package/article/23655.html +338 -0
  71. package/article/23864.html +76 -0
  72. package/article/23914.html +96 -0
  73. package/article/24169.html +135 -0
  74. package/article/24581.html +349 -0
  75. package/article/2475.html +500 -0
  76. package/article/24826.html +77 -0
  77. package/article/24924.html +247 -0
  78. package/article/25164.html +1495 -0
  79. package/article/25318.html +394 -0
  80. package/article/25710.html +1129 -0
  81. package/article/25734.html +83 -0
  82. package/article/26083.html +174 -0
  83. package/article/26147.html +283 -0
  84. package/article/26291.html +110 -0
  85. package/article/26354.html +71 -0
  86. package/article/26624.html +145 -0
  87. package/article/26639.html +298 -0
  88. package/article/26850.html +138 -0
  89. package/article/26940.html +258 -0
  90. package/article/27796.html +190 -0
  91. package/article/27800.html +161 -0
  92. package/article/28963.html +159 -0
  93. package/article/28976.html +247 -0
  94. package/article/29042.html +72 -0
  95. package/article/29596.html +81 -0
  96. package/article/29619.html +183 -0
  97. package/article/29623.html +329 -0
  98. package/article/29829.html +205 -0
  99. package/article/29abbd1c.html +112 -0
  100. package/article/30215.html +178 -0
  101. package/article/30552.html +78 -0
  102. package/article/30818.html +201 -0
  103. package/article/31330.html +364 -0
  104. package/article/3154.html +577 -0
  105. package/article/31695.html +348 -0
  106. package/article/31826.html +71 -0
  107. package/article/31843.html +132 -0
  108. package/article/32280.html +212 -0
  109. package/article/32431.html +74 -0
  110. package/article/32443.html +72 -0
  111. package/article/32732.html +122 -0
  112. package/article/3286.html +251 -0
  113. package/article/32960.html +198 -0
  114. package/article/33713.html +72 -0
  115. package/article/33899.html +615 -0
  116. package/article/34351.html +74 -0
  117. package/article/34372.html +89 -0
  118. package/article/34410.html +74 -0
  119. package/article/34431.html +118 -0
  120. package/article/3447.html +75 -0
  121. package/article/34474.html +142 -0
  122. package/article/34871.html +147 -0
  123. package/article/35397.html +175 -0
  124. package/article/3544.html +199 -0
  125. package/article/35503.html +115 -0
  126. package/article/35624.html +84 -0
  127. package/article/35697.html +384 -0
  128. package/article/35863.html +73 -0
  129. package/article/36037.html +253 -0
  130. package/article/36118.html +71 -0
  131. package/article/3621.html +119 -0
  132. package/article/36251.html +296 -0
  133. package/article/36642.html +352 -0
  134. package/article/37102.html +763 -0
  135. package/article/37336.html +351 -0
  136. package/article/37351.html +89 -0
  137. package/article/3760.html +294 -0
  138. package/article/37749.html +75 -0
  139. package/article/37789.html +83 -0
  140. package/article/38005.html +765 -0
  141. package/article/38009.html +284 -0
  142. package/article/38269.html +194 -0
  143. package/article/38344.html +88 -0
  144. package/article/38359.html +334 -0
  145. package/article/38423.html +379 -0
  146. package/article/38530.html +213 -0
  147. package/article/38743.html +268 -0
  148. package/article/38753.html +204 -0
  149. package/article/38881.html +71 -0
  150. package/article/39087.html +414 -0
  151. package/article/39309.html +84 -0
  152. package/article/39486.html +74 -0
  153. package/article/39637.html +306 -0
  154. package/article/39839.html +72 -0
  155. package/article/39937.html +152 -0
  156. package/article/39970.html +71 -0
  157. package/article/402.html +559 -0
  158. package/article/40698.html +71 -0
  159. package/article/40811.html +71 -0
  160. package/article/40964.html +462 -0
  161. package/article/41011.html +322 -0
  162. package/article/41152.html +78 -0
  163. package/article/41696.html +71 -0
  164. package/article/41717.html +281 -0
  165. package/article/41777.html +149 -0
  166. package/article/419.html +985 -0
  167. package/article/4233.html +136 -0
  168. package/article/4292.html +86 -0
  169. package/article/43302.html +96 -0
  170. package/article/43397.html +106 -0
  171. package/article/43724.html +281 -0
  172. package/article/43999.html +224 -0
  173. package/article/44426.html +77 -0
  174. package/article/44964.html +137 -0
  175. package/article/45004.html +123 -0
  176. package/article/4510.html +83 -0
  177. package/article/45156.html +320 -0
  178. package/article/45157.html +52 -0
  179. package/article/45267.html +87 -0
  180. package/article/45641.html +207 -0
  181. package/article/45960.html +75 -0
  182. package/article/46100.html +1262 -0
  183. package/article/46366.html +74 -0
  184. package/article/46771.html +96 -0
  185. package/article/46911.html +517 -0
  186. package/article/46948.html +137 -0
  187. package/article/46ee4850.html +349 -0
  188. package/article/47019.html +84 -0
  189. package/article/47532.html +94 -0
  190. package/article/4783.html +429 -0
  191. package/article/47972.html +72 -0
  192. package/article/48216.html +127 -0
  193. package/article/48252.html +185 -0
  194. package/article/48520.html +74 -0
  195. package/article/48722.html +75 -0
  196. package/article/48807.html +99 -0
  197. package/article/49126.html +323 -0
  198. package/article/50001.html +88 -0
  199. package/article/50058.html +151 -0
  200. package/article/50343.html +410 -0
  201. package/article/50510.html +82 -0
  202. package/article/51082.html +98 -0
  203. package/article/51677.html +111 -0
  204. package/article/5204.html +1085 -0
  205. package/article/52500.html +538 -0
  206. package/article/52689.html +259 -0
  207. package/article/52877.html +569 -0
  208. package/article/53125.html +191 -0
  209. package/article/53428.html +251 -0
  210. package/article/53524.html +74 -0
  211. package/article/53698.html +322 -0
  212. package/article/53803e6.html +93 -0
  213. package/article/53924.html +291 -0
  214. package/article/53962.html +253 -0
  215. package/article/54006.html +71 -0
  216. package/article/54018.html +88 -0
  217. package/article/54161.html +83 -0
  218. package/article/54178.html +69 -0
  219. package/article/54258.html +327 -0
  220. package/article/54295.html +214 -0
  221. package/article/54313.html +1976 -0
  222. package/article/54351.html +90 -0
  223. package/article/54604.html +80 -0
  224. package/article/54632.html +71 -0
  225. package/article/54912.html +756 -0
  226. package/article/54918.html +129 -0
  227. package/article/55119.html +136 -0
  228. package/article/55756.html +118 -0
  229. package/article/55769.html +136 -0
  230. package/article/55870.html +161 -0
  231. package/article/56139.html +92 -0
  232. package/article/56557.html +69 -0
  233. package/article/56604.html +69 -0
  234. package/article/56816.html +266 -0
  235. package/article/56926.html +153 -0
  236. package/article/57747.html +409 -0
  237. package/article/57965.html +475 -0
  238. package/article/58816.html +78 -0
  239. package/article/59059.html +435 -0
  240. package/article/59095.html +350 -0
  241. package/article/59349.html +244 -0
  242. package/article/59402.html +216 -0
  243. package/article/59448.html +55 -0
  244. package/article/59870.html +94 -0
  245. package/article/59877.html +208 -0
  246. package/article/5dbb6f41.html +86 -0
  247. package/article/6008.html +75 -0
  248. package/article/60327.html +126 -0
  249. package/article/6035.html +76 -0
  250. package/article/60428.html +71 -0
  251. package/article/60544.html +128 -0
  252. package/article/61319.html +95 -0
  253. package/article/61367.html +93 -0
  254. package/article/624d1918.html +292 -0
  255. package/article/62543.html +71 -0
  256. package/article/62887.html +169 -0
  257. package/article/63074.html +120 -0
  258. package/article/63266.html +311 -0
  259. package/article/63351.html +74 -0
  260. package/article/63542.html +104 -0
  261. package/article/63824.html +275 -0
  262. package/article/64051.html +653 -0
  263. package/article/64189b69.html +72 -0
  264. package/article/64354.html +75 -0
  265. package/article/64869.html +79 -0
  266. package/article/64923.html +596 -0
  267. package/article/65128.html +95 -0
  268. package/article/65295.html +79 -0
  269. package/article/6888.html +75 -0
  270. package/article/7065.html +84 -0
  271. package/article/7455.html +85 -0
  272. package/article/7a3ef8f.html +315 -0
  273. package/article/8140.html +188 -0
  274. package/article/8190.html +85 -0
  275. package/article/8225.html +78 -0
  276. package/article/84c9ccd6.html +159 -0
  277. package/article/8f9a9ae3.html +82 -0
  278. package/article/9174.html +73 -0
  279. package/article/9738.html +294 -0
  280. package/article/a4145266.html +71 -0
  281. package/article/bedea419.html +72 -0
  282. package/article/bf7e7421.html +78 -0
  283. package/article/c1867fbf.html +103 -0
  284. package/article/c5576490.html +70 -0
  285. package/article/dcb0db28.html +76 -0
  286. package/article/fc3b727a.html +79 -0
  287. package/atom.xml +445 -0
  288. package/baidusitemap.xml +1079 -0
  289. package/blocks/dns.txt +264 -0
  290. package/blocks/filter.txt +1070 -0
  291. package/blocks/script.js +42 -0
  292. package/categories/CDN/index.html +48 -0
  293. package/categories/IDE/index.html +48 -0
  294. package/categories/git/index.html +48 -0
  295. package/categories/hexo/index.html +48 -0
  296. package/categories//345/205/254/345/205/261/350/212/202/346/227/245/index.html +48 -0
  297. package/categories//345/210/206/344/272/253/index.html +48 -0
  298. package/categories//345/211/215/347/253/257/index.html +48 -0
  299. package/categories//345/211/215/347/253/257/page/2/index.html +48 -0
  300. package/categories//345/211/215/347/253/257//346/265/217/350/247/210/345/231/250/index.html +48 -0
  301. package/categories//345/211/215/347/253/257//346/265/217/350/247/210/345/231/250//347/275/221/347/273/234/345/215/217/350/256/256/index.html +48 -0
  302. package/categories//345/215/232/345/256/242/index.html +48 -0
  303. package/categories//345/267/245/345/205/267/index.html +48 -0
  304. package/categories//345/271/277/345/221/212/350/277/207/346/273/244/index.html +48 -0
  305. package/categories//345/271/277/345/221/212/350/277/207/346/273/244//350/247/206/351/242/221/347/224/265/350/247/206/345/260/217/350/257/264/346/274/253/347/224/273/350/265/204/350/256/257/351/237/263/344/271/220/index.html +48 -0
  306. package/categories//346/255/243/345/210/231/index.html +48 -0
  307. package/categories//346/265/217/350/247/210/345/231/250/index.html +48 -0
  308. package/categories//347/256/227/346/263/225/index.html +48 -0
  309. package/categories//350/265/204/350/256/257/index.html +48 -0
  310. package/categories//350/275/273/346/235/276/344/270/200/345/210/273/index.html +48 -0
  311. package/cdn/css/font-awesome.min.css +4 -0
  312. package/cdn/css/grids-responsive-min.css +7 -0
  313. package/cdn/css/normalize.css +349 -0
  314. package/cdn/css/pure-min.css +11 -0
  315. package/cdn/fonts/fontawesome-webfont.eot +0 -0
  316. package/cdn/fonts/fontawesome-webfont.svg +2671 -0
  317. package/cdn/fonts/fontawesome-webfont.ttf +0 -0
  318. package/cdn/fonts/fontawesome-webfont.woff +0 -0
  319. package/cdn/fonts/fontawesome-webfont.woff2 +0 -0
  320. package/cdn/js/Valine.min.js +17 -0
  321. package/cdn/js/canvas-nest.js +1 -0
  322. package/cdn/js/clipboard.min.js +7 -0
  323. package/cdn/js/crypto-js.js +25 -0
  324. package/cdn/js/jquery.min.js +2 -0
  325. package/css/default.css +1144 -0
  326. package/css/donate.css +338 -0
  327. package/css/hbe.style.css +749 -0
  328. package/css/style.css +2095 -0
  329. package/donate/index.html +39 -0
  330. package/google917dcf72f6e5c7f5.html +1 -0
  331. package/guestbook/index.html +68 -0
  332. package/hosts/ads.txt +149 -0
  333. package/hosts/flash.txt +9 -0
  334. package/hosts/github.txt +6 -0
  335. package/hosts/google.txt +16936 -0
  336. package/hosts/winrar.txt +2 -0
  337. package/img/alipay.svg +46 -0
  338. package/img/bitcoin.svg +135 -0
  339. package/img/blog.ico +0 -0
  340. package/img/blog.png +0 -0
  341. package/img/gaba.png +0 -0
  342. package/img/github.svg +1 -0
  343. package/img/like.svg +1 -0
  344. package/img/mp-mini.jpg +0 -0
  345. package/img/mp.png +0 -0
  346. package/img/paypal.svg +63 -0
  347. package/img/upy_logo.svg +59 -0
  348. package/img/wechat.svg +49 -0
  349. package/index.html +48 -0
  350. package/jd_root.txt +1 -0
  351. package/js/codeblock-resizer.js +51 -0
  352. package/js/dark.js +12 -0
  353. package/js/donate.js +87 -0
  354. package/js/fixedPage.js +106 -0
  355. package/js/gitment.browser.js +3751 -0
  356. package/js/search.js +86 -0
  357. package/js/share.js +60 -0
  358. package/js/smartresize.js +32 -0
  359. package/js/totop.js +12 -0
  360. package/kankan/index.html +77 -0
  361. package/lib/hbe.js +293 -0
  362. package/package.json +25 -0
  363. package/page/10/index.html +49 -0
  364. package/page/11/index.html +59 -0
  365. package/page/12/index.html +67 -0
  366. package/page/13/index.html +63 -0
  367. package/page/14/index.html +66 -0
  368. package/page/15/index.html +60 -0
  369. package/page/16/index.html +60 -0
  370. package/page/17/index.html +62 -0
  371. package/page/18/index.html +61 -0
  372. package/page/19/index.html +58 -0
  373. package/page/2/index.html +48 -0
  374. package/page/20/index.html +57 -0
  375. package/page/21/index.html +61 -0
  376. package/page/22/index.html +55 -0
  377. package/page/23/index.html +64 -0
  378. package/page/24/index.html +60 -0
  379. package/page/25/index.html +58 -0
  380. package/page/26/index.html +48 -0
  381. package/page/27/index.html +58 -0
  382. package/page/3/index.html +48 -0
  383. package/page/4/index.html +48 -0
  384. package/page/5/index.html +51 -0
  385. package/page/6/index.html +51 -0
  386. package/page/7/index.html +51 -0
  387. package/page/8/index.html +53 -0
  388. package/page/9/index.html +48 -0
  389. package/randomcall/README.html +1 -0
  390. package/randomcall/lucker.html +290 -0
  391. package/randomcall/lucky.png +0 -0
  392. package/robots.txt +22 -0
  393. package/search.xml +6740 -0
  394. package/sitemap.xml +2669 -0
  395. package/tags//345/216/237/345/210/233/index.html +48 -0
  396. package/tags//345/250/261/344/271/220/index.html +48 -0
  397. package/tags//346/211/213/345/206/231/index.html +48 -0
  398. package/tags//347/226/253/346/203/205/index.html +48 -0
  399. package/tags//350/275/254/350/275/275/index.html +48 -0
  400. package/tags//350/275/254/350/275/275/page/2/index.html +48 -0
  401. package/v.html +90 -0
package/article/20021.html ADDED
@@ -0,0 +1,389 @@
1
+ <!DOCTYPE html><html lang="zh-CN" data-dark><head><meta http-equiv="Content-Type" content="text/html; charset=UTF-8"><meta content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0" name="viewport"><meta content="yes" name="apple-mobile-web-app-capable"><meta content="black-translucent" name="apple-mobile-web-app-status-bar-style"><meta content="telephone=no" name="format-detection"><meta name="description" content="前端壹菜鸟，记录工作难题，关注前端知识，收集精彩博文，做技术的搬运工"><meta name="msvalidate.01" content="0FE4D8B3381D3D87088996B886E1E2BD"><title>如何在 JS 循环中正确使用 async 与 await | 前端壹菜鸟</title><link rel="stylesheet" type="text/css" href="//cdn.staticaly.com/gh/npljy/npljy.github.io/main/css/style.min.css"><link rel="stylesheet" type="text/css" href="//cdn.jsdelivr.net/npm/normalize.css@latest/normalize.min.css"><link rel="stylesheet" type="text/css" href="//cdn.jsdelivr.net/npm/purecss@latest/build/pure-min.min.css"><link rel="stylesheet" type="text/css" href="//cdn.jsdelivr.net/npm/purecss@latest/build/grids-responsive-min.css"><link rel="stylesheet" type="text/css" href="//cdn.jsdelivr.net/npm/font-awesome@4.7.0/css/font-awesome.min.css"><link rel="icon" mask="" sizes="any" href="//cdn.staticaly.com/gh/npljy/npljy.github.io/main/img/blog.ico"><link rel="Shortcut Icon" type="image/x-icon" href="//cdn.staticaly.com/gh/npljy/npljy.github.io/main/img/blog.ico"><link rel="apple-touch-icon" href="//cdn.staticaly.com/gh/npljy/npljy.github.io/main/img/blog.png"><link rel="apple-touch-icon-precomposed" href="//cdn.staticaly.com/gh/npljy/npljy.github.io/main/img/blog.png"><link rel="alternate" type="application/atom+xml" href="/atom.xml"><script type="text/javascript" src="//cdn.jsdelivr.net/npm/jquery@latest/dist/jquery.min.js"></script><script async src="https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js?client=ca-pub-8385136408348258"></script><script src="https://busuanzi.ibruce.info/busuanzi/2.3/busuanzi.pure.mini.js" async></script><script>(function(){
2
+ var bp = document.createElement('script');
3
+ var curProtocol = window.location.protocol.split(':')[0];
4
+ if (curProtocol === 'https'){
5
+ bp.src = 'https://zz.bdstatic.com/linksubmit/push.js';
6
+ }
7
+ else{
8
+ bp.src = 'http://push.zhanzhang.baidu.com/push.js';
9
+ }
10
+ var s = document.getElementsByTagName("script")[0];
11
+ s.parentNode.insertBefore(bp, s);
12
+ })();
13
+ </script><script>(function(){
14
+ var src = 'https://jspassport.ssl.qhimg.com/11.0.1.js?d182b3f28525f2db83acfaaf6e696dba';
15
+ document.write('<script src="' + src + '" id="sozz"><\/script>');
16
+ })();
17
+ </script><script>var _hmt=_hmt||[];(function(){var hm=document.createElement("script");hm.src='https://hm.baidu.com/hm.js?011f0b44e8452bfa57fbfa23c5fe7683';var s=document.getElementsByTagName("script")[0];s.parentNode.insertBefore(hm, s);})();
18
+ </script><script async src="https://www.googletagmanager.com/gtag/js?id=UA-150860401-1"></script><script>window.dataLayer=window.dataLayer||[];function gtag(){dataLayer.push(arguments);};gtag('js',new Date());gtag('config','UA-150860401-1');
19
+ </script><script type="text/javascript" src="//cdn.staticaly.com/gh/npljy/npljy.github.io/main/js/fixedPage.min.js"></script><meta name="generator" content="Hexo 6.3.0"></head><body><div class="body_container"><div id="header"><div class="site-name"><a id="logo" href="/.">前端壹菜鸟</a><p class="description">关注前端知识，收集精彩博文，做技术的搬运工</p></div><div id="nav-menu"><a class="current" href="/." target="_self"><i class="fa fa-home"> 首页</i></a><a href="/archives/" target="_self"><i class="fa fa-archive"> 归档</i></a><a href="/guestbook/" target="_self"><i class="fa fa-comments"> 留言</i></a><a href="/about/" target="_self"><i class="fa fa-user"> 关于</i></a><a href="https://laonongmin.online/" target="_target"><i class="fa fa-group"> 看看</i></a><a href="https://love.xuehuayu.cn/" target="_target"><i class="fa fa-heart"> LOVE</i></a></div></div><div class="pure-g" id="layout"><div class="pure-u-1 pure-u-md-3-4"><div class="content_container"><div class="post"><h1 class="post-title c-post">如何在 JS 循环中正确使用 async 与 await</h1><div class="post-meta"><span class="date">2019-12-09</span><span> | </span><span class="tag"><a href="/tags/%E8%BD%AC%E8%BD%BD/">转载 </a></span><span> | </span><span class="category"><a href="/categories/%E5%89%8D%E7%AB%AF/">前端 </a></span><span id="busuanzi_container_page_pv"> | <span id="busuanzi_value_page_pv"><i class="fa fa-spinner"></i></span><span> 阅读</span></span><span class="post-time"><span class="post-meta-item-text"> | </span><span class="post-meta-item-icon"><i class="fa fa-keyboard-o"></i><span class="post-count"> 2.1k</span><span class="post-meta-item-text"> 字</span></span></span><span class="post-time"> | <span class="post-meta-item-icon"><i class="fa fa-hourglass-half"></i><span class="post-count"> 9</span><span class="post-meta-item-text"> 分钟</span></span></span></div><a class="disqus-comment-count" href="/article/20021.html#vcomment"><span class="waline-comment-count" data-path="/article/20021.html"></span><span> 条评论</span></a><div class="post-content"><p><code>原文地址：https://www.html.cn/web/javascript/14139.html</code></p>
20
+ <p><code>async</code> 与 <code>await</code> 的使用方式相对简单。 蛤当你尝试在循环中使用<code>await</code>时，事情就会变得复杂一些。<br>在本文中，分享一些在如果循环中使用<code>await</code>值得注意的问题。</p>
21
+ <span id="more"></span>
22
+
23
+ <p><img src="https://img.php.cn/upload/article/000/000/006/5dd4ae523aa5a913.jpg" alt="xuehuayu.cn"></p>
24
+ <h2 id="准备一个例子"><a href="#准备一个例子" class="headerlink" title="准备一个例子"></a>准备一个例子</h2><p>对于这篇文章，假设你想从水果篮中获取水果的数量。</p>
25
+ <pre><code>const fruitBasket = &#123;
26
+ apple: 27,
27
+ grape: 0,
28
+ pear: 14
29
+ &#125;;
30
+ </code></pre>
31
+ <p>你想从<code>fruitBasket</code>获得每个水果的数量。 要获取水果的数量，可以使用<code>getNumFruit</code>函数。</p>
32
+ <pre><code>const getNumFruit = fruit =&gt; &#123;
33
+ return fruitBasket[fruit];
34
+ &#125;;
35
+
36
+ const numApples = getNumFruit(&#39;apple&#39;);
37
+ console.log(numApples); //27
38
+ </code></pre>
39
+ <p>现在，假设<code>fruitBasket</code>是从服务器上获取，这里我们使用 <code>setTimeout</code> 来模拟。</p>
40
+ <pre><code>const sleep = ms =&gt; &#123;
41
+ return new Promise(resolve =&gt; setTimeout(resolve, ms))
42
+ &#125;;
43
+
44
+ const getNumFruie = fruit =&gt; &#123;
45
+ return sleep(1000).then(v =&gt; fruitBasket[fruit]);
46
+ &#125;;
47
+
48
+ getNumFruit(&quot;apple&quot;).then(num =&gt; console.log(num)); // 27
49
+ </code></pre>
50
+ <p>最后，假设你想使用<code>await</code>和<code>getNumFruit</code>来获取异步函数中每个水果的数量。</p>
51
+ <pre><code>const control = async _ =&gt; &#123;
52
+ console.log(&#39;Start&#39;)
53
+
54
+ const numApples = await getNumFruit(&#39;apple&#39;);
55
+ console.log(numApples);
56
+
57
+ const numGrapes = await getNumFruit(&#39;grape&#39;);
58
+ console.log(numGrapes);
59
+
60
+ const numPears = await getNumFruit(&#39;pear&#39;);
61
+ console.log(numPears);
62
+
63
+ console.log(&#39;End&#39;)
64
+ &#125;
65
+ </code></pre>
66
+ <p><img src="https://img.php.cn/upload/image/662/297/163/1574219031708930.gif" alt="1574219031708930.gif"></p>
67
+ <h2 id="在-for-循环中使用-await"><a href="#在-for-循环中使用-await" class="headerlink" title="在 for 循环中使用 await"></a>在 for 循环中使用 await</h2><p>首先定义一个存放水果的数组：</p>
68
+ <pre><code>const fruitsToGet = [“apple”, “grape”, “pear”];
69
+ </code></pre>
70
+ <p>循环遍历这个数组：</p>
71
+ <pre><code>const forLoop = async _ =&gt; &#123;
72
+ console.log(&#39;Start&#39;);
73
+
74
+ for (let index = 0; index &lt; fruitsToGet.length; index++) &#123;
75
+ // 得到每个水果的数量
76
+ &#125;
77
+
78
+ console.log(&#39;End&#39;)
79
+ &#125;
80
+ </code></pre>
81
+ <p>在<code>for</code>循环中，过上使用<code>getNumFruit</code>来获取每个水果的数量，并将数量打印到控制台。</p>
82
+ <p>由于<code>getNumFruit</code>返回一个<code>promise</code>，我们使用 <code>await</code> 来等待结果的返回并打印它。</p>
83
+ <pre><code>const forLoop = async _ =&gt; &#123;
84
+ console.log(&#39;start&#39;);
85
+
86
+ for (let index = 0; index &lt; fruitsToGet.length; index ++) &#123;
87
+ const fruit = fruitsToGet[index];
88
+ const numFruit = await getNumFruit(fruit);
89
+ console.log(numFruit);
90
+ &#125;
91
+ console.log(&#39;End&#39;)
92
+ &#125;
93
+ </code></pre>
94
+ <p>当使用<code>await</code>时，希望JavaScript暂停执行，直到等待 promise 返回处理结果。这意味着<code>for</code>循环中的<code>await</code> 应该按顺序执行。</p>
95
+ <p>结果正如你所预料的那样。</p>
96
+ <pre><code>“Start”;
97
+ “Apple: 27”;
98
+ “Grape: 0”;
99
+ “Pear: 14”;
100
+ “End”;
101
+ </code></pre>
102
+ <p><img src="https://img.php.cn/upload/image/280/653/448/1574219067872598.gif" alt="1574219067872598.gif"></p>
103
+ <p>这种行为适用于大多数循环(比如<code>while</code>和<code>for-of</code>循环)…</p>
104
+ <p>但是它不能处理需要回调的循环，如<code>forEach</code>、<code>map</code>、<code>filter</code>和<code>reduce</code>。在接下来的几节中，我们将研究<code>await</code> 如何影响<code>forEach</code>、map和<code>filter</code>。</p>
105
+ <h2 id="在-forEach-循环中使用-await"><a href="#在-forEach-循环中使用-await" class="headerlink" title="在 forEach 循环中使用 await"></a>在 forEach 循环中使用 await</h2><p>首先，使用 <code>forEach</code> 对数组进行遍历。</p>
106
+ <pre><code>const forEach = _ =&gt; &#123;
107
+ console.log(&#39;start&#39;);
108
+
109
+ fruitsToGet.forEach(fruit =&gt; &#123;
110
+ //...
111
+ &#125;)
112
+
113
+ console.log(&#39;End&#39;)
114
+ &#125;
115
+ </code></pre>
116
+ <p>接下来，我们将尝试使用<code>getNumFruit</code>获取水果数量。 （注意回调函数中的<code>async</code>关键字。我们需要这个<code>async</code>关键字，因为<code>await</code>在回调函数中）。</p>
117
+ <pre><code>const forEachLoop = _ =&gt; &#123;
118
+ console.log(&#39;Start&#39;);
119
+
120
+ fruitsToGet.forEach(async fruit =&gt; &#123;
121
+ const numFruit = await getNumFruit(fruit);
122
+ console.log(numFruit)
123
+ &#125;);
124
+
125
+ console.log(&#39;End&#39;)
126
+ &#125;
127
+ </code></pre>
128
+ <p>我期望控制台打印以下内容：</p>
129
+ <pre><code>“Start”;
130
+ “27”;
131
+ “0”;
132
+ “14”;
133
+ “End”;
134
+ </code></pre>
135
+ <p>但实际结果是不同的。在<code>forEach</code>循环中等待返回结果之前，JavaScrip先执行了 console.log(‘End’)。</p>
136
+ <p>实际控制台打印如下：</p>
137
+ <pre><code>‘Start’
138
+ ‘End’
139
+ ‘27’
140
+ ‘0’
141
+ ‘14’
142
+ </code></pre>
143
+ <p><img src="https://img.php.cn/upload/image/365/755/907/1574219085229979.gif" alt="1574219085229979.gif"></p>
144
+ <p>JavaScript 中的 <code>forEach</code>不支持 promise 感知，也支持 <code>async</code> 和<code>await</code>，所以不能在 <code>forEach</code> 使用 <code>await</code> 。</p>
145
+ <h2 id="在-map-中使用-await"><a href="#在-map-中使用-await" class="headerlink" title="在 map 中使用 await"></a>在 map 中使用 await</h2><p>如果在<code>map</code>中使用<code>await</code>, <code>map</code> 始终返回<code>promise</code>数组，这是因为异步函数总是返回<code>promise</code>。</p>
146
+ <pre><code>const mapLoop = async _ =&gt; &#123;
147
+ console.log(&#39;Start&#39;)
148
+ const numFruits = await fruitsToGet.map(async fruit =&gt; &#123;
149
+ const numFruit = await getNumFruit(fruit);
150
+ return numFruit;
151
+ &#125;)
152
+
153
+ console.log(numFruits);
154
+
155
+ console.log(&#39;End&#39;)
156
+ &#125;
157
+
158
+
159
+ “Start”;
160
+ “[Promise, Promise, Promise]”;
161
+ “End”;
162
+ </code></pre>
163
+ <p><img src="https://img.php.cn/upload/image/516/634/533/1574219100435110.png" alt="1574219100435110.png"></p>
164
+ <p>如果你在 <code>map</code> 中使用 <code>await</code>，<code>map</code> 总是返回<code>promises</code>，你必须等待<code>promises</code> 数组得到处理。 或者通过<code>await Promise.all(arrayOfPromises)</code>来完成此操作。</p>
165
+ <pre><code>const mapLoop = async _ =&gt; &#123;
166
+ console.log(&#39;Start&#39;);
167
+
168
+ const promises = fruitsToGet.map(async fruit =&gt; &#123;
169
+ const numFruit = await getNumFruit(fruit);
170
+ return numFruit;
171
+ &#125;);
172
+
173
+ const numFruits = await Promise.all(promises);
174
+ console.log(numFruits);
175
+
176
+ console.log(&#39;End&#39;)
177
+ &#125;
178
+ </code></pre>
179
+ <p>运行结果如下：</p>
180
+ <p><img src="https://img.php.cn/upload/image/227/233/247/1574219114657584.gif" alt="1574219114657584.gif"></p>
181
+ <p>如果你愿意，可以在<code>promise</code> 中处理返回值，解析后的将是返回的值。</p>
182
+ <pre><code>const mapLoop = _ =&gt; &#123;
183
+ // ...
184
+ const promises = fruitsToGet.map(async fruit =&gt; &#123;
185
+ const numFruit = await getNumFruit(fruit);
186
+ return numFruit + 100
187
+ &#125;)
188
+ // ...
189
+ &#125;
190
+
191
+ “Start”;
192
+ “[127, 100, 114]”;
193
+ “End”;
194
+ </code></pre>
195
+ <h2 id="在-filter-循环中使用-await"><a href="#在-filter-循环中使用-await" class="headerlink" title="在 filter 循环中使用 await"></a>在 filter 循环中使用 await</h2><p>当你使用<code>filter</code>时，希望筛选具有特定结果的数组。假设过滤数量大于20的数组。</p>
196
+ <p>如果你正常使用<code>filter</code> （没有 await），如下：</p>
197
+ <pre><code>const filterLoop = _ =&gt; &#123;
198
+ console.log(&#39;Start&#39;)
199
+
200
+ const moreThan20 = fruitsToGet.filter(async fruit =&gt; &#123;
201
+ const numFruit = await fruitBasket[fruit]
202
+ return numFruit &gt; 20
203
+ &#125;)
204
+
205
+ console.log(moreThan20)
206
+ console.log(&#39;END&#39;)
207
+ &#125;
208
+ </code></pre>
209
+ <p>运行结果</p>
210
+ <pre><code>Start
211
+ [&quot;apple&quot;]
212
+ END
213
+ </code></pre>
214
+ <p><code>filter</code> 中的<code>await</code>不会以相同的方式工作。 事实上，它根本不起作用。</p>
215
+ <pre><code>const filterLoop = async _ =&gt; &#123;
216
+ console.log(&#39;Start&#39;)
217
+
218
+ const moreThan20 = await fruitsToGet.filter(async fruit =&gt; &#123;
219
+ const numFruit = fruitBasket[fruit]
220
+ return numFruit &gt; 20
221
+ &#125;)
222
+
223
+ console.log(moreThan20)
224
+ console.log(&#39;END&#39;)
225
+ &#125;
226
+
227
+
228
+ // 打印结果
229
+ Start
230
+ [&quot;apple&quot;, &quot;grape&quot;, &quot;pear&quot;]
231
+ END
232
+ </code></pre>
233
+ <p><img src="https://img.php.cn/upload/image/686/701/188/1574219133891124.png" alt="1574219133891124.png"></p>
234
+ <p>为什么会发生这种情况?</p>
235
+ <p>当在<code>filter</code> 回调中使用<code>await</code>时，回调总是一个<code>promise</code>。由于<code>promise</code> 总是真的，数组中的所有项都通过<code>filter</code> 。在<code>filter</code> 使用 <code>await</code>类以下这段代码</p>
236
+ <pre><code>const filtered = array.filter(true);
237
+ </code></pre>
238
+ <p>在<code>filter</code>使用 <code>await</code> 正确的三个步骤</p>
239
+ <ol>
240
+ <li><p>使用<code>map</code>返回一个promise 数组</p>
241
+ </li>
242
+ <li><p>使用 <code>await</code> 等待处理结果</p>
243
+ </li>
244
+ <li><p>使用 <code>filter</code> 对返回的结果进行处理</p>
245
+ <p> const filterLoop &#x3D; async _ &#x3D;&gt; {<br> console.log(‘Start’);</p>
246
+ <p> const promises &#x3D; await fruitsToGet.map(fruit &#x3D;&gt; getNumFruit(fruit));</p>
247
+ <p> const numFruits &#x3D; await Promise.all(promises);</p>
248
+ <p> const moreThan20 &#x3D; fruitsToGet.filter((fruit, index) &#x3D;&gt; {<br> const numFruit &#x3D; numFruits[index];<br> return numFruit &gt; 20;<br> })</p>
249
+ <p> console.log(moreThan20);<br> console.log(‘End’)<br> }</p>
250
+ </li>
251
+ </ol>
252
+ <p><img src="https://img.php.cn/upload/image/192/707/202/1574219147688717.gif" alt="1574219147688717.gif"></p>
253
+ <h2 id="在-reduce-循环中使用-await"><a href="#在-reduce-循环中使用-await" class="headerlink" title="在 reduce 循环中使用 await"></a>在 reduce 循环中使用 await</h2><p>如果想要计算 <code>fruitBastet</code>中的水果总数。 通常，你可以使用<code>reduce</code>循环遍历数组并将数字相加。</p>
254
+ <pre><code>const reduceLoop = _ =&gt; &#123;
255
+ console.log(&#39;Start&#39;);
256
+
257
+ const sum = fruitsToGet.reduce((sum, fruit) =&gt; &#123;
258
+ const numFruit = fruitBasket[fruit];
259
+ return sum + numFruit;
260
+ &#125;, 0)
261
+
262
+ console.log(sum)
263
+ console.log(&#39;End&#39;)
264
+ &#125;
265
+ </code></pre>
266
+ <p>运行结果：</p>
267
+ <p><img src="https://img.php.cn/upload/image/225/395/121/1574219163497544.png" alt="1574219163497544.png"></p>
268
+ <p>当你在 <code>reduce</code> 中使用<code>await</code>时，结果会变得非常混乱。</p>
269
+ <pre><code> const reduceLoop = async _ =&gt; &#123;
270
+ console.log(&#39;Start&#39;);
271
+
272
+ const sum = await fruitsToGet.reduce(async (sum, fruit) =&gt; &#123;
273
+ const numFruit = await fruitBasket[fruit];
274
+ return sum + numFruit;
275
+ &#125;, 0)
276
+
277
+ console.log(sum)
278
+ console.log(&#39;End&#39;)
279
+ &#125;
280
+ </code></pre>
281
+ <p><img src="https://img.php.cn/upload/image/528/354/221/1574219176369518.gif" alt="1574219176369518.gif"></p>
282
+ <p><code>[object Promise]14</code> 是什么 鬼？？</p>
283
+ <p>剖析这一点很有趣。</p>
284
+ <ol>
285
+ <li>在第一次遍历中，<code>sum</code>为<code>0</code>。<code>numFruit</code>是<code>27</code>(通过<code>getNumFruit(apple)</code>的得到的值)，<code>0 + 27 = 27</code>。</li>
286
+ <li>在第二次遍历中，<code>sum</code>是一个<code>promise</code>。 （为什么？因为异步函数总是返回<code>promises</code>！）<code>numFruit</code>是<code>0</code>.promise 无法正常添加到对象，因此JavaScript将其转换为<code>[object Promise]</code>字符串。 <code>[object Promise] + 0</code> 是<code>object Promise] 0</code>。</li>
287
+ <li>在第三次遍历中，<code>sum</code> 也是一个<code>promise</code>。 <code>numFruit</code>是<code>14</code>. <code>[object Promise] + 14</code>是<code>[object Promise] 14</code>。</li>
288
+ </ol>
289
+ <p>解开谜团！</p>
290
+ <p>这意味着，你可以在<code>reduce</code>回调中使用<code>await</code>，但是你必须记住先等待累加器！</p>
291
+ <pre><code>const reduceLoop = async _ =&gt; &#123;
292
+ console.log(&#39;Start&#39;);
293
+
294
+ const sum = await fruitsToGet.reduce(async (promisedSum, fruit) =&gt; &#123;
295
+ const sum = await promisedSum;
296
+ const numFruit = await fruitBasket[fruit];
297
+ return sum + numFruit;
298
+ &#125;, 0)
299
+
300
+ console.log(sum)
301
+ console.log(&#39;End&#39;)
302
+ &#125;
303
+ </code></pre>
304
+ <p><img src="https://img.php.cn/upload/image/835/104/640/1574219195305557.gif" alt="1574219195305557.gif"></p>
305
+ <p>但是从上图中看到的那样，<code>await</code> 操作都需要很长时间。 发生这种情况是因为<code>reduceLoop</code>需要等待每次遍历完成<code>promisedSum</code>。</p>
306
+ <p>有一种方法可以加速<code>reduce</code>循环，如果你在等待promisedSum之前先等待<code>getNumFruits()</code>，那么<code>reduceLoop</code>只需要一秒钟即可完成：</p>
307
+ <pre><code>const reduceLoop = async _ =&gt; &#123;
308
+ console.log(&#39;Start&#39;);
309
+
310
+ const sum = await fruitsToGet.reduce(async (promisedSum, fruit) =&gt; &#123;
311
+ const numFruit = await fruitBasket[fruit];
312
+ const sum = await promisedSum;
313
+ return sum + numFruit;
314
+ &#125;, 0)
315
+
316
+ console.log(sum)
317
+ console.log(&#39;End&#39;)
318
+ &#125;
319
+ </code></pre>
320
+ <p><img src="https://img.php.cn/upload/image/121/939/398/1574219209583341.gif" alt="1574219209583341.gif"></p>
321
+ <p>这是因为<code>reduce</code>可以在等待循环的下一个迭代之前触发所有三个<code>getNumFruit</code> promise。然而，这个方法有点令人困惑，因为你必须注意等待的顺序。</p>
322
+ <p>在reduce中使用wait最简单(也是最有效)的方法是</p>
323
+ <ol>
324
+ <li>使用<code>map</code>返回一个promise 数组</li>
325
+ <li>使用 <code>await</code> 等待处理结果</li>
326
+ <li>使用 <code>reduce</code> 对返回的结果进行处理<br>const reduceLoop &#x3D; async _ &#x3D;&gt; {<br> console.log(‘Start’);</li>
327
+ </ol>
328
+ <p>const promises &#x3D; fruitsToGet.map(getNumFruit);<br> const numFruits &#x3D; await Promise.all(promises);<br> const sum &#x3D; numFruits.reduce((sum, fruit) &#x3D;&gt; sum + fruit);</p>
329
+ <p>console.log(sum)<br> console.log(‘End’)<br>}</p>
330
+ <p>这个版本易于阅读和理解，需要一秒钟来计算水果总数。</p>
331
+ <p><img src="https://img.php.cn/upload/image/774/675/144/1574219232610858.gif" alt="1574219232610858.gif"></p>
332
+ <h2 id="从上面看出来什么"><a href="#从上面看出来什么" class="headerlink" title="从上面看出来什么"></a>从上面看出来什么</h2><ol>
333
+ <li>如果你想连续执行<code>await</code>调用，请使用<code>for</code>循环(或任何没有回调的循环)。</li>
334
+ <li>永远不要和<code>forEach</code>一起使用<code>await</code>，而是使用<code>for</code>循环(或任何没有回调的循环)。</li>
335
+ <li>不要在 <code>filter</code> 和 <code>reduce</code> 中使用 <code>await</code>，如果需要，先用 <code>map</code> 进一步骤处理，然后在使用 <code>filter</code> 和 <code>reduce</code> 进行处理。</li>
336
+ </ol>
337
+ <p><code>原文地址：https://medium.com/free-code-camp/javascript-async-and-await-in-loops-30ecc5fb3939 </code></p>
338
+ <p>为了保证的可读性，本文采用意译而非直译。</p>
339
+ <p>以上就是如何在 JS 循环中正确使用 async 与 await的详细内容，更多请关注html中文网其它相关文章！</p>
340
+ </div><iframe src="/donate/?AliPayQR=https://store.xuehuayu.cn/store/public/alipay_qr.jpg&amp;WeChatQR=https://store.xuehuayu.cn/store/public/wechat_qr.png&amp;UnionPayQR=null&amp;GitHub=null&amp;BTCQR=null&amp;BTCKEY=null&amp;PayPal=https://www.paypal.com/paypalme/OrdinaryPerson" style="overflow-x:hidden; overflow-y:hidden; border:0xp none #fff; min-height:240px; width:100%;" frameborder="0" scrolling="no"></iframe><div><ul class="post-copyright"><li class="post-copyright-author"><strong>本文作者：</strong>雪花雨</li><li class="post-copyright-link"><strong>本文链接：</strong><a href="/article/20021.html">https://xuehuayu.cn/article/20021.html</a></li><li class="post-copyright-license"><strong>版权声明：</strong>① 标为原创的文章为博主原创，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接。② 转载文章来自网络，已标明出处，<a href="mailto:cainiaoblog@126.com">侵删</a>。</li></ul></div><br><div class="tags"><a href="/tags/%E8%BD%AC%E8%BD%BD/">转载</a></div><div class="post-nav"><a class="pre" href="/article/31330.html">12个提高 JavaScript 技能的概念！</a><a class="next" href="/article/43999.html">11 种在大多数教程中找不到的JavaScript技巧</a></div><div id="vcomment"></div><link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@waline/client@v2/dist/waline.min.css"><script src="//cdn.jsdelivr.net/npm/@waline/client@v2/dist/waline.js"></script><script>const origin = window.location.origin
341
+ const serverURL = origin.includes('cainiaoblog') ? 'https://cmts.cainiaoblog.cn' : 'https://cmts.xuehuayu.cn'
342
+ const locale = {
343
+ placeholder: '请正确填写昵称和邮箱，方便接收回复通知~',
344
+ sofa: '沙发空缺中，还不快抢~',
345
+ };
346
+ Waline.init({
347
+ el: '#vcomment',
348
+ serverURL: serverURL,
349
+ pageSize: '20',
350
+ visitor: true, // 阅读量统计
351
+ requiredMeta: ['nick', 'mail'],
352
+ emoji: [
353
+ 'https://cdn.jsdelivr.net/gh/walinejs/emojis@1.0.0/weibo',
354
+ 'https://cdn.jsdelivr.net/gh/walinejs/emojis@1.0.0/qq',
355
+ 'https://cdn.jsdelivr.net/gh/walinejs/emojis@1.0.0/tw-emoji',
356
+ ],
357
+ locale,
358
+ pageview: true
359
+ })
360
+ </script></div></div></div><div class="pure-u-1 pure-u-md-1-4 fixed-search hidden_mid_and_down"><div id="sidebar"><script type="text/javascript" src="//cdn.staticaly.com/gh/npljy/npljy.github.io/main/js/search.min.js"></script><div class="widget"><div class="widget-search"><input class="search" type="radio" name="search" value="baidu" id="baidu" checked="checked"/><label class="label" for="baidu" title="百度全站搜索">百度</label><input class="search" type="radio" name="search" value="google" id="google"/><label class="label" for="google" title="谷歌全站搜索">谷歌</label><input class="search" type="radio" name="search" value="self" id="self"/><label class="label" for="self" title="使用站内搜索">站内</label></div><div class="widget" id="search"><form class="search-form" action="//www.baidu.com/baidu" method="get" accept-charset="utf-8" target="_blank"><input type="search" name="word" maxlength="30" placeholder="百度全站搜索"/><input type="hidden" name="si" value="xuehuayu.cn"/><input type="hidden" name="cl" value="3"/><input type="hidden" name="ct" value="2097152"/><input type="hidden" name="s" value="on"/><input class="search-submit" type="submit" value=""/></form></div></div><script>$('input[type=radio][name=search]').change(function() {
361
+ var val = $(this).val()
362
+ var self = '<div class="search-form"><input id="local-search-input" placeholder="站内搜索，首次慢" type="search" name="q" results="0"><input class="search-submit" type="submit" value=""/><div id="local-search-result"></div></div>'
363
+ var google = '<form class="search-form" action="//www.google.com/search" method="get" accept-charset="utf-8" target="_blank"><input type="search" name="q" maxlength="30" placeholder="谷歌全站搜索"><input type="hidden" name="sitesearch" value="xuehuayu.cn"><input class="search-submit" type="submit" value=""/></form>'
364
+ var baidu = '<form class="search-form" action="//www.baidu.com/baidu" method="get" accept-charset="utf-8" target="_blank"><input type="search" name="word" maxlength="30" placeholder="百度全站搜索"><input type="hidden" name="si" value="xuehuayu.cn"><input type="hidden" name="cl" value="3"><input type="hidden" name="ct" value="2097152"><input type="hidden" name="s" value="on"><input class="search-submit" type="submit" value=""/></form>'
365
+
366
+ if (val === 'self') {
367
+ $('#search').html(self)
368
+ var search_path = 'search.xml';
369
+ if (search_path.length == 0) {
370
+ search_path = 'search.xml';
371
+ }
372
+ var path = 'https://cdn.staticaly.com/gh/npljy/npljy.github.io/main/' + search_path;
373
+ searchFunc(path, 'local-search-input', 'local-search-result');
374
+ } else if (val === 'baidu') {
375
+ $('#search').html(baidu)
376
+ } else if (val === 'google') {
377
+ $('#search').html(google)
378
+ }
379
+ })</script><div class="widget widget-wxmp"><img alt="微信公众号" width="100%" src="//cdn.staticaly.com/gh/npljy/npljy.github.io/main/img/mp-mini.jpg"/></div><div class="widget widget-categories"><div class="widget-title"><i class="fa fa-folder-o"> 分类</i></div><ul class="category-list"><li class="category-list-item"><a class="category-list-link" href="/categories/CDN/">CDN</a><span class="category-list-count">2</span></li><li class="category-list-item"><a class="category-list-link" href="/categories/IDE/">IDE</a><span class="category-list-count">1</span></li><li class="category-list-item"><a class="category-list-link" href="/categories/git/">git</a><span class="category-list-count">2</span></li><li class="category-list-item"><a class="category-list-link" href="/categories/hexo/">hexo</a><span class="category-list-count">1</span></li><li class="category-list-item"><a class="category-list-link" href="/categories/%E5%85%AC%E5%85%B1%E8%8A%82%E6%97%A5/">公共节日</a><span class="category-list-count">1</span></li><li class="category-list-item"><a class="category-list-link" href="/categories/%E5%88%86%E4%BA%AB/">分享</a><span class="category-list-count">29</span></li><li class="category-list-item"><a class="category-list-link" href="/categories/%E5%89%8D%E7%AB%AF/">前端</a><span class="category-list-count">191</span><ul class="category-list-child"><li class="category-list-item"><a class="category-list-link" href="/categories/%E5%89%8D%E7%AB%AF/%E6%B5%8F%E8%A7%88%E5%99%A8/">浏览器</a><span class="category-list-count">1</span><ul class="category-list-child"><li class="category-list-item"><a class="category-list-link" href="/categories/%E5%89%8D%E7%AB%AF/%E6%B5%8F%E8%A7%88%E5%99%A8/%E7%BD%91%E7%BB%9C%E5%8D%8F%E8%AE%AE/">网络协议</a><span class="category-list-count">1</span></li></ul></li></ul></li><li class="category-list-item"><a class="category-list-link" href="/categories/%E5%8D%9A%E5%AE%A2/">博客</a><span class="category-list-count">3</span></li><li class="category-list-item"><a class="category-list-link" href="/categories/%E5%B7%A5%E5%85%B7/">工具</a><span class="category-list-count">2</span></li><li class="category-list-item"><a class="category-list-link" href="/categories/%E5%B9%BF%E5%91%8A%E8%BF%87%E6%BB%A4/">广告过滤</a><span class="category-list-count">8</span><ul class="category-list-child"><li class="category-list-item"><a class="category-list-link" href="/categories/%E5%B9%BF%E5%91%8A%E8%BF%87%E6%BB%A4/%E8%A7%86%E9%A2%91%E7%94%B5%E8%A7%86%E5%B0%8F%E8%AF%B4%E6%BC%AB%E7%94%BB%E8%B5%84%E8%AE%AF%E9%9F%B3%E4%B9%90/">视频电视小说漫画资讯音乐</a><span class="category-list-count">2</span></li></ul></li><li class="category-list-item"><a class="category-list-link" href="/categories/%E6%AD%A3%E5%88%99/">正则</a><span class="category-list-count">5</span></li><li class="category-list-item"><a class="category-list-link" href="/categories/%E6%B5%8F%E8%A7%88%E5%99%A8/">浏览器</a><span class="category-list-count">5</span></li><li class="category-list-item"><a class="category-list-link" href="/categories/%E7%AE%97%E6%B3%95/">算法</a><span class="category-list-count">2</span></li><li class="category-list-item"><a class="category-list-link" href="/categories/%E8%B5%84%E8%AE%AF/">资讯</a><span class="category-list-count">16</span></li><li class="category-list-item"><a class="category-list-link" href="/categories/%E8%BD%BB%E6%9D%BE%E4%B8%80%E5%88%BB/">轻松一刻</a><span class="category-list-count">1</span></li></ul></div><div class="widget widget-tags"><div class="widget-title"><i class="fa fa-star-o"> 标签</i></div><div class="tagcloud"><a href="/tags/%E5%8E%9F%E5%88%9B/" style="font-size: 15px;">原创</a> <a href="/tags/%E8%BD%AC%E8%BD%BD/" style="font-size: 15px;">转载</a> <a href="/tags/%E6%89%8B%E5%86%99/" style="font-size: 15px;">手写</a> <a href="/tags/%E7%96%AB%E6%83%85/" style="font-size: 15px;">疫情</a> <a href="/tags/%E5%A8%B1%E4%B9%90/" style="font-size: 15px;">娱乐</a></div></div><div class="widget widget-recent-posts"><div class="widget-title"><i class="fa fa-file-o"> 最近文章</i></div><ul class="post-list"><li class="post-list-item"><a class="post-list-link" href="/article/c5576490.html">面试准备</a></li><li class="post-list-item"><a class="post-list-link" href="/article/84c9ccd6.html">精读《SolidJS》</a></li><li class="post-list-item"><a class="post-list-link" href="/article/53803e6.html">git提交注释规范</a></li><li class="post-list-item"><a class="post-list-link" href="/article/a4145266.html">前端数组拍平flat一行代码</a></li><li class="post-list-item"><a class="post-list-link" href="/article/bedea419.html">一道前端this面试题</a></li><li class="post-list-item"><a class="post-list-link" href="/article/bf7e7421.html">git多账号配置</a></li></ul></div><div class="widget widget-links"><div class="widget-title"><i class="fa fa-external-link"> 友情链接</i></div><ul></ul><a href="https://github.com/npljy?utm_source=xuehuayu.cn" title="GitHub" target="_blank">GitHub</a><ul></ul><a href="https://laonongmin.online?utm_source=xuehuayu.cn" title="看看" target="_blank">看看</a><ul></ul><a href="https://cainiaoblog.cn?utm_source=xuehuayu.cn" title="菜鸟博客" target="_blank">菜鸟博客</a><ul></ul><a href="mailto:cainiaoblog@126.com" title="友链联系" target="_blank">友链联系</a></div></div></div><div class="pure-u-1 pure-u-md-3-4"><div id="footer"><div class="flex-block justify-center align-center flex-wrap"><a class="gxba-link" id="gxba" rel="nofollow" target="_blank" href="http://beian.miit.gov.cn/">京ICP备20007647号-2</a><a class="gaba-link" id="gaba-link" rel="nofollow" target="_blank" href="http://www.beian.gov.cn/portal/registerSystemInfo?recordcode=11010802031264"><img class="nofancybox" src="//cdn.staticaly.com/gh/npljy/npljy.github.io/main/img/gaba.png" alt=""/><span id="gaba">京公网安备 11010802031264号</span><span style="padding-right: 10px;"></span></a><span>Copyright © 2023 </span><a href="/." rel="nofollow">前端壹菜鸟. </a><script>(function(){
380
+ var cnb =window.location.origin.indexOf('cainiaoblog') !==-1
381
+ if (cnb) {
382
+ var gxba =document.getElementById('gxba')
383
+ var gaba =document.getElementById('gaba')
384
+ var gabaLink =document.getElementById('gaba-link')
385
+ gxba.innerText ='京ICP备20007647号-1'
386
+ gaba.innerText ='京公网安备 11010802031254号'
387
+ gabaLink.setAttribute('href','http://www.beian.gov.cn/portal/registerSystemInfo?recordcode=11010802031254')
388
+ }
389
+ })()</script></div><div class="flex-block justify-center align-center flex-wrap"><a rel="nofollow" target="_blank" href="https://v6.51.la/s/Guz3lwHCsVme9Cu"><div class="busuanzi_container" id="busuanzi_container"><span class="busuanzi_container_site_pv" id="busuanzi_container_site_pv">访问量：<span id="busuanzi_value_site_pv"><i class="fa fa-spinner"></i></span></span><span class="busuanzi_container_site_uv" id="busuanzi_container_site_uv">访客数：<span id="busuanzi_value_site_uv"><i class="fa fa-spinner"></i></span></span><span style="padding-right: 10px;"></span></div></a><a rel="nofollow" target="_blank" href="https://www.upyun.com/?utm_source=lianmeng&amp;utm_medium=referral"><span style="font-weight:bold;letter-spacing: 1px;">本网站由 </span><img class="nofancybox" height="32" style="vertical-align: middle" src="//cdn.staticaly.com/gh/npljy/npljy.github.io/main/img/upy_logo.min.svg" alt=""/><span style="font-weight:bold;letter-spacing: 1px;">提供CDN加速/云存储服务</span></a><span style="padding-right: 10px;"></span><a rel="nofollow" style="font-size:18px;font-weight:bold;vertical-align: middle" target="_blank" title="注册就送代金券可直接使用" href="https://console.upyun.com/register/?invite=HyDsjZHIL">注册</a></div></div></div></div><a class="show" id="rocket" href="#top"></a><div class="darkmode-toggle">🌓</div><script type="text/javascript" src="//cdn.staticaly.com/gh/npljy/npljy.github.io/main/js/totop.min.js" async></script><script type="text/javascript" src="//cdn.staticaly.com/gh/npljy/npljy.github.io/main/js/dark.min.js" async></script><script type="text/javascript" src="//cdn.staticaly.com/gh/npljy/npljy.github.io/main/js/codeblock-resizer.min.js"></script><script type="text/javascript" src="//cdn.staticaly.com/gh/npljy/npljy.github.io/main/js/smartresize.min.js"></script></div></body></html>