Co to jest console.log?

Jakie jest zastosowanie console.log?

Wyjaśnij, jak używać go w JavaScript, na przykładzie kodu.

To nie jest funkcja jQuery, ale funkcja do celów debugowania. Możesz na przykład zalogować coś do konsoli, gdy coś się stanie. Na przykład:

$('#someButton').click(function() {
  console.log('#someButton was clicked');
  // do something
});

Zobaczysz wtedy #someButton was clickedw zakładce „Konsola” Firebuga (lub konsoli innego narzędzia - np. Inspektora sieci Chrome), kiedy klikniesz przycisk.

Z niektórych powodów obiekt konsoli może być niedostępny. Następnie możesz sprawdzić, czy tak jest - jest to przydatne, ponieważ nie musisz usuwać kodu debugowania podczas wdrażania do wersji produkcyjnej:

if (window.console && window.console.log) {
  // console is available
}

Miejsca, w których możesz zobaczyć konsolę! Wystarczy mieć je wszystkie w jednej odpowiedzi.

Firefox

http://getfirebug.com/

(możesz teraz także korzystać z wbudowanych narzędzi programistycznych Firefoksa Ctrl + Shift + J (Narzędzia> Web Developer> Konsola błędów), ale Firebug jest znacznie lepszy; użyj Firebug)

Safari i Chrome

Zasadniczo to samo.

https://developers.google.com/chrome-developer-tools/docs/overview

https://developer.apple.com/technologies/safari/developer-tools.html

Internet Explorer

Nie zapominaj, że możesz używać trybów zgodności do debugowania IE7 i IE8 w IE9 lub IE10

http://msdn.microsoft.com/en-us/library/ie/gg589507(v=vs.85).aspx

http://msdn.microsoft.com/en-us/library/dd565628(v=vs.85).aspx

Jeśli musisz uzyskać dostęp do konsoli w IE6 dla IE7, skorzystaj z bookmarkletu Firebug Lite

http://getfirebug.com/firebuglite/ szukaj stabilnego bookmarkletu

http://en.wikipedia.org/wiki/Bookmarklet

Opera

http://www.opera.com/dragonfly/

iOS

Działa na wszystkich iPhone'ach, iPodach touch i iPadach.

http://developer.apple.com/library/ios/ipad/#DOCUMENTATION/AppleApplications/Reference/SafariWebContent/DebuggingSafarioniPhoneContent/DebuggingSafarioniPhoneContent.html

Teraz z iOS 6 możesz przeglądać konsolę przez Safari w OS X, jeśli podłączysz urządzenie. Możesz to zrobić za pomocą emulatora, po prostu otwórz okno przeglądarki Safari i przejdź do karty „Opracuj”. Znajdziesz tam opcje umożliwiające inspektorowi Safari komunikację z urządzeniem.

Windows Phone, Android

Oba nie mają wbudowanej konsoli i nie mają możliwości tworzenia zakładek. Używamy więc http://jsconsole.com/ type: słuchaj, a otrzymasz skrypt do umieszczenia w kodzie HTML. Od tego momentu możesz wyświetlać swoją konsolę na stronie internetowej jsconsole.

iOS i Android

Możesz także użyć http://html.adobe.com/edge/inspect/, aby uzyskać dostęp do narzędzi inspektora sieci i konsoli na dowolnym urządzeniu za pomocą wygodnej wtyczki do przeglądarki.

Starsze problemy z przeglądarką

Wreszcie starsze wersje IE ulegną awarii, jeśli użyjesz konsoli.log w kodzie i nie otworzysz narzędzi programistycznych w tym samym czasie. Na szczęście jest to łatwa naprawa. Użyj poniższego fragmentu kodu u góry kodu:

 if(!window.console){ window.console = {log: function(){} }; } 

To sprawdza, czy konsola jest obecna, a jeśli nie, ustawia ją na obiekt o nazwie pustej funkcji log. W ten sposób window.console i window.console.log nigdy nie są naprawdęundefined.

Możesz przeglądać wszelkie wiadomości zarejestrowane w konsoli, jeśli używasz narzędzia takiego jak Firebug do sprawdzania swojego kodu. Powiedzmy, że to robisz:

console.log('Testing console');

Gdy uzyskasz dostęp do konsoli w Firebug (lub innym narzędziu, które zdecydujesz się użyć do sprawdzenia kodu), zobaczysz każdą wiadomość, której funkcję chcesz zalogować. Jest to szczególnie przydatne, gdy chcesz sprawdzić, czy funkcja wykonuje się lub czy zmienna jest poprawnie przekazywana / przypisywana. Jest to w rzeczywistości dość cenne, aby dowiedzieć się, co poszło nie tak z twoim kodem.

Wyśle komunikat dziennika do konsoli javascript przeglądarki, np. Firebug lub Developer Tools (Chrome / Safari) i wyświetli wiersz i plik, z którego został wykonany.

