Reading-Notes

Debugging

This topic is important to me because I want to practice my skills as a programmer and be able to break down my code when needed to find issues.

References

https://developer.mozilla.org/en-US/docs/Learn/JavaScript/First_steps/What_went_wrong. https://developer.mozilla.org/en-US/docs/Learn/Common_questions/What_are_browser_developer_tools#the_javascript_debugger. https://developer.mozilla.org/en-US/docs/Learn/HTML/Introduction_to_HTML/Debugging_HTML. https://developer.mozilla.org/en-US/docs/Learn/CSS/Building_blocks/Debugging_CSS.

Troubleshooting JavaScript

Two main type of errors in the code:

  1. Syntax Error.

  2. Logic Error.

Syntax errors are spelling errors. This is pretty easy to fix, its just going in your code and finding where you went wrong.

Logic Errors are errors where the syntax is correct but the code isn’t what you intended it to be. This is harder to fix.

The console is your friend.

On your error it gives you a lot of detail of what is wrong, a source to details about your error and debugger tabs.

console logging helps you find out the issues with smaller parts to lead up to the bigger issue.

SyntaxError: Missing ; before statement usually means you have missed a semicolon.

Its always useful to read your error and break it down from there. Google and use resources to determine the error.

JS Troubleshooting Questions

  1. Syntax error is usually a spelling error where as an logic error is usually a error in logic in your code.

  2. Missing Semicolon error,Undefined methods, and imrpoper usage of the return. I solved them by observing my code, seeing what I did wrong, and doing research.

  3. Knowing error codes help you cleanly do your code to prevent errors. It will help me build my skills to be a great developer.

The JavaScript Debugger

Since I use Firefox, debugger is found going to comand shift s.

Theres three parts of the debugger:

  1. File list

  2. Source Code

  3. Watch Expressions and breakpoints

The File List lists the files associated with the page you are debugging.

The Source Code is where you can set breakpoints where you want to pause execution.

The last is watch expressions and breakpoints where you can add brekpoints and watch them on its own tab.

JavaScript Debugger Questions

  1. This tool is essential in just figuring out your issues in your code, it lets you pick areas to test and find if its the issue.

  2. Its an intentional stopping in your program to debug it.

  3. It allows to keep track of its place in a script.

Things I want to know more about

I want to know more about debugging so i can break down my code futher.

How does this apply to coding in a bigger environment.