Verificarea codului javascript folosind un depanator (Windows)

Când este debugger?

Debugger vă ajută să înțelegeți de ce părți ale codului:

• nu a evoluat așa cum este de așteptat;
• nu realizează când este de așteptat;
• efectuate atunci când nu este de așteptat.

Debugger suspendă executarea de cod vă permite să creați o copie de rezervă a blocurilor de cod și repetați-le, și, de asemenea oferă posibilitatea de a analiza codul din unghiuri diferite pentru a înțelege:

Pornirea debugger

Descărcați pagina Web problematic în Internet Explorer 11 și deschideți F12 Developer Tools, apăsând tasta F12 sau prin selectarea Tools F12 Developer din meniul Tools. Pentru a accesa instrumentul de depanare, debugger, faceți clic pe pictograma sau apăsați CTRL + 3.

Structura debugger

trei zone cu lățime și înălțime reglabilă sunt afișate în structura implicită debugger.

Rularea sesiunii de depanare

Există trei moduri de a începe o sesiune de depanare.

• Stabilirea unui punct de întrerupere. Atunci când executarea de cod ajunge la acest punct, introduceți un mod pauză de execuție și poate începe să execute cod pas cu pas.
• Inițierea unui cod de întrerupere. Faceți clic pe Cancel (două linii paralele verticale) în partea superioară a fondurilor, sau apăsați CTRL + SHIFT + B. Debugger se va opri codul atunci când executați următoarea declarație.
• Set de management excepții posibilitatea de a opri executia, atunci când o excepție neînregistrată și urmați pagina de web codul sursă, până la un meci cu o excepție.

Internet Explorer 11, noul instrument - debugger - efectuează depanare fără a fi nevoie de a actualiza pagina și Stateful. Astfel, mijloacele F12 pot rămâne conectate la fereastra browser-ului.

Sesiunea Flow Control

După debugger ajunge la punctul de întrerupere, și sunteți gata să continuați, puteți utiliza insigne de control de execuție pentru a decide ce să facă în continuare.

Pictogramele (de la stânga la dreapta):

• Continuă (F5 sau F8). Ieșirea de execuție pauză și continua execuția până la următoarea întrerupere. Pachetul de actualizare cumulativă pentru Internet Security Systems Explorer (KB2976627) a adăugat o caracteristică nouă: menținerea tastei F5 se va muta golurile anterioare, până când se eliberează tasta.
• Se întrerupe (CTRL + SHIFT + B). Stop de următoarea declarație.
• Step Into (F11). Amplasat în apelul funcției, sau trecerea la următoarea declarație în funcția absență.
• Step Over (F10). Ocolind funcția de apel sau trecerea la următoarea declarație în funcția absență.
• Ieșind (SHIFT + F11). Ieșire din funcția curentă și apelarea în funcția de apelare.
• Oprirea la un nou proces de lucrător (CTRL + SHIFT + W). Opri execuția atunci când un nou proces de lucrător Web.
• Excepție de management (CTRL + SHIFT + E).

În mod implicit, excepțiile sunt ignorate și pur și simplu înregistrate în jurnalul de consolă. Este posibil să se întrerupă executarea tuturor sau numai acele excepții care nu sunt manipulate manipulare încercați excepții. prinde în cod.

Codul de formatare pentru a fi citite

Două pictograme la dreapta pictogramei Gestionați excepțiile mai ușor de citit blocuri mari de cod în script-ul.

• Funcția de imprimare de calitate primește un bloc comprimat sau abreviate de cod și formatează pentru a fi citite. cod

Comparația nu este perfect. stive și funcțiile de inspectori de apel afișează numele variabilei în codul compilat sau comprimate, deoarece acesta este utilizat pentru a efectua, și nu codul sursă. În plus, calitatea sursei fișierului corespunzător variază în funcție de ceea ce software-ul le creează. La compararea calității afectează calitatea de fișier de mapare.

Setarea breakpoints și gestionarea

Prin folosirea diferitelor tipuri de puncte puteți specifica depanator. că el ar trebui să efectueze diverse operații pe realizarea acestor puncte.

• breakpoint convenționale cel mai ușor de instalat, în cazul în care o linie a operatorului. Faceți clic pe lângă numărul de linie din partea stângă a casetei umbrită în script. Acesta va fi un punct, ceea ce înseamnă că punctul de oprire este setat.

În conformitate cu mai mulți operatori pot seta puncte de întrerupere pentru operatorii individuali. Faceți clic pe operatorul butonul din dreapta al mouse-ului și a stabilit un punct de întrerupere în meniul contextual sau plasați cursorul în operatorul și apăsați F9.

breakpoint condiționată întrerupe executarea numai în cazul în care o condiție pe care îl specificați este îndeplinită. De exemplu, să presupunem că acest cod este o variabilă de studenți și doriți să opriți rulează numai atunci când elevii trebuie să fie mai mare de 20.

Faceți clic pe operatorul sau breakpoint butonul din dreapta al mouse-ului și selectați Stare din meniul contextual sau tastele ALT + F9 apăsați. În ceea ce privește caseta de dialog, introduceți condiția studenților> 20 și trimite. Simbolul breakpoint apare A +, iar executarea de cod va fi întreruptă numai în cazul în care starea de elevi> 20 vor fi efectuate.

Punct Trace - o caracteristică nouă în Internet Explorer 11. Ei lucrează ca comanda temporară console.log ().

Pentru a stabili acest punct, operatorul, faceți clic pe butonul din dreapta al mouse-ului și selectați urme punctul Fragment din meniul contextual. În caseta de dialog, introduceți un mesaj în același format pe care le-ar folosi pentru a console.log () argument de comandă. Punct are acces la aceleași variabile locale și globale ca operatorul ales.

Punctele de inflexiune și urme de evenimente sunt acum adăugate la pachetul de actualizare cumulativă pentru Internet Security Systems Explorer (KB2976627). Ele funcționează ca Breakpoint și urme de puncte, descrise mai sus, dar nu este activat atunci când un anumit bloc de cod, și sunt conduse de evenimente specifice. Fiecare are un filtru condițională suplimentar, care va ajuta restrânge domeniul de aplicare a acestora la o anumită instanță a unui eveniment pe care doriți să testați. Ele pot fi adăugate folosind pictogramele Adaugă o Evenimente Breakpoint Adaugă un eveniment punct urmă. evidențiate în imaginea de mai jos.

Zona „Breakpoints“

În afară de faptul că, punctele de inflexiune sunt afișate lângă câmpul în declarația script-ul. întregul set de aceste puncte este prezentată în punctele de întrerupere.

Puteți gestiona mai multe puncte în punctele de întrerupere. Pentru a activa, dezactiva sau șterge toate punctele, faceți clic dreapta oriunde pe câmp și selectați comanda corespunzătoare din meniul de comenzi rapide. Aceleași comenzi sunt disponibile ca pictograme în colțul din dreapta sus al zonei, precum și din stânga și din dreapta, punctele de inflexiune individuale. Dacă faceți clic pe un singur punct de întrerupere, faceți clic dreapta, veți vedea un meniu de comenzi rapide, cu condiția comenzi sau urme de mesaje. care permite de a schimba mesajul sau de a face un punct de întrerupere condiționată punct.

Panoul poate efectua in mai multe puncte de întrerupere urme dintr-o varietate de diferite scenarii care pot transfera date în pagini. Faceți clic pe orice nume de fișier breakpoint aferente pentru a face fișierul activ în domeniul script-ul și du-te la linia.

În Windows 8.1 cu punctele de inflexiune de actualizare salvate și nu dispar după ce browser-ul este închis. Acest lucru înseamnă că nu trebuie să ne întrebăm de fiecare dată când deschideți browser-ul pentru depanare, dar după depanare, poate fi necesar pentru a le elimina manual. Cel mai simplu mod - pentru a deschide un fișier script și faceți clic pe Eliminați toate din partea dreapta sus, punctele de inflexiune.

Pachetul de actualizare cumulativă pentru Internet Explorer sisteme de securitate (KB2976627), a adăugat o nouă caracteristică: puteți selecta mai multe puncte de întrerupere, folosind tehnici CTRL + click de mouse, SHIFT + click de mouse sau CTRL + A.

Verificați obiecte și variabile

După ce ați stabilit punctele de inflexiune și introducerea codului, debugger vă oferă mai multe moduri de a vedea ceea ce se întâmplă în interior.

• Când debugger suspendă executarea codului operatorului, plasați cursorul mouse-ului în script-ul de pe orice variabilă, funcție sau obiect pentru a vedea informații suplimentare în suprapunerea. Mutați mouse-ul în jos indicatorul overlay pentru a fora și obiectele de testare în același ca și în cazul în care le-ați înregistrat la consola folosind metoda dirxml ().

Selectați Add Uita-te la partea de jos a suprapunerii pentru a adăuga o variabilă sau un obiect la valori de referință.

Imaginea de mai sus arată un apel asincron foarte simplu, este creat la pornire a următorului cod în consolă.