Jak ustawić punkt przerwania JavaScript z kodu w Chrome?

Ustaw przycisk kliknij listener i wywołaj debugger;

Przykład

$("#myBtn").click(function() {
 debugger;   
});

Demo

Http://jsfiddle.net/hBCH5/

Resources on debugging in JavaScript

• http://www.laurencegellert.com/2012/05/the-three-ways-of-setting-breakpoints-in-javascript/
• http://berzniz.com/post/78260747646/5-javascript-debugging-tips-youll-start-using-today

Jak już powiedzieli inni, debugger; jest droga do zrobienia. Napisałem mały skrypt, który możesz użyć z wiersza poleceń w przeglądarce, aby ustawić i usunąć punkt przerwania tuż przed wywołaniem funkcji: http://andrijac.github.io/blog/2014/01/31/javascript-breakpoint/

Możesz również użyć debug(function), aby złamać, gdy wywołane jest function.

Command Line API Reference: debug

W zakładce "Skrypty" przejdź do miejsca, w którym znajduje się Twój kod. Po lewej stronie numeru linii kliknij. Spowoduje to ustawienie punktu przerwania.

Zrzut ekranu:

Będziesz mógł śledzić swoje punkty przerwania na prawej karcie (jak pokazano na zrzucie ekranu).

debugger jest zastrzeżonym słowem kluczowym EcmaScript i podanym opcjonalną semantyką od ES5

W rezultacie może być używany nie tylko w Chrome, ale także Firefox i Node.JS via node debug myscript.js.

Norma mówi :

Składnia

DebuggerStatement :
    debugger ;

Semantyka

Ocena produkcji DebuggerStatement może pozwolić implementacji na wywołanie punktu przerwania, gdy zostanie uruchomiona pod debuggerem. Jeśli debugger nie jest obecny lub aktywny to polecenie nie ma widocznego efektu.

Production DebuggerStatement: debugger; jest oceniany w następujący sposób:

1. Jeśli implementacja defined debugging facility jest dostępna i włączona, To
   1. wykonaj operację debugowania zdefiniowaną w implementacji.
   2. niech wynik będzie wartością zakończenia zdefiniowaną w implementacji.
2. Else
   1. niech wynik będzie (normalny, pusty, pusty).
3. Return result.

Brak zmian w ES6.

Jest to możliwe i jest wiele powodów, dla których warto to zrobić. Na przykład debugowanie nieskończonej pętli javascript blisko początku ładowania strony, która uniemożliwia prawidłowe ładowanie zestawu narzędzi programistycznych chrome (lub firebug).

Patrz punkt 2

Http://www.laurencegellert.com/2012/05/the-three-ways-of-setting-breakpoints-in-javascript/

Lub po prostu dodaj linię zawierającą słowo debugger do kodu w wymaganym punkcie testowym.

Breakpoint:-

Breakpoint przestanie być wykonywany i pozwoli Ci zbadać wartości JavaScript.

Po sprawdzeniu wartości można wznowić wykonywanie kodu (zazwyczaj za pomocą przycisku play).

Debugger : -

Debugger; zatrzymuje wykonywanie JavaScript i wywołuje funkcję debugowania.

Instrukcja debugger zawiesza wykonywanie, ale nie zamyka żadnych plików ani nie usuwa żadnych zmiennych.

Example:-
function checkBuggyStuff() {
  debugger; // do buggy stuff to examine.
};

Można również ustawić debug(functionName) do debugowania funkcji.

Https://developers.google.com/web/tools/chrome-devtools/javascript/breakpoints#function

Istnieje wiele sposobów debugowania kodu JavaScript. Następujące dwa podejścia są szeroko stosowane do debugowania JavaScript za pomocą kodu

1. Użycie console.log() do wydruku wartości w przeglądarce konsola. (Pomoże Ci to zrozumieć wartości w określonych punktach Twojego kodu)

2. Słowo kluczowe debuggera. Dodaj debugger; do lokalizacji, które chcesz Debuguj, otwórz konsolę dewelopera przeglądarki i przejdź do zakładka źródła.

Aby uzyskać więcej narzędzi i sposobów, w których debug JavaScript kod, podane są w ten link przez W3School.