Łukasz Gąsior
  • Home
  • now!
  • Blog
  • Po polsku
Social Links
Twitter
LinkedIn
Facebook
YouTube
Reddit
Instagram
GitHub
Medium
RSS
Łukasz Gąsior
  • Home
  • now!
  • Blog
  • Po polsku
  • Po polsku

console.log(); – wykorzystanie konsoli w JavaScript

  • 2012-02-22
  • 6 komentarzy
  • 2 minute read
  • 8.3K views

JavaScript jest nieodłącznym elementem praktycznie każdej strony www. Coraz częściej poziom skomplikowania JavaScriptu jest większy niż logiki po stronie serwera. Niestety js jest trochę niewdzięczny pod względem kontrolowania tego, co robi 🙂

Pisząc pierwsze skrypty wpadłem na pomysł, by strzelać alertami za każdym razem, kiedy chcę sprawdzić, co dzieje się w skrypcie. Życie szybko jednak pokazało, że jest to złe podejście – tak odkryłem metodę console.log();.

Obiekt console nie jest standardowym obiektem js – jest jednak obsługiwany przez konsole w różnych przeglądarkach (np. Firebug czy narzędzia programistyczne w Chromie – przeważnie konsole można włączyć klawiszem F12). Ogólnie możemy z niego korzystać praktycznie bez ograniczeń.

Jak można się łatwo domyśleć console.log() powoduje wyświetlenie wiadomości w konsoli – tak jak to robimy np. log4netem w C#.

Przykładowe wywołanie wygląda tak:

console.log("log test");

i w konsoli mamy:

Wiadomość przekazywaną do metody log() możemy formatować tak, jak w string.format w C# – zmienne z wiadomości oznaczajmy %s:

var p1 = "a"; var p2 = "b"; var p3 = "c";
console.log("Sample log message with parameters: %s, %s, %s", p1, p2, p3);

Tak jak każdy loger obiekt console umożliwia logowanie wiadomości na różnych poziomach (różnią się formatowaniem wiadomości w konsoli):

console.log("log test");
console.error("error test");
console.warn("warn test");
console.info("info test");
console.debug("debug test");
console.log("log test");

Inne przydatne metody.

Metoda log() jest bardzo użyteczna i najczęściej używana. Jednak obiekt console posiada więcej bardzo przydatnych metod.

console.trace()
mój MISZCZ(!) – pokazuje ścieżkę wykonania skryptu 🙂

function method1(p){
   method2();
}

function method2(){
   console.log("call from method 2");
   console.trace();
}

method1("abc");


console.time() / console.timeEnd()
Loguje do konsoli czas wykonania operacji – jej identyfikator podajemy w parametrze:

console.time("test time");
method1();
console.timeEnd("test time");


Są to najczęściej wykorzystywane przeze mnie metody – więcej znajdziecie tutaj: http://getfirebug.com/wiki/index.php/Console_API.

Niestety wykorzystanie obiektu console może przysparzać pewnych problemów, ale o tym napiszę w kolejnym poście.

Share
Tweet
Share
Share
Related Topics
  • console
  • debug
  • JavaScript
  • profile
  • trace
You May Also Like
View Post
  • Po polsku

Software Craftsmanship Wrocław

  • 2017-06-06
View Post
  • Po polsku

Pilnuj typów danych

  • 2014-02-26
View Post
  • Po polsku

ReSharper Essentials – poszło!

  • 2014-02-21
View Post
  • Po polsku

Turbo-Mode Developera

  • 2014-02-19
View Post
  • Po polsku

Badanie usability by TechSmith

  • 2014-02-13
View Post
  • Po polsku

Global Windows Azure Bootcamp 2014

  • 2014-02-05
View Post
  • Po polsku

Quick tip: 12. Stosuj AsNoTracking() gdzie się da!

  • 2013-01-27
View Post
  • Po polsku

Quick tip: 11. Indexed views vs. SQL Server Express

  • 2012-07-23
6 comments
  1. Pingback: dotnetomaniak.pl
  2. Dawid pisze:
    2012-02-24 o 22:20

    Fajna sprawa i przydatna! Dzięki za wpis na pewno przyda się w codziennej pracy!

  3. Łukasz Bartczak pisze:
    2012-02-27 o 14:19

    Również polecam console! Sam używam od dawna jako zamiennik irytującego alert’a 🙂

  4. Pingback: Quick tip: 10. console.log(); w IE | Łukasz Gąsior - Blog
  5. Wojciech pisze:
    2013-04-28 o 01:17

    Trochę szkoda, że dopiero teraz się o tym dowiaduję 🙂
    Chciałbym poprawić: te %s to są określniki formatu.

  6. Łukasz Gąsior pisze:
    2013-04-28 o 09:01

    Fajnie, że się przydało 🙂

Comments are closed.

click & help!
Nakarm dziecko!
Follow me
RESHARPER ESSENTIALS
ReSharper Essentials
CODINGTV();
codingtv();
Twitter Feed
avatar
Lukasz Gasior
@lukaszgasior
146 Following
592 Followers
u @miroburn to jakieś większe zmiany na tej Maderze zaszły ... i nic się nie chwali na vlogach ... choć kursy na ak… https://t.co/WobZbxzG3d
113 days ago
  • Reply
  • Retweet
  • Favorite
RT @lukeintheclouds: Follow me if you are interested in: ➤ Cloud computing (mainly #azure and #gcp) ➤ DevOps ➤ Cybersecurity
229 days ago
  • Reply
  • 3 Retweet
  • Favorite
Follow
Categories
  • Azure Cloud (6)
  • Po polsku (104)
  • Windows (1)
Featured Posts
  • Azure Activity Log – Change History
    • 2020-09-29
  • Diagram Driven Cloud Infrastructure with Cloud Maker
    • 2020-09-22
  • Azure ARM template, but it is not JSON!
    • 2020-09-15
About
👍 Cloud | DevOps | Development | Technical Leadership | 📗Author of "ReSharper Essentials
© 2019 Łukasz Gąsior. All rights reserved.
hosted with ♥️ on webio | Polityka prywatności

Input your search keywords and press Enter.