Co więcej, kiedy wyślesz obiekt jQuery, będzie on zawierał odniesienie do tego elementu w DOM, a kliknięcie go spowoduje przejście do tego w zakładce Elements / HTML.

Możesz używać różnych metod, ale uwaga: aby działał w Firefoksie, musisz mieć otwartego Firebuga, w przeciwnym razie cała strona ulegnie awarii. Bez względu na to, czy logujesz się jako zmienna, tablica, obiekt lub element DOM, da ci to pełny podział, w tym również prototyp obiektu (zawsze interesujące jest, żebyś miał poke). Możesz także dołączyć dowolną liczbę argumentów, a zostaną one zastąpione spacjami.

console.log(  myvar, "Logged!");
console.info( myvar, "Logged!");
console.warn( myvar, "Logged!");
console.debug(myvar, "Logged!");
console.error(myvar, "Logged!");

Wyświetlają się one z różnymi logo dla każdego polecenia.

Możesz także użyć console.profile(profileName);do rozpoczęcia profilowania funkcji, skryptu itp. A następnie zakończyć ją, console.profileEnd(profileName);a pojawi się ona na karcie Profile w Chrome (nie wiem w FF).

Pełne odniesienie znajduje się na stronie http://getfirebug.com/logging i sugeruję, aby je przeczytać. (Ślady, grupy, profilowanie, kontrola obiektów).

Mam nadzieję że to pomoże!

Z jQuery nie ma nic wspólnego, a jeśli chcesz go użyć, radzę ci to zrobić

if (window.console) {
    console.log("your message")
}

Nie łamiesz więc kodu, gdy nie jest on dostępny.

Jak sugerowano w komentarzu, możesz również wykonać to w jednym miejscu, a następnie użyć console.lognormalnie

if (!window.console) { window.console = { log: function(){} }; }

console.lognie ma nic wspólnego z jQuery. Jest to powszechny obiekt / metoda udostępniana przez debuggery (w tym debugger Chrome i Firebug), który pozwala skryptowi rejestrować dane (lub obiekty w większości przypadków) na konsoli JavaScript.

console.logloguje informacje debugowania do konsoli w niektórych przeglądarkach (Firefox z zainstalowanym Firebug, Chrome, IE8, cokolwiek z zainstalowanym Firebug Lite). W Firefoksie jest to bardzo potężne narzędzie, które pozwala sprawdzać obiekty lub badać układ lub inne właściwości elementów HTML. Nie jest to związane z jQuery, ale przy użyciu go z jQuery często wykonuje się dwie rzeczy:

• zainstaluj rozszerzenie FireQuery dla Firebug. To, między innymi, sprawia, że ​​rejestrowanie obiektów jQuery wygląda ładniej.

• stwórz opakowanie, które będzie bardziej zgodne z konwencjami kodu łańcuchowego jQuery.

Oznacza to zwykle coś takiego:

$.fn.log = function() {
    if (window.console && console.log) {
        console.log(this);
    }
    return this;
}

które możesz następnie wywołać jak

$('foo.bar').find(':baz').log().hide();

aby łatwo sprawdzić wewnątrz łańcuchów jQuery.

console.log nie ma nic wspólnego z jQuery.

Loguje komunikat do konsoli debugowania, takiej jak Firebug.

Niekiedy chodzi o zamieszanie, że aby zarejestrować wiadomość tekstową wraz z zawartością jednego z twoich obiektów za pomocą console.log, musisz przekazać każdy z nich jako inny argument. Oznacza to, że musisz je rozdzielić przecinkami, ponieważ jeśli użyjesz operatora + do połączenia danych wyjściowych, domyślnie wywołałoby to .toString()metodę twojego obiektu. W większości przypadków nie jest to jawnie nadpisywane, a domyślna implementacja dziedziczona przez Objectnie dostarcza żadnych użytecznych informacji.

Przykład do wypróbowania w konsoli:

>>> var myObj = {foo: 'bar'}
undefined
>>> console.log('myObj is: ', myObj);
myObj is: Object { foo= "bar"}

mając na uwadze, że jeśli spróbujesz połączyć informacyjną wiadomość tekstową z zawartością obiektu, otrzymasz:

>>> console.log('myObj is: ' + myObj);
myObj is: [object Object]

Pamiętaj więc, że console.log w rzeczywistości bierze tyle argumentów, ile chcesz.

Służy console.logdo dodawania informacji o debugowaniu do strony.

Wiele osób korzysta alert(hasNinjas)z tego celu, ale console.log(hasNinjas)łatwiej z nim pracować. Za pomocą wyskakujących okienek wyskakujące modalne okno dialogowe blokujące interfejs użytkownika.

Edycja: Zgadzam się z Baptiste Pernet i Janem Hančičem , że bardzo dobrym pomysłem jest sprawdzenie, czy window.consolejest zdefiniowane jako pierwsze, aby Twój kod się nie łamał , jeśli nie jest dostępna konsola.

