自拍偷在线精品自拍偷,亚洲欧美中文日韩v在线观看不卡

最全面的前端開(kāi)發(fā)指南

開(kāi)發(fā) 后端 前端
可讀性,正確性和可表達(dá)性優(yōu)于性能。JavaScript基本上永遠(yuǎn)不會(huì)是你的性能瓶頸。圖像壓縮,網(wǎng)絡(luò)接入和DOM重排來(lái)代替優(yōu)化。如果從本文中你只能記住一個(gè)指導(dǎo)原則,那么毫無(wú)疑問(wèn)就是這一條。

HTML

語(yǔ)義

HTML5為我們提供了很多旨在精確描述內(nèi)容的語(yǔ)義元素。確保你可以從它豐富的詞匯中獲益。

  1. <!-- bad --> 
  2. <div id="main"
  3.   <div class="article"
  4.     <div class="header"
  5.       <h1>Blog post</h1> 
  6.       <p>Published: <span>21st Feb, 2015</span></p> 
  7.     </div> 
  8.     <p>…</p> 
  9.   </div> 
  10. </div> 
  11.  
  12. <!-- good --> 
  13. <main> 
  14.   <article> 
  15.     <header> 
  16.       <h1>Blog post</h1> 
  17.       <p>Published: <time datetime="2015-02-21">21st Feb, 2015</time></p> 
  18.     </header> 
  19.     <p>…</p> 
  20.   </article> 
  21. </main> 

你需要理解你正在使用的元素的語(yǔ)義。用一種錯(cuò)誤的方式使用語(yǔ)義元素比保持中立更糟糕。

  1. <!-- bad --> 
  2. <h1> 
  3.   <figure> 
  4.     <img alt=Company src=logo.png> 
  5.   </figure> 
  6. </h1> 
  7.  
  8. <!-- good --> 
  9. <h1> 
  10.   <img alt=Company src=logo.png> 
  11. </h1> 

簡(jiǎn)潔

保持代碼的簡(jiǎn)潔。忘記原來(lái)的XHTML習(xí)慣。

 

  1. <!-- bad --> 
  2. <!doctype html> 
  3. <html lang=en> 
  4.   <head> 
  5.     <meta http-equiv=Content-Type content="text/html; charset=utf-8" /> 
  6.     <title>Contact</title> 
  7.     <link rel=stylesheet href=style.css type=text/css /> 
  8.   </head> 
  9.   <body> 
  10.     <h1>Contact me</h1> 
  11.     <label> 
  12.       Email address: 
  13.       <input type=email placeholder=you@email.com required=required /> 
  14.     </label> 
  15.     <script src=main.js type=text/javascript></script> 
  16.   </body> 
  17. </html> 
  18.  
  19. <!-- good --> 
  20. <!doctype html> 
  21. <html lang=en> 
  22.   <meta charset=utf-8
  23.   <title>Contact</title> 
  24.   <link rel=stylesheet href=style.css> 
  25.  
  26.   <h1>Contact me</h1> 
  27.   <label> 
  28.     Email address: 
  29.     <input type=email placeholder=you@email.com required> 
  30.   </label> 
  31.   <script src=main.js></script> 
  32. </html> 

可訪問(wèn)性

可訪問(wèn)性不應(yīng)該是以后再想的事情。提高網(wǎng)站不需要你成為一個(gè)WCAG專家,你完全可以通過(guò)修復(fù)一些小問(wèn)題,從而造成一個(gè)巨大的變化,例如:

  • 學(xué)習(xí)正確使用alt 屬性

  • 確保鏈接和按鈕被同樣地標(biāo)記(不允許<div>)

  • 不專門依靠顏色來(lái)傳遞信息

  • 明確標(biāo)注表單控件

  1. <!-- bad --> 
  2. <h1><img alt="Logo" src="logo.png"></h1> 
  3.  
  4. <!-- good --> 
  5. <h1><img alt="My Company, Inc." src="logo.png"></h1> 

語(yǔ)言

當(dāng)定義語(yǔ)言和字符編碼是可選擇的時(shí)候,總是建議在文檔級(jí)別同時(shí)聲明,即使它們?cè)谀愕腍TTP標(biāo)頭已經(jīng)詳細(xì)說(shuō)明。比任何其他字符編碼更偏愛(ài)UTF-8。

  1. <!-- bad --> 
  2. <!doctype html> 
  3. <title>Hello, world.</title> 
  4. <!-- good --> 
  5. <!doctype html> 
  6. <html lang=en> 
  7.   <meta charset=utf-8
  8.   <title>Hello, world.</title> 
  9. </html> 

性能

除非有正當(dāng)理由才能在內(nèi)容前加載腳本,不要阻塞頁(yè)面的渲染。如果你的樣式表很重,開(kāi)頭就孤立那些絕對(duì)需要得樣式,并在一個(gè)單獨(dú)的樣式表中推遲二次聲明的加載。兩個(gè)HTTP請(qǐng)求顯然比一個(gè)慢,但是感知速度是最重要的因素。

  1. <!-- bad --> 
  2. <!doctype html> 
  3. <meta charset=utf-8
  4. <script src=analytics.js></script> 
  5. <title>Hello, world.</title> 
  6. <p>...</p> 
  7.  
  8. <!-- good --> 
  9. <!doctype html> 
  10. <meta charset=utf-8
  11. <title>Hello, world.</title> 
  12. <p>...</p> 
  13. <script src=analytics.js></script> 

CSS

分號(hào)

雖然分號(hào)在技術(shù)上是CSS一個(gè)分隔符,但應(yīng)該始終把它作為一個(gè)終止符。

  1. /* bad */ 
  2. div { 
  3.   color: red 
  4.  
  5. /* good */ 
  6. div { 
  7.   color: red; 

盒子模型

盒子模型對(duì)于整個(gè)文檔而言最好是相同的。全局性的* { box-sizing: border-box; }就非常不錯(cuò),但是不要改變默認(rèn)盒子模型的特定元素,如果可以避免的話。

  1. /* bad */ 
  2. div { 
  3.   width: 100%; 
  4.   padding: 10px; 
  5.   box-sizing: border-box; 
  6.  
  7. /* good */ 
  8. div { 
  9.   padding: 10px; 

不要更改元素的默認(rèn)行為,如果可以避免的話。元素盡可能地保持在自然的文檔流中。例如,刪除圖像下方的空格而不改變其默認(rèn)顯示:

  1. /* bad */ 
  2. img { 
  3.   display: block; 
  4.  
  5. /* good */ 
  6. img { 
  7.   vertical-align: middle; 

同樣,如果可以避免的話,不要關(guān)閉元素流。

  1. /* bad */ 
  2. div { 
  3.   width: 100px; 
  4.   position: absolute; 
  5.   right: 0
  6.  
  7. /* good */ 
  8. div { 
  9.   width: 100px; 
  10.   margin-left: auto; 

定位

在CSS中有許多定位元素的方法,但應(yīng)該盡量限制以下屬性/值。按優(yōu)先順序排列:

  1. display: block; 
  2. display: flex; 
  3. position: relative; 
  4. position: sticky; 
  5. position: absolute; 
  6. position: fixed; 

選擇器

最小化緊密耦合到DOM的選擇器。當(dāng)選擇器有多于3個(gè)結(jié)構(gòu)偽類,后代或兄弟選擇器的時(shí)候,考慮添加一個(gè)類到你想匹配的元素。

  1. /* bad */ 
  2. div:first-of-type :last-child > p ~ * 
  3.  
  4. /* good */ 
  5. div:first-of-type .info 

當(dāng)你不需要的時(shí)候避免過(guò)載選擇器。

  1. /* bad */ 
  2. img[src$=svg], ul > li:first-child { 
  3.   opacity: 0
  4.  
  5. /* good */ 
  6. [src$=svg], ul > :first-child { 
  7.   opacity: 0

特異性

不要讓值和選擇器難以覆蓋。盡量少用id,并避免!important。

  1. /* bad */ 
  2. .bar { 
  3.   color: green !important; 
  4. .foo { 
  5.   color: red; 
  6.  
  7. /* good */ 
  8. .foo.bar { 
  9.   color: green; 
  10. .foo { 
  11.   color: red; 

覆蓋

覆蓋樣式使得選擇器和調(diào)試變得困難。如果可能的話,避免覆蓋樣式。

  1. /* bad */ 
  2. li { 
  3.   visibility: hidden; 
  4. li:first-child { 
  5.   visibility: visible; 
  6.  
  7. /* good */ 
  8. li + li { 
  9.   visibility: hidden; 

繼承

不要重復(fù)可以繼承的樣式聲明。

  1. /* bad */ 
  2. div h1, div p { 
  3.   text-shadow: 0 1px 0 #fff; 
  4.  
  5. /* good */ 
  6. div { 
  7.   text-shadow: 0 1px 0 #fff; 

簡(jiǎn)潔

保持代碼的簡(jiǎn)潔。使用簡(jiǎn)寫屬性,沒(méi)有必要的話,要避免使用多個(gè)屬性。

  1. /* bad */ 
  2. div { 
  3.   transition: all 1s; 
  4.   top: 50%; 
  5.   margin-top: -10px; 
  6.   padding-top: 5px; 
  7.   padding-right: 10px; 
  8.   padding-bottom: 20px; 
  9.   padding-left: 10px; 
  10.  
  11. /* good */ 
  12. div { 
  13.   transition: 1s; 
  14.   top: calc(50% - 10px); 
  15.   padding: 5px 10px 20px; 

語(yǔ)言

英語(yǔ)表達(dá)優(yōu)于數(shù)學(xué)公式。

  1. /* bad */ 
  2. :nth-child(2n + 1) { 
  3.   transform: rotate(360deg); 
  4.  
  5. /* good */ 
  6. :nth-child(odd) { 
  7.   transform: rotate(1turn); 

瀏覽器引擎前綴

果斷地刪除過(guò)時(shí)的瀏覽器引擎前綴。如果需要使用的話,可以在標(biāo)準(zhǔn)屬性前插入它們。

  1. /* bad */ 
  2. div { 
  3.   transform: scale(2); 
  4.   -webkit-transform: scale(2); 
  5.   -moz-transform: scale(2); 
  6.   -ms-transform: scale(2); 
  7.   transition: 1s; 
  8.   -webkit-transition: 1s; 
  9.   -moz-transition: 1s; 
  10.   -ms-transition: 1s; 
  11.  
  12. /* good */ 
  13. div { 
  14.   -webkit-transform: scale(2); 
  15.   transform: scale(2); 
  16.   transition: 1s; 

動(dòng)畫

視圖轉(zhuǎn)換優(yōu)于動(dòng)畫。除了opacity 和transform,避免動(dòng)畫其他屬性。

  1. /* bad */ 
  2. div:hover { 
  3.   animation: move 1s forwards; 
  4. @keyframes move { 
  5.   100% { 
  6.     margin-left: 100px; 
  7.   } 
  8.  
  9. /* good */ 
  10. div:hover { 
  11.   transition: 1s; 
  12.   transform: translateX(100px); 

單位

可以的話,使用無(wú)單位的值。如果使用相對(duì)單位,那就用rem 。秒優(yōu)于毫秒。

  1. /* bad */ 
  2. div { 
  3.   margin: 0px; 
  4.   font-size: .9em; 
  5.   line-height: 22px; 
  6.   transition: 500ms; 
  7.  
  8. /* good */ 
  9. div { 
  10.   margin: 0
  11.   font-size: .9rem; 
  12.   line-height: 1.5
  13.   transition: .5s; 

顏色

如果你需要透明度,使用rgba。另外,始終使用十六進(jìn)制格式。

  1. /* bad */ 
  2. div { 
  3.   color: hsl(10354%, 43%); 
  4.  
  5. /* good */ 
  6. div { 
  7.   color: #5a3; 

繪畫

當(dāng)資源很容易用CSS復(fù)制的時(shí)候,避免HTTP請(qǐng)求。

  1. /* bad */ 
  2. div::before { 
  3.   content: url(white-circle.svg); 
  4.  
  5. /* good */ 
  6. div::before { 
  7.   content: ""
  8.   display: block; 
  9.   width: 20px; 
  10.   height: 20px; 
  11.   border-radius: 50%; 
  12.   background: #fff; 

Hacks

不要使用Hacks。

  1. /* bad */ 
  2. div { 
  3.   // position: relative; 
  4.   transform: translateZ(0); 
  5.  
  6. /* good */ 
  7. div { 
  8.   /* position: relative; */ 
  9.   will-change: transform; 

JavaScript

性能

可讀性,正確性和可表達(dá)性優(yōu)于性能。JavaScript基本上永遠(yuǎn)不會(huì)是你的性能瓶頸。圖像壓縮,網(wǎng)絡(luò)接入和DOM重排來(lái)代替優(yōu)化。如果從本文中你只能記住一個(gè)指導(dǎo)原則,那么毫無(wú)疑問(wèn)就是這一條。

  1. // bad (albeit way faster) 
  2. const arr = [1234]; 
  3. const len = arr.length; 
  4. var i = -1
  5. var result = []; 
  6. while (++i < len) { 
  7.   var n = arr[i]; 
  8.   if (n % 2 > 0continue
  9.   result.push(n * n); 
  10.  
  11. // good 
  12. const arr = [1234]; 
  13. const isEven = n => n % 2 == 0
  14. const square = n => n * n; 
  15.  
  16. const result = arr.filter(isEven).map(square); 

無(wú)狀態(tài)

盡量保持函數(shù)純潔。理論上,所有函數(shù)都不會(huì)產(chǎn)生副作用,不會(huì)使用外部數(shù)據(jù),并且會(huì)返回新對(duì)象,而不是改變現(xiàn)有的對(duì)象。

  1. // bad 
  2. const merge = (target, ...sources) => Object.assign(target, ...sources); 
  3. merge({ foo: "foo" }, { bar: "bar" }); // => { foo: "foo", bar: "bar" } 
  4.  
  5. // good 
  6. const merge = (...sources) => Object.assign({}, ...sources); 
  7. merge({ foo: "foo" }, { bar: "bar" }); // => { foo: "foo", bar: "bar" } 

本地化

盡可能地依賴本地方法。

  1. // bad 
  2. const toArray = obj => [].slice.call(obj); 
  3.  
  4. // good 
  5. const toArray = (() => 
  6.   Array.from ? Array.from : obj => [].slice.call(obj) 
  7. )(); 

強(qiáng)制性

如果強(qiáng)制有意義,那么就使用隱式強(qiáng)制。否則就應(yīng)該避免強(qiáng)制。

  1. // bad 
  2. if (x === undefined || x === null) { ... } 
  3.  
  4. // good 
  5. if (x == undefined) { ... } 

循環(huán)

不要使用循環(huán),因?yàn)樗鼈儠?huì)強(qiáng)迫你使用可變對(duì)象。依靠array.prototype 方法。

  1. // bad 
  2. const sum = arr => { 
  3.   var sum = 0
  4.   var i = -1
  5.   for (;arr[++i];) { 
  6.     sum += arr[i]; 
  7.   } 
  8.   return sum; 
  9. }; 
  10.  
  11. sum([123]); // => 6 
  12.  
  13. // good 
  14. const sum = arr => 
  15.   arr.reduce((x, y) => x + y); 
  16.  
  17. sum([123]); // => 6 

如果不能避免,或使用array.prototype 方法濫用了,那就使用遞歸。

  1. // bad 
  2. const createDivs = howMany => { 
  3.   while (howMany--) { 
  4.     document.body.insertAdjacentHTML("beforeend""<div></div>"); 
  5.   } 
  6. }; 
  7. createDivs(5); 
  8.  
  9. // bad 
  10. const createDivs = howMany => 
  11.   [...Array(howMany)].forEach(() => 
  12.     document.body.insertAdjacentHTML("beforeend""<div></div>"
  13.   ); 
  14. createDivs(5); 
  15.  
  16. // good 
  17. const createDivs = howMany => { 
  18.   if (!howMany) return
  19.   document.body.insertAdjacentHTML("beforeend""<div></div>"); 
  20.   return createDivs(howMany - 1); 
  21. }; 
  22. createDivs(5); 

這里有一個(gè)通用的循環(huán)功能,可以讓遞歸更容易使用。

參數(shù)

忘記arguments 對(duì)象。余下的參數(shù)往往是一個(gè)更好的選擇,這是因?yàn)椋?/p>

你可以從它的命名中更好地了解函數(shù)需要什么樣的參數(shù)

真實(shí)數(shù)組,更易于使用。

  1. // bad 
  2. const sortNumbers = () => 
  3.   Array.prototype.slice.call(arguments).sort(); 
  4.  
  5. // good 
  6. const sortNumbers = (...numbers) => numbers.sort(); 

應(yīng)用

忘掉apply()。使用操作符。

  1. const greet = (first, last) => `Hi ${first} ${last}`; 
  2. const person = ["John""Doe"]; 
  3.  
  4. // bad 
  5. greet.apply(null, person); 
  6.  
  7. // good 
  8. greet(...person); 

綁定

當(dāng)有更慣用的做法時(shí),就不要用bind() 。

 

  1. // bad 
  2. ["foo""bar"].forEach(func.bind(this)); 
  3.  
  4. // good 
  5. ["foo""bar"].forEach(func, this); 
  6.  
  7. // bad 
  8. const person = { 
  9.   first: "John"
  10.   last: "Doe"
  11.   greet() { 
  12.     const full = function() { 
  13.       return `${this.first} ${this.last}`; 
  14.     }.bind(this); 
  15.     return `Hello ${full()}`; 
  16.   } 
  17.  
  18. // good 
  19. const person = { 
  20.   first: "John"
  21.   last: "Doe"
  22.   greet() { 
  23.     const full = () => `${this.first} ${this.last}`; 
  24.     return `Hello ${full()}`; 
  25.   } 

函數(shù)嵌套

沒(méi)有必要的話,就不要嵌套函數(shù)。

  1. // bad 
  2. [123].map(num => String(num)); 
  3.  
  4. // good 
  5. [123].map(String); 

合成函數(shù)

避免調(diào)用多重嵌套函數(shù)。使用合成函數(shù)來(lái)替代。

  1. const plus1 = a => a + 1
  2. const mult2 = a => a * 2
  3.  
  4. // bad 
  5. mult2(plus1(5)); // => 12 
  6.  
  7. // good 
  8. const pipeline = (...funcs) => val => funcs.reduce((a, b) => b(a), val); 
  9. const addThenMult = pipeline(plus1, mult2); 
  10. addThenMult(5); // => 12 

緩存

緩存功能測(cè)試,大數(shù)據(jù)結(jié)構(gòu)和任何奢侈的操作。

  1. // bad 
  2. const contains = (arr, value) => 
  3.   Array.prototype.includes 
  4.     ? arr.includes(value) 
  5.     : arr.some(el => el === value); 
  6. contains(["foo""bar"], "baz"); // => false 
  7.  
  8. // good 
  9. const contains = (() => 
  10.   Array.prototype.includes 
  11.     ? (arr, value) => arr.includes(value) 
  12.     : (arr, value) => arr.some(el => el === value) 
  13. )(); 
  14. contains(["foo""bar"], "baz"); // => false 

變量

const 優(yōu)于let ,let 優(yōu)于var。

  1. // bad 
  2. var me = new Map(); 
  3. me.set("name""Ben").set("country""Belgium"); 
  4.  
  5. // good 
  6. const me = new Map(); 
  7. me.set("name""Ben").set("country""Belgium"); 

條件

IIFE 和return 語(yǔ)句優(yōu)于if, else if,else和switch語(yǔ)句。

  1. // bad 
  2. var grade; 
  3. if (result < 50
  4.   grade = "bad"
  5. else if (result < 90
  6.   grade = "good"
  7. else 
  8.   grade = "excellent"
  9.  
  10. // good 
  11. const grade = (() => { 
  12.   if (result < 50
  13.     return "bad"
  14.   if (result < 90
  15.     return "good"
  16.   return "excellent"
  17. })(); 

對(duì)象迭代

如果可以的話,避免for…in。

  1. const shared = { foo: "foo" }; 
  2. const obj = Object.create(shared, { 
  3.   bar: { 
  4.     value: "bar"
  5.     enumerable: true 
  6.   } 
  7. }); 
  8.  
  9. // bad 
  10. for (var prop in obj) { 
  11.   if (obj.hasOwnProperty(prop)) 
  12.     console.log(prop); 
  13.  
  14. // good 
  15. Object.keys(obj).forEach(prop => console.log(prop)); 

map對(duì)象

在對(duì)象有合法用例的情況下,map通常是一個(gè)更好,更強(qiáng)大的選擇。

  1. // bad 
  2. const me = { 
  3.   name: "Ben"
  4.   age: 30 
  5. }; 
  6. var meSize = Object.keys(me).length; 
  7. meSize; // => 2 
  8. me.country = "Belgium"
  9. meSize++; 
  10. meSize; // => 3 
  11.  
  12. // good 
  13. const me = new Map(); 
  14. me.set("name""Ben"); 
  15. me.set("age"30); 
  16. me.size; // => 2 
  17. me.set("country""Belgium"); 
  18. me.size; // => 3 

Curry

Curry雖然功能強(qiáng)大,但對(duì)于許多開(kāi)發(fā)人員來(lái)說(shuō)是一個(gè)外來(lái)的范式。不要濫用,因?yàn)槠湟暻闆r而定的用例相當(dāng)不尋常。

  1. // bad 
  2. const sum = a => b => a + b; 
  3. sum(5)(3); // => 8 
  4.  
  5. // good 
  6. const sum = (a, b) => a + b; 
  7. sum(53); // => 8 

可讀性

不要用看似聰明的伎倆混淆代碼的意圖。

 

  1. // bad 
  2. foo || doSomething(); 
  3.  
  4. // good 
  5. if (!foo) doSomething(); 
  6.  
  7. // bad 
  8. void function() { /* IIFE */ }(); 
  9.  
  10. // good 
  11. (function() { /* IIFE */ }()); 
  12.  
  13. // bad 
  14. const n = ~~3.14
  15.  
  16. // good 
  17. const n = Math.floor(3.14); 

代碼重用

不要害怕創(chuàng)建小型的,高度可組合的,可重復(fù)使用的函數(shù)。

 

  1. // bad 
  2. arr[arr.length - 1]; 
  3.  
  4. // good 
  5. const first = arr => arr[0]; 
  6. const last = arr => first(arr.slice(-1)); 
  7. last(arr); 
  8.  
  9. // bad 
  10. const product = (a, b) => a * b; 
  11. const triple = n => n * 3
  12.  
  13. // good 
  14. const product = (a, b) => a * b; 
  15. const triple = product.bind(null3); 

依賴性

最小化依賴性。第三方是你不知道的代碼。不要只是因?yàn)閹讉€(gè)可輕易復(fù)制的方法而加載整個(gè)庫(kù):

  1. // bad 
  2. var _ = require("underscore"); 
  3. _.compact(["foo"0])); 
  4. _.unique(["foo""foo"]); 
  5. _.union(["foo"], ["bar"], ["foo"]); 
  6.  
  7. // good 
  8. const compact = arr => arr.filter(el => el); 
  9. const unique = arr => [...Set(arr)]; 
  10. const union = (...arr) => unique([].concat(...arr)); 
  11.  
  12. compact(["foo"0]); 
  13. unique(["foo""foo"]); 
  14. union(["foo"], ["bar"], ["foo"]); 

譯文鏈接:http://www.codeceo.com/article/full-frontend-guidelines.html
英文原文:Frontend Guidelines

 

 

 

責(zé)任編輯:王雪燕 來(lái)源: 碼農(nóng)網(wǎng)
相關(guān)推薦

2023-05-15 18:44:07

前端開(kāi)發(fā)

2022-08-11 10:43:23

前端開(kāi)發(fā)實(shí)踐

2022-08-17 11:33:35

前端配置

2017-03-29 09:08:25

Spring筆記

2013-05-27 14:06:14

Android開(kāi)發(fā)移動(dòng)開(kāi)發(fā)Intent機(jī)制

2022-08-02 08:01:09

開(kāi)發(fā)插件Chrome前端技術(shù)

2011-07-25 16:21:22

Sencha touc

2015-09-18 16:55:45

云計(jì)算

2009-06-24 16:30:21

JSF組件模型

2011-06-09 18:24:36

QT Wince

2012-03-26 09:27:40

谷歌安卓開(kāi)發(fā)谷歌安卓

2016-01-28 14:41:06

CC++編碼

2015-11-17 09:30:23

程序員招聘建議

2017-02-05 09:13:58

PHP Cake框架構(gòu)建

2012-05-18 10:08:56

TitaniumAndroid

2021-08-09 09:47:34

Blazor 路由開(kāi)發(fā)

2011-04-18 11:00:34

使用音頻BlackBerry

2011-12-29 10:48:49

移動(dòng)Web

2021-06-21 15:21:52

鴻蒙HarmonyOS應(yīng)用開(kāi)發(fā)

2015-11-12 16:14:52

Python開(kāi)發(fā)實(shí)踐
點(diǎn)贊
收藏

51CTO技術(shù)棧公眾號(hào)