JavaScript Fundamentals

JavaScript is a lightweight, dynamic, untyped scripting language that runs in browsers. It supports functional and object-oriented paradigms, handles events, and runs on servers with Node.js and HTML CSS styling.

Learn how to embed JavaScript inside an HTML page using internal scripts, including creating an HTML document and script blocks in head and body, and viewing output with document.write.

Learn how the document object represents the active HTML document in the browser and how its write method outputs content to the page, alongside the window object.

Learn how to use JavaScript comments to document code, including single line, multi-line, and HTML comments, and how commenting affects browser output.

Learn how to create an external JavaScript file, move internal script content to external.js, and reference it from HTML using a relative path.

Learn when to use semicolons in JavaScript to separate statements, understand errors like Unexpected identifier, and practice writing readable code by adding semicolons for multi-line or multi-statement lines.

Learn to handle errors and debug JavaScript using the JavaScript console, locate closing parenthesis syntax issues in external.js, fix them, and refresh to view the expected output for JavaScript fundamentals.

Store and retrieve data with variables in JavaScript using the var keyword and dynamic typing, and learn numbers, strings, boolean, null, undefined, and objects.

Define JavaScript variables with var, initialize integers, floats, and strings with quotes, and print values with document.write, showing case sensitivity for x, _x, $x, X, and s.

Explore JavaScript arithmetic operators: addition, subtraction, division, and modulus, through simple HTML examples that show x+y, x-y, y/x, and y%x outputs.

learn how the plus operator concatenates strings in JavaScript, turning numbers and string literals into strings when combined with a string.

Explore JavaScript's automatic type conversion and the inbuilt NaN value by testing arithmetic on string inputs; learn how numeric strings yield results while non-numeric strings produce NaN, with examples.

Learn how compound assignment operators work in JavaScript, including x *= y and the pattern z = x = x * y, with step-by-step console output demonstrating value changes.

Explore how post-increment and post-decrement, and pre-increment and pre-decrement operators modify variable values in JavaScript, with practical examples showing evaluation order and outcomes.

Explore how JavaScript uses conditional operators to compare values, including == vs === and != vs !==, highlighting type coercion and when comparisons ignore data types.

Learn about alert and confirm popups in JavaScript fundamentals, with practical steps to display messages using alert and handle user choice via confirm, plus a preview of prompt.

Create a prompt popup in prompt.html to gather user input, using var s = prompt('Enter his user id'); display the s with document.write, and observe null until input is provided.

Practice adding two numbers using prompt inputs, convert strings to numbers with parseInt and parseFloat, and display the sum with document.write in JavaScript fundamentals lesson.

explore the if statement, a conditional statement that evaluates a boolean true or false; the body executes only when the condition is true, as in checking x==10 and displaying x.

Demonstrates using if..else to execute code when a condition is true or false, print values with document.write, and set a default prompt value to guide input.

Learn how to use the if-else ladder to select code blocks by conditions, and build a grading app that computes pass/fail and A, B, C grades from three subject scores.

Build a grading application in JavaScript using an if-else ladder, prompting for three marks, parsing to integers, and displaying total, average, and the grade (A, B, or C).

JavaScript covers logical operators and or, represented by && and ||, where and requires all expressions true for the if block to run, or runs when any expression is true.

Learn how to use switch in JavaScript, including syntax with case labels and default, and how break prevents fall-through, demonstrated by an interactive example accepting 1–3 via prompt and parseInt.

Explore using switch statements with string values in JavaScript, with cases like john, bharath, and mark, outputs via document.write, and a default no match handling.

Master looping statements to execute code multiple times using for, while, and do-while loops. Explore for-in loops to display object properties and see first three loops in action.

Master the for loop syntax—initialization, condition, and increment—and print numbers from 1 to a user entered n using document.write in the loop body.

Learn how the while loop runs its body while a condition stays true, with initialization outside and increment inside, unlike the for loop that handles all three steps.

Show how the do-while loop executes at least once before the condition, using do { ... } while (condition); an example starts with i=3 and n=2.

Learn how the break and continue statements control a for loop, breaking when i equals 4 and skipping that iteration to print 1 through 3, then continue after the loop.

Define and reuse logic with user-defined functions in JavaScript, using function keywords and parameters; the hands-on display() example shows invoking and case sensitivity.

Define a function with arguments and invoke it with inputs like multiply(10,20) and multiply(5,4) to produce 200 and 20, displaying results with document.write.

Learn to return values from functions with the return keyword, make it the last line, and display results by assigning the return value or using document.write.

Explore closures by defining a function inside another function and accessing its local and parent variables, as well as global variables, then invoke and return the inner function's output.

Explore local and global variables in JavaScript, showing that local variables inside a function stay confined, while global variables defined in the script are accessible throughout the code.

Learn how browsers raise events like onload, onfocus, and onclick, and write JavaScript to validate fields, submit data, and dynamically update html through real-time examples.

Learn to implement onmouseover and onmouseout events to control marquee scrolling in HTML using built-in start and stop functions, with practical examples and file setup.

Learn to handle onmouseover and onmouseout with custom functions, access the current element using this, and change styles and innerHTML to reflect mouseover and mouseout.

Learn to handle the onclick event by building a simple calculator in HTML and JavaScript, retrieving form values, parsing numbers, and displaying the sum in a result field.

Execute onClick events to perform add, sub, mul, div, and mod operations using the this keyword to pass the clicked button to a calculate function, displaying results in result field.

Discover how the onchange event triggers when a user changes a selection in an HTML select box to update the document background color, using this.value to pass the chosen color.

Use the onchange event to navigate to a selected website by updating window.location. Create a simple html file with a select box choosing Bharath Thippireddy's website or google.com.

Switch the document background image based on user selection from three images in an images folder, using an onchange handler to set document.body.style.backgroundImage with url(...) and a relative path.

Learn how onfocus and onblur events activate styling changes for a text field by using handleOnFocus and handleOnBlur functions to adjust text color and background color.

Demonstrate keyboard events in JavaScript by implementing onkeydown, onkeyup, and onkeypress in a text field. Assign color changes for each event and reuse the onfocus/onblur code.

Learn how to handle the onload event in JavaScript and trigger printing with window.print(), including creating a handleOnLoad function and printing the document.

Learn how to redirect a page on load by updating the onload handler to set window.location to bharaththippireddy.com, saving as onloadredirect.html, and testing the automatic redirect.

Learn how to delay a redirect with the built-in setTimeout function in JavaScript by using waitForFiveSeconds on page load to invoke redirect after a set delay.

Learn how the onsubmit event handles HTML form submissions by wiring a handleOnSubmit() function to display an alert, and prepare for future form field validations.

Explore JavaScript strings as inbuilt objects, create strings with quotes, access length, use indexOf and lastIndexOf, convert case with toLowerCase and toUpperCase, and replace text with document.write.

Explore the JavaScript boolean type, learn how 0 and 1 map to false and true, and how values like empty strings, NaN, null, and non-empty strings are coerced to booleans.

Explore the Math inbuilt type to perform mathematical operations using constants like Math.PI and functions such as Math.sqrt, Math.pow, Math.floor, Math.ceil, and Math.round.

Learn how JavaScript arrays hold multiple types and are created in three ways: new Array, square brackets, or empty arrays with indexing, and how to read their length and elements.

Explore array manipulation in JavaScript with concat, reverse, and join, learning how to concatenate arrays, reverse results, and join elements with a delimiter.

Learn to delete elements from a JavaScript array using the delete method, and to replace elements with index assignment, demonstrated through browser-based examples.

Learn to create a date in JavaScript, display current date and time with toLocaleTimeString, toLocaleDateString, and toLocaleString, and dynamically update a page element using the DOM on page load.

Learn how to use the setInterval method to continuously update the time on a web page by invoking displayDate every second, with continuousDisplay on load and clearInterval to stop.

Learn how to identify syntax and runtime errors in JavaScript, use try-catch to handle errors, and view errors in the browser console and developer tools.

Learn to throw and handle custom errors in JavaScript using throw keyword, with an age check that reports 'age can not be empty' or 'too young to vote' via try-catch.

Learn how the finally block in JavaScript always executes, whether or not an error occurs, and use it to clean up resources such as server connections after try or catch.

Learn to debug JavaScript from within the chrome browser by using the sources tab, breakpoints, and f12 to inspect values and verify runtime behavior.