å¦è䏿åç½ï¼æèä¸å¦åæ®ã
è¿å»çç¨åºåå¿è 使ç¨è¿äºæå·§ï¼æ¥ä½¿ä»£ç ç»´æ¤è çå¤´èæ´å æéã
代ç 审æ¥å¤§å¸å¨æµè¯ä»»å¡ä¸å¯»æ¾å®ä»¬ã
ä¸äºæ°å ¥é¨çå¼åè ææ¶åçè³æ¯å¿è ç¨åºåè½å¤æ´å¥½å°ä½¿ç¨å®ä»¬ã
ä»ç»é è¯»æ¬æï¼æ¾åºä½ æ¯è° ââ ä¸ä¸ªå¿è ãä¸ä¸ªæ°æãæè ä¸ä¸ªä»£ç 审æ¥è ï¼
许å¤äººè¯å¾è¿½éå¿è çèæ¥ãåªææå°æ°æåäºã
ç®æ´æ¯æºæ §ççµé
æä»£ç å°½å¯è½åå¾çãå±ç¤ºåºä½ æ¯å¤ä¹çèªæåã
å¨ç¼ç¨ä¸ï¼å¤ä½¿ç¨ä¸äºå·§å¦çç¼ç¨è¯è¨ç¹æ§ã
ä¾å¦ï¼çä¸ä¸è¿ä¸ªä¸å
è¿ç®ç¬¦ '?'ï¼
// ä»ä¸ä¸ªèåç JavaScript åºä¸æªåç代ç
i = i ? i < 0 ? Math.max(0, len + i) : i : 0;
å¾é
·ï¼å¯¹åï¼å¦æä½ è¿æ ·åäºï¼é£äºçå°è¿ä¸è¡ä»£ç å¹¶å°è¯å»çè§£ i ç弿¯ä»ä¹çå¼åè
们ï¼å°±ä¼æä¸ä¸ªâå¿«æ´»çâçæ¶å
äºãç¶å伿¥æ¾ä½ 寻æ±çæ¡ã
åè¯ä»çä¸ç¹æ»æ¯æ´å¥½çãå¼å¯¼ä»è¿å ¥å¿è ä¹è·¯ã
ä¸ä¸ªåæ¯çåé
ééæ åã夫å¯éåè´·ä¸æã
å¦ä¸ä¸ªç¼©å代ç éçæ¹æ³æ¯ï¼å°å¤ä½¿ç¨å忝çåéåãä¾å¦ aãb æ cã
çåé就忣®æä¸çæ£çå¿è
䏿 ·ï¼ä¸ä¸å°±æ¾ä¸å°äºã没æäººè½å¤éè¿ç¼è¾å¨çâæç´¢âåè½æ¾å°å®ãå³ä½¿æäººåå°äºï¼ä»ä¹ä¸è½âç ´è¯âåºåéå a æ b å°åºæ¯ä»ä¹ææã
â¦â¦ä½æ¯æä¸ä¸ªä¾å¤æ
åµãä¸ä¸ªçæ£çå¿è
ç»ä¸ä¼å¨ "for" 循ç¯ä¸ä½¿ç¨ i ä½ä¸ºè®¡æ°å¨ãå¨ä»»ä½å°æ¹é½å¯ä»¥ï¼ä½æ¯è¿éä¸ä¼ç¨ãä½ éä¾¿ä¸æ¾ï¼å°±è½æ¾å°å¾å¤ä¸å¯»å¸¸ç忝ãä¾å¦ x æ yã
使ç¨ä¸ä¸ªä¸å¯»å¸¸çåéå¤é
·åï¼å°¤å
¶æ¯å¨é¿è¾¾ 1-2 页ï¼å¦æå¯ä»¥çè¯ï¼ä½ å¯ä»¥å徿´é¿ï¼ç循ç¯ä½ä¸ä½¿ç¨çæ¶åã妿æäººè¦ç 究循ç¯å
é¨å®ç°çæ¶åï¼ä»å°±å¾é¾å¾å¿«å°æ¾åºåé x å
¶å®æ¯å¾ªç¯è®¡æ°å¨å¦ã
使ç¨ç¼©å
妿å¢éè§åä¸ç¦æ¢ä½¿ç¨ä¸ä¸ªåæ¯å模ç³çå½å â é£å°±ç¼©çå½åï¼ä½¿ç¨ç¼©åå§ã
åè¿æ ·ï¼
listâlstuserAgentâuabrowserâbrsr- â¦â¦ç
åªæå ·æçæ£è¯å¥½ç´è§çäººï¼æè½å¤çè§£è¿æ ·çå½åãå°½å¯è½ç¼©çä¸åãåªæçæ£æä»·å¼çäººï¼æè½å¤ç»´æ¤è¿ç§ä»£ç çå¼åã
Soar highï¼æ½è±¡åã
å¤§æ¹æ é ï¼
大卿æï¼
大é³å¸å£°ï¼
大象æ å½¢ã
å½éæ©ä¸ä¸ªååæ¶ï¼å°½å¯è½å°è¯ä½¿ç¨ææ½è±¡çè¯è¯ãä¾å¦ objãdataãvalueãitem å elem çã
-
ä¸ä¸ªåéççæ³åç§°æ¯
dataã å¨ä»»ä½è½ç¨çå°æ¹é½ä½¿ç¨å®ãçç¡®ï¼æ¯ä¸ªåéé½ææ æ°æ®ï¼dataï¼ï¼å¯¹å§ï¼â¦â¦ä½æ¯
dataå·²ç»ç¨è¿äºæä¹åï¼å¯ä»¥å°è¯ä¸ä¸valueï¼å®ä¹å¾æ®éãæ¯ç«ï¼ä¸ä¸ªå鿻伿ä¸ä¸ª å¼ï¼valueï¼ï¼å¯¹å§ï¼ -
æ ¹æ®åéçç±»å为åéå½åï¼
strãnumâ¦â¦å°è¯ä¸ä¸å§ãæ°æå¯è½ä¼è¯§å¼ â è¿äºåå对äºå¿è æ¥è¯´ççæç¨åï¼äºå®ä¸ï¼æç¨çï¼
䏿¹é¢ï¼åéåä»ç¶æçä¸äºå«ä¹ãå®è¯´æäºåéå æ¯ä»ä¹ï¼ä¸ä¸ªå符串ãä¸ä¸ªæ°åææ¯å ¶ä»çä¸è¥¿ã使¯å½ä¸ä¸ªå±å¤äººè¯å¾çè§£ä»£ç æ¶ï¼ä»ä¼æè®¶å°åç°å®é 䏿²¡æä»»ä½ææä¿¡æ¯ï¼æç»å°±æ æ³ä¿®æ¹ä½ ç²¾å¿æèè¿ç代ç ã
æä»¬å¯ä»¥éè¿ä»£ç è°è¯ï¼å¾å®¹æå°çåºå¼çç±»åã使¯åéåçå«ä¹å¢ï¼å®åäºåªä¸ä¸ªåç¬¦ä¸²ææ°åï¼
妿æèçæ·±åº¦ä¸å¤ï¼æ¯æ²¡æåæ³ææç½çã
-
â¦â¦ä½æ¯å¦ææ¾ä¸å°æ´å¤è¿æ ·çååå¢ï¼ å¯ä»¥å ä¸ä¸ªæ°åï¼
data1, item2, elem5â¦â¦
æ³¨ææµè¯
åªæä¸ä¸ªçæ£ç»å¿çç¨åºåæè½çè§£ä½ ç代ç ã使¯æä¹æ£éªå¢ï¼
æ¹å¼ä¹ä¸ ââ 使ç¨ç¸ä¼¼çåéåï¼å date å dataã
å°½ä½ æè½å°å°å®ä»¬æ··åå¨ä¸èµ·ã
æ³å¿«éé 读è¿ç§ä»£ç æ¯ä¸å¯è½çãå¹¶ä¸å¦ææä¸ä¸ªéå«åæ¶â¦â¦é¢â¦â¦æä»¬å¡å¨è¿å¿å¥½é¿æ¶é´äºï¼å°é¥ç¹äº (âvâ)ã
æºè½åä¹è¯
éï¼å¯éï¼é常éãåï¼å¯åï¼é常åã
对 åä¸ä¸ª ä¸è¥¿ä½¿ç¨ 类似 çå½åï¼å¯ä»¥ä½¿çæ´»æ´æè¶£ï¼å¹¶ä¸è½å¤å±ç°ä½ çåé åã
ä¾å¦ï¼å½æ°åç¼ã妿ä¸ä¸ªå½æ°çåè½æ¯å¨å±å¹ä¸å±ç¤ºä¸ä¸ªæ¶æ¯ â åç§°å¯ä»¥ä»¥ display⦠å¼å¤´ï¼ä¾å¦ displayMessageã妿å¦ä¸ä¸ªå½æ°å±ç¤ºå«çä¸è¥¿ï¼æ¯å¦ä¸ä¸ªç¨æ·åï¼åç§°å¯ä»¥ä»¥ show⦠å¼å§ï¼ä¾å¦ showNameï¼ã
æç¤ºè¿äºå½æ°ä¹é´æå¾®å¦çå·®å¼ï¼å®é ä¸å¹¶æ²¡æã
ä¸å¢éä¸çå
¶ä»å¿è
们达æä¸ä¸ªåè®®ï¼å¦æå¼ ä¸å¨ä»ç代ç ä¸ä»¥ display... æ¥å¼å§ä¸ä¸ªâæ¾ç¤ºâ彿°ï¼é£ä¹æåå¯ä»¥ç¨ render..ï¼çäºå¯ä»¥ä½¿ç¨ paint...ãä½ å¯ä»¥åç°ä»£ç åå¾å¤ä¹å°æè¶£å¤æ ·åã
â¦â¦ç°å¨æ¯å¸½åææ³ï¼
å¯¹äºæé常éè¦çå·®å¼çä¸¤ä¸ªå½æ° â 使ç¨ç¸åçåç¼ã
ä¾å¦ï¼printPage(page) 彿°ä¼ä½¿ç¨ä¸ä¸ªæå°æºï¼printerï¼ãprintText(text) 彿°ä¼å°æåæ¾ç¤ºå°å±å¹ä¸ã让ä¸ä¸ªä¸çæç读è
æ¥æèä¸ä¸ï¼âåå为 printMessage(message) ç彿°ä¼å°æ¶æ¯æ¾å°åªéå¢ï¼æå°æºè¿æ¯å±å¹ä¸ï¼âã为äºè®©ä»£ç çæ£èç¼ï¼printMessage(message) åºè¯¥å°æ¶æ¯è¾åºå°æ°çªå£ä¸ï¼
éç¨åå
å§å¶æåï¼
åäº¦æ¢æï¼
夫亦å°ç¥æ¢ï¼
ç¥æ¢å¯ä»¥ä¸æ®ã
ä» å¨ç»å¯¹å¿ è¦æ¶ææ·»å æ°åéã
å¦åï¼éç¨å·²ç»åå¨çååãç´æ¥ææ°å¼åè¿åéå³å¯ã
å¨ä¸ä¸ªå½æ°ä¸ï¼å°è¯ä» 使ç¨ä½ä¸ºåæ°ä¼ éçåéã
è¿æ ·å°±å¾é¾ç¡®å®è¿ä¸ªåéçå¼ç°å¨æ¯ä»ä¹äºãä¹ä¸ç¥é宿¯ä»åªéæ¥çãç®çæ¯æé«é 读代ç ç人çç´è§åè®°å¿åãä¸ä¸ªç´è§è¾å¼±çäººå¿ é¡»éè¡åæä»£ç ï¼è·è¸ªæ¯ä¸ªä»£ç 忝ä¸çæ´æ¹ã
è¿ä¸ªæ¹æ³çä¸ä¸ªè¿é¶æ¹æ¡æ¯ï¼å¨å¾ªç¯æå½æ°ä¸å·å·å°æ¿æ¢æå®çå¼ã
ä¾å¦ï¼
function ninjaFunction(elem) {
// åºäºåé elem è¿è¡å·¥ä½ç 20 è¡ä»£ç
elem = clone(elem);
// å 20 è¡ä»£ç ï¼ç°å¨ä½¿ç¨çæ¯ clone åç elem åéã
}
æ³è¦å¨ååé¨åä¸ä½¿ç¨ elem çç¨åºå伿å°å¾è¯§å¼â¦â¦åªæå¨è°è¯æé´ï¼æ£æ¥ä»£ç ä¹åï¼ä»æä¼åç°ä»æ£å¨ä½¿ç¨å
éè¿çåéï¼
ç»å¸¸çå°è¿æ ·ç代ç ï¼å³ä½¿å¯¹ç»éªä¸°å¯çå¿è æ¥è¯´ä¹æ¯è´å½çã
ä¸å线çä¹è¶£
å¨åéååå ä¸ä¸å线 _ å __ãä¾å¦ _name å __valueãå¦æåªæä½ ç¥éå®ä»¬çå«ä¹ï¼é£å°±é常æ£äºãæè
ï¼å è¿äºä¸åçº¿åªæ¯ä¸ºäºå¥½ç©å¿ï¼æ²¡æä»»ä½å«ä¹ï¼é£å°±æ´æ£äºï¼
å ä¸å线å¯è°æ¯ä¸ç®åéãé¦å ï¼ä»£ç å徿´é¿ï¼å¯è¯»æ§æ´ä½ï¼å¹¶ä¸ï¼ä½ çå¼åè å°ä¼ä¼´å¯è½ä¼è±è´¹å¾é¿æ¶é´ï¼æ¥å¼æ¸ æ¥ä¸å线æ¯ä»ä¹ææã
èªæçå¿è ä¼å¨ä»£ç çä¸ä¸ªå°æ¹ä½¿ç¨ä¸å线ï¼ç¶åå¨å ¶ä»å°æ¹å»æé¿å 使ç¨å®ä»¬ãè¿ä¼ä½¿ä»£ç å徿´å èå¼±ï¼å¹¶æé«äºä»£ç æªæ¥åºç°é误çå¯è½æ§ã
å±ç¤ºä½ çç±
å大家å±ç°ä¸ä¸ä½ é£ä¸°å¯çæ
æï¼å superElementãmegaFrame å niceItem è¿æ ·çååä¸å®ä¼å¯å读è
ã
äºå®ä¸ï¼ä»ä¸æ¹é¢æ¥è¯´ï¼çä¼¼åäºä¸äºä¸è¥¿ï¼super..ãmega..ãnice..ãä½ä»å¦ä¸æ¹é¢æ¥è¯´ â 并没ææä¾ä»»ä½ç»èãé
读代ç ç人å¯è½éè¦èè´¹ä¸å°ä¸¤ä¸ªå°æ¶ç带èªå·¥ä½æ¶é´ï¼å¥æè¦æ³æ¥å¯»æ¾ä¸ä¸ªéèçå«ä¹ã
éå å¤é¨åé
夿è ä¸è§æä¸ä¸ç©ï¼
夿è è½è§æä¸åºäºã
坹彿°å é¨åå¤é¨çåéï¼ä½¿ç¨ç¸åçåç§°ãå¾ç®åï¼ä¸ç¨è´¹å²æ³æ°çåç§°ã
let user = authenticateUser();
function render() {
let user = anotherValue();
...
...许å¤è¡ä»£ç ...
...
... // <-- æä¸ªç¨åºåæ³è¦å¨è¿éä½¿ç¨ user åéâ¦â¦
...
}
å¨ç ç©¶ render å
é¨ä»£ç çç¨åºåå¯è½ä¸ä¼æ³¨æå°ï¼æä¸ä¸ªå
é¨åé user å±è½äºå¤é¨ç user åéã
ç¶åä»ä¼å设 user ä»ç¶æ¯å¤é¨çåéç¶å使ç¨å®ï¼authenticateUser() çç»æâ¦â¦é·é±åºæ¥å¦ï¼ä½ 好åï¼è°è¯å¨â¦â¦
æ å¤ä¸å¨çå¯ä½ç¨ï¼
æäºå½æ°çèµ·æ¥å®ä»¬ä¸ä¼æ¹åä»»ä½ä¸è¥¿ãä¾å¦ isReady()ï¼checkPermission()ï¼findTags()â¦â¦å®ä»¬è¢«åå®ç¨äºæ§è¡è®¡ç®ãæ¥æ¾åè¿åæ°æ®ï¼èä¸ä¼æ´æ¹ä»»ä½å®ä»¬èªèº«ä¹å¤çæ°æ®ãè¿è¢«ç§°ä¸ºâæ å¯ä½ç¨âã
ä¸ä¸ªé常æåçæå·§å°±æ¯ï¼é¤äºä¸»è¦ä»»å¡ä¹å¤ï¼ç»å®ä»¬æ·»å ä¸ä¸ªâæç¨çâè¡ä¸ºã
å½ä½ çåäºçå°è¢«å½å为 is..ãcheck.. æ find... ç彿°æ¹åäºæäºä¸è¥¿çæ¶åï¼ä»è¸ä¸è¯å®æ¯ä¸è¸æµé¼ç表æ
â è¿ä¼æ©å¤§ä½ ççæ§çéã
å¦ä¸ä¸ªæåçæ¹å¼æ¯ï¼è¿åéæ åçç»æã
å±ç¤ºä½ åæ¥çæ³æ³ï¼è®©è°ç¨ checkPermission æ¶çè¿åå¼ä¸æ¯ true/falseï¼èæ¯ä¸ä¸ªå
嫿£æ¥ç»æçå¤æå¯¹è±¡ã
é£äºå°è¯å if (checkPermission(..)) çå¼åè
ï¼ä¼å¾çæä¸ºä»ä¹å®ä¸è½å·¥ä½ãåè¯ä»ä»¬ï¼âå»è¯»ææ¡£å§âãç¶åç»åºè¿ç¯æç« ã
强大ç彿°ï¼
å¤§éæ³å ®ï¼
å ¶å·¦å¯å³ã
ä¸è¦è®©å½æ°åéäºååä¸åçå 容ãæå®½ä¸äºã
ä¾å¦ï¼å½æ° validateEmail(email) å¯ä»¥ï¼é¤äºæ£æ¥é®ä»¶çæ£ç¡®æ§ä¹å¤ï¼æ¾ç¤ºä¸ä¸ªéè¯¯æ¶æ¯å¹¶è¦æ±éæ°è¾å
¥é®ä»¶ã
é¢å¤çè¡ä¸ºå¨å½æ°åç§°ä¸ä¸åºè¯¥å¾ææ¾ãä¸ä¸ªçæ£çå¿è ä¼ä½¿å®ä»¬å¨ä»£ç ä¸ä¹ä¸ææ¾ã
å°å¤ä¸ªè¡ä¸ºåå¹¶å°ä¸èµ·ï¼å¯ä»¥ä¿æ¤ä½ ç代ç ä¸è¢«éç¨ã
æ³è±¡ä¸ä¸ï¼å¦ä¸ä¸ªå¼åè
åªæ³æ£æ¥é®ç®±è䏿³è¾åºä»»ä½ä¿¡æ¯ãä½ ç彿° validateEmail(email) 对ä»èè¨å°±ä¸åéå¦ãæä»¥ä»ä¸ä¼æ¾ä½ é®å
³äºè¿äºå½æ°çä»»ä½äºèææä½ çæèã
æ»ç»
ä¸é¢çææâ建议â齿¯ä»çå®ç代ç 䏿ç¼èæ¥çâ¦â¦ææ¶åï¼è¿äºä»£ç æ¯ç±æç»éªçå¼åè åçãä¹è®¸æ¯ä½ æ´æç»éª ;ï¼
- éµä»å ¶ä¸çä¸ä¸¢ä¸¢ï¼ä½ ç代ç å°±ä¼åå¾å 满æåã
- éµä»å ¶ä¸çä¸å¤§é¨åï¼ä½ ç代ç å°çæ£æä¸ºä½ ç代ç ï¼æ²¡æäººä¼æ³æ¹åå®ã
- éµä»ææï¼ä½ ç代ç å°æä¸ºå¯»æ±å¯åçå¹´è½»å¼åè çå®è´µæ¡ä¾ã
è¯è®º
<code>æ ç¾æå ¥åªæå 个è¯ç代ç ï¼æå ¥å¤è¡ä»£ç å¯ä»¥ä½¿ç¨<pre>æ ç¾ï¼å¯¹äºè¶ è¿ 10 è¡ç代ç ï¼å»ºè®®ä½ ä½¿ç¨æ²ç®±ï¼plnkrï¼JSBinï¼codepenâ¦ï¼