Efektīva Chrome izstrādātāja rīku lietošana (pamācība)

Efektīva Chrome Developer Tools izmantošana: noderīgas Console metodes

Visi pamācības video Efektīva Chrome izstrādātāja rīku lietošana (pamācība)

Chrome Developer Tools ir neaizvietojams instruments. Svarīgi ir saprast dažādas funkcijas un metodes, kas var palīdzēt efektīvi atkļūdot kodu un nodrošināt vērtīgu informāciju. Šajā vadlīnijā es vēlos iepazīstināt ar dažām mazāk izmantotām, taču ļoti noderīgām Console-metodēm, kas palīdzēs optimizēt tavu darbu.

Svarīgākie secinājumi

  • assert(): Pārbaudi, vai nosacījums ir patiess, un saņem kļūdas ziņojumu, ja tas nav gadījumā.
  • count(): Saskaiti, cik reizes ir izsaukta konkrēta metode, un pēc nepieciešamības atiestati skaitītāju.
  • time() un timeEnd(): Mēri laiku, kas nepieciešams konkrētam tavas koda blokam.
  • trace(): Seko līdzi, kur tava koda izpilde notiek, lai atvieglotu atkļūvošanas procesus.

Pamācība soli pa solim

Vispirms ir jāatver Chrome Developer Tools. To var izdarīt, noklikšķinot uz lapas ar labo peles taustiņu un izvēloties “Pārbaudīt” (vai nospiežot F12). Tagad, kad konsole ir atvērta, mēs varam izmēģināt dažādas Console metodes.

Izmanto assert()

Ļoti noderīgs instruments ir assert() metode. Šo metodi izmanto, lai pārliecinātos, ka konkrēts izteiciens ir patiess. Ja nodoš izteicienu, kas nav pareizs, konsole parādīs “Assertion Failed” kļūdu. Mēģināsim to vienreiz.

Efektīva Chrome Developer rīku izmantošana: noderīgie konsoles veidi

Šeit esmu sagatavojis vienkāršu piemēru assert() metodei. Pārtopu izteicienu, un ja tas nepieciešams, konsole rādīs “Assertion Failed” kļūdu. Tas ir noderīgi, lai pārliecinātos, vai mainīgie vai stāvokļi ir vēlami.

Efektīva Chrome Developer Tools izmantošana: Noderīgas Console metodes

Īpatnība ir tā, ka, liekot peles taustiņu uz kļūdu konsole, tu vari iegūt sīkāku informāciju par to, kur kļūda ir notikusi. Tas ir īpaši noderīgi sarežģītākām lietojumprogrammām.

Skaitīšana ar count()

Nākamā metode ir count(). Ar šo metodi tu vari saskaitīt, cik reizes konkrēta funkcija vai koda rindiņa ir izsaukta. Tas var palīdzēt, piemēram, sekt funkciju izsaukumus. Aplūkosim to tuvāk.

Šeit izmantoju count ar ID, lai redzētu, cik reizes funkcija ir izsaukta. Katru reizi, kad aktivizēju funkciju, skaitlis automātiski palielinās. Ja vēlies zināt, cik bieži tu esi kādā konkrētā vietā kodā, count() ir ārkārtīgi noderīga.

Papildus ir arī countReset(), lai atiestatītu skaitītāju uz nulli. count() un countReset() lietošana var radīt daudz priekšrocību, īpaši ja jāatrod kļūdas kompleksajā loģikā.

Laika mērīšana ar time() un timeEnd()

Vēl viens svarīgs rīks ir funkcijas time() un timeEnd(). Ar time() tu vari noteikt laika mērījuma sākumpunktā, un ar timeEnd() saglabāt beigu punktu, lai noskaidrotu, cik ilgi pagājis laiks. Apskatīsim arī šeit piemēru.

Efektīva Chrome Developer Tools izmantošana: Noderīgas konsoles metodes

Es izmantoju time() koda sākumā un pēc noteikta bloka, lai noskaidrotu, cik ilgi šis koda fragments ilguši. Rezultāts tiek izvadīts milisekundēs, kas palīdz analizēt tavu koda veiktspēju.

Šīs laika mērīšanas metodes ir īpaši noderīgas, ja vēlies identificēt un analizēt kodu, kas ir jāoptimizē.

Sekojot ar trace()

Pēdējā, bet ne mazāk svarīgā metode ir trace(). Šī metode ļauj rādīt vēsturi visos punktos, kur trace() ir izsaukta kodā. Tas palīdz saprast tavu koda plūsmu labāk un identificēt jomas, kur var rasties vairāki izsaukumi.

Efektīva Chrome Developer Tools izmantošana: Noderīgas Console metodes

Šeit redzams, kā esmu izmantojis trace() sekot koda lokācijai. Atverot izsaukumu kopu, varu nekavējoties pāriet uz atbilstošajiem kodeksa punktiem. Tas ir īpaši noderīgs atkļūvošanas procesā.

Efektīva Chrome attīstītāja instrumentu izmantošana: noderīgie konsoles metodēs

Visbeidzot ir svarīgi uzsvērt, ka šos kļūdu labošanas metodus savā ražošanas kodā ir labāk izvairīties, lai optimizētu veiktspēju un minimizētu nevēlamas konsolē izvades.

Kopsavilkums

Šajā rokasgrāmatā mēs esam apsprieduši dažas spēcīgas Chrome Developer Tools konsolē esošas metodes, kas ikdienas tīmekļa izstrādes darbā jums var sniegt lielu labumu. Ar funkcijām, piemēram, assert(), count(), time() un trace(), jūs esat pilnībā gatavs efektīvi uzraudzīt savu kodu, identificēt kļūdas un optimizēt veiktspēju. Atcerieties, ka efektīva kļūdu labošana ir svarīga jebkura programmatūras izstrādes sastāvdaļa.

Bieži uzdotie jautājumi

Ko dara metode assert()?Metode assert() nodrošina, ka izteiksme ir patiesa, un izvada kļūdu, ja tā nav.

Kā darbojas metode count()?Metode count() saskaita, cik reizes tiek izsaukta funkcija, un var tikt atiestatīta.

Ko es varu darīt ar time() un timeEnd()?Šīm metodēm es varu mērīt laiku, kas nepieciešams manam kodam, kas man palīdz novērtēt veiktspēju.

Kāpēc man vajadzētu izmantot metodi trace()?Metode trace() palīdz man sekot manas koda izpildes secībai un identificēt potenciālas problēmas kļūdu labošanas laikā.

Vai man vajadzētu saglabāt šīs metodes ražošanas kodā?Ieteicams izņemt šīs kļūdu labošanas metodes no ražošanas koda, lai optimizētu veiktspēju.