Przykład - załóżmy, że chcesz wiedzieć, który wiersz kodu byłeś w stanie uruchomić program (zanim się zepsuł!), Po prostu wpisz

console.log("You made it to line 26. But then something went very, very wrong.")

Używasz go do debugowania kodu JavaScript za pomocą Firebug for Firefox lub konsoli JavaScript w przeglądarkach WebKit .

var variable;

console.log(variable);

Wyświetli zawartość zmiennej, nawet jeśli jest to tablica lub obiekt.

Jest ona podobna do print_r($var);dla PHP .

Uwaga: pozostawienie wywołań konsoli w kodzie produkcyjnym spowoduje uszkodzenie witryny w przeglądarce Internet Explorer. Nigdy nie przechowuj go w rozpakowaniu. Zobacz: https://web.archive.org/web/20150908041020/blog.patspam.com/2009/the-curse-of-consolelog

Na początku debugowanie JS odbywało się za pomocą alert()funkcji - teraz jest to przestarzała praktyka.

console.log()To funkcja, która pisze wiadomość do logowania na konsoli debugowania, takich jak Webkit lub Firebug. W przeglądarce nic nie widać na ekranie. Loguje komunikat do konsoli debugowania. Jest dostępny tylko w Firefoksie z Firebug oraz w przeglądarkach opartych na Webkit (Chrome i Safari). Nie działa dobrze we wszystkich wydaniach IE .

Obiekt konsoli jest rozszerzeniem DOM.

console.log()Powinny być stosowane tylko w kodzie w czasie rozwoju i debugowania.

Uznaje się za złą praktykę, że ktoś pozostawia console.log()w pliku javascript na serwerze produkcyjnym.

Jeśli Twoja przeglądarka obsługuje debugowanie, możesz użyć metody console.log () do wyświetlenia wartości JavaScript.

Aktywuj debugowanie w przeglądarce za pomocą F12 i wybierz „Console” w menu debuggera.

Konsola w JavaScript. Spróbuj naprawić lub „debugować” niedziałający program JavaScript i poćwicz korzystanie z komendy console.log (). Istnieją skróty, które pomogą Ci uzyskać dostęp do konsoli JavaScript, w zależności od używanej przeglądarki:

Skróty klawiaturowe konsoli Chrome

Windows: Ctrl+ Shift+ J
Mac: Cmd+ Option+J

Skróty klawiaturowe konsoli Firefox

Windows: Ctrl+ Shift+ K
Mac: Cmd+ Option+K

Skróty klawiaturowe konsoli Internet Explorer

F12 klucz

Skróty klawiaturowe w konsoli Safari

Cmd+ Option+C

console.logw szczególności jest to metoda dla programistów do pisania kodu w celu niepozornego informowania programistów o tym, co robi kod. Można go użyć do ostrzeżenia o problemie, ale nie powinien zastępować interaktywnego debugera, gdy przychodzi czas na debugowanie kodu. Jego asynchroniczny charakter oznacza, że zarejestrowane wartości niekoniecznie reprezentują wartość w momencie wywołania metody.

W skrócie: rejestruj błędy za pomocą console.log(jeśli są dostępne), a następnie napraw je za pomocą wybranego debuggera: Firebug , WebKit Developer Tools (wbudowany w Safari i Chrome ), IE Developer Tools lub Visual Studio.

Naprawdę czuję, że programowanie sieciowe jest łatwe, kiedy zaczynam console.logdebugować.

var i;

Jeśli chcę sprawdzić wartość iśrodowiska wykonawczego ..

console.log(i);

możesz sprawdzić bieżącą wartość iw zakładce konsoli firebug. Jest specjalnie używany do debugowania.

Służy do logowania (cokolwiek przekażesz) do konsoli Firebug . Głównym zastosowaniem byłoby debugowanie kodu JavaScript.

Oprócz wyżej wymienionych zastosowań console.logmożna również drukować na terminalu w node.js. Serwer utworzony za pomocą ekspresu (np.) Może użyć console.logdo zapisu do wyjściowego pliku rejestratora.

W skryptach Java nie ma funkcji wejścia i wyjścia. Aby debugować kod, użyto metody console.log (). Jest to metoda rejestrowania. Zostanie wydrukowany w dzienniku konsoli (narzędzia programistyczne).

Nie jest obecny w IE8 i poniżej, dopóki nie otworzysz narzędzia programistycznego IE.

To nie ma nic wspólnego z jQuery. console.log()Odwołuje się do funkcji logarytmicznej obiektu konsoli, która przedstawia sposoby rejestrowania informacji do konsoli przeglądarki. Metody te są przeznaczone wyłącznie do celów debugowania i nie należy polegać na prezentowaniu informacji użytkownikom końcowym.