JavaScript NOTES

Download as pdf or txt
Download as pdf or txt
You are on page 1of 5

JavaScript

What is JavaScript?
JavaScript is a scripting language used to create and control dynamic website content.

How many methods to write a JavaScript Code?


There are 2 methods to write JS code :-

1.) Internal JavaScript {Using Script tag}


2.) External JavaScript {Using external file(E.g. – file.js)}

Script Tag {<script> tag}


❖ The <script> tag is used to embed a client-side script (JavaScript).
❖ The <script> element either contains scripting statements, or it points to an external script
file through the src attribute.
❖ Common uses for JavaScript are image manipulation, form validation, and dynamic changes
of content.
Note : This language is a Case-sensitive language.

JavaScript Pop-Up Boxes


JavaScript has three kind of popup boxes: Alert box, Prompt box and Confirmation box.

1. What is an alert box in JavaScript?


An alert box is often used if you want to make sure information comes through to the user. When
an alert box pops up, the user will have to click "OK" to proceed.
Syntex : alert(“Type a message for user ”);

How does an alert box work?


The alert box takes the focus away from the current window, and forces the user to read the
message. Do not overuse this method. It prevents the user from accessing other parts of the page
until the alert box is closed.
2. What is a prompt box in JavaScript?
The prompt() method displays a dialog box that prompts the user for input.
The prompt() method returns the input value if the user clicks "OK", otherwise it returns null.

Syntex : var a=prompt(“Enter Your Name”);


alert(“Hello”+a);
Note : A prompt box is used if you want the user to input a value.
When a prompt box pops up, the user will have to click either "OK" or "Cancel" to proceed.
3. What is a Confirmation box in JavaScript?
A confirm box is often used if you want the user to verify or accept something.
When a confirm box pops up, the user will have to click either "OK" or "Cancel" to proceed.
If the user clicks "OK", the box returns true. If the user clicks "Cancel", the box returns false.
JavaScript
Syntex : var a=confirm(“Are you sure?”);

How to Convert a String value to a Number value ?


JavaScript has 2 kinds of methods to Convert a String value to a Number value : parseFloat and
parseInt .
parseFloat and parseInt Property in JS
▪ Use parseInt() when you specifically need to extract an integer value from a string. It will
discard any fractional part and return an integer.
▪ Use parseFloat() when you need to extract a floating-point number that may contain
decimal places. It will preserve the fractional part and return a floating-point number.
Note : If you were to get input from a user and it comes in as a string you can use the parse
method to convert it to a number that you can perform calculations on.

What is the getElementById() method in JavaScript?


The getElementById() is a JavaScript function that lets you grab an HTML element, by its id, and
perform an action on it. The name of the id is passed as a parameter, and the corresponding
element is the return value.
Syntex : var element=document.getElementById(“whatever_ID”);

How to change background color and text color in JavaScript?

1) Select the Target Element: Use methods like getElementById , getElementsByClassName


, or querySelector to obtain a reference to the HTML element you want to modify.
2) Access the Style Property: Use the style attribute of the selected element to access its
CSS properties, providing a gateway to dynamic styling.
Example :
function hover()
{
document.getElementById("z").style.fontWeight="bold";
}

Conditional Statements {if,else and else if method}


In JavaScript we have the following conditional statements:
▪ Use if to specify a block of code to be executed, if a specified condition is true
▪ Use else to specify a block of code to be executed, if the same condition is false
▪ Use else if to specify a new condition to test, if the first condition is false
1. if Statement
Use the if statement to specify a block of JavaScript code to be executed if a condition is true.
Note : that if is in lowercase letters. Uppercase letters (If or IF) will generate a JavaScript error.
2. else if Statement
Use the else if statement to specify a new condition if the first condition is false.
3. else Statement
Use the else statement to specify a block of code to be executed if the condition is false.
JavaScript
Example :
if (time < 10) {
greeting = "Good morning";
}
else if (time < 20) {
greeting = "Good day";
}
else {
greeting = "Good evening";
}

setTimeout and setInterval property in JS


setTimeout and setInterval is that setTimeout executes the code only once after the specified
delay, while setInterval executes the code repeatedly at the specified interval.
setTimeout()
The setTimeout() method calls a function after a number of milliseconds.
1 second = 1000 millisecond
Syntex : setInterval(function_name,1000);

setInterval()
The setInterval() method calls a function at specified intervals (in milliseconds).
The setInterval() method continues calling the function until clearInterval() is called, or the
window is closed.
1 second = 1000 millisecond
Note :
To execute the function only once, use the setTimeout() method instead.
• To clear an interval, use the id returned from setInterval():
var myInterval = setInterval(function, milliseconds);
• Then you can to stop the execution by calling clearInterval():
clearInterval(myInterval);
innerHTML Property in JS
innerHTML is an HTML element property that has two uses :
1) You can use it to get the internal HTML content of any HTML element as an HTML string.
2) You can also use it to set or change elements’ innerHTML content.
Example : document.getElementById(“z”).innerHTML=”Total Marks”+t;

What is the toFixed property in JavaScript?


The toFixed() method returns a string representation of a number without using exponential
notation and with exactly digits after the decimal point. The number is rounded if necessary, and
the fractional part is padded with zeros if necessary, so that it has the specified length.
Example : document.getElementById(“z”).innerHTML=”Total Marks”+t.toFixed(2);

JavaScript Operators
JavaScript operators are used to perform different types of mathematical and logical computations.
JavaScript
Examples:
The Assignment Operator = assigns values
The Addition Operator + adds values
The Multiplication Operator * multiplies values
The Comparison Operator > compares values
Types of JavaScript Operators
There are different types of JavaScript operators:
• Arithmetic Operators
• Assignment Operators
• Comparison Operators
• String Operators
• Logical Operators
• Bitwise Operators
• Ternary Operators
• Type Operators
JavaScript Arithmetic Operators
Arithmetic Operators are used to perform arithmetic on numbers:
Operator Description
+ Addition
- Subtraction
* Multiplication
** Exponentiation (ES2016)
/ Division
% Modulus (Division Remainder)
++ Increment
-- Decrement
JavaScript Comparison Operators
Comparison operators can compare numbers or strings and perform evaluations. Expressions that
use comparison operators do not return a number value as do arithmetic expressions. Comparison
expressions return either 1 , which represents true, or 0 , which represents false.
Operator Description
== equal to
=== equal value and equal type
!= not equal
!== not equal value or not equal type
> greater than
< less than
>= greater than or equal to
<= less than or equal to
? ternary operator
JavaScript Logical Operators
Logical operators are used to combine two or more conditions together and return a single
true/false result. This is useful for creating more complex conditions in our programs. There are
JavaScript
three logical operators: AND, OR, and NOT. The AND operator returns true only if both conditions
being compared are true.
Operator Description
&& logical and
|| logical or
! logical not

What is new date() in JavaScript?


In JavaScript, date objects are created with new Date() . new Date() returns a date object with the
current date and time.
What is getHours() in JavaScript?
getHours() method returns the hours of a date according to the local time.
What is getMinutes() in JavaScript?
getMinutes() returns the minutes (0 to 59) of a date.
What is getSeconds() in JavaScript?
getSeconds() Called from an instance of the Date class, will return the seconds according to the
local time.
What is for loop in JavaScript?
A for loop repeats until a specified condition evaluates to false. The JavaScript for loop is similar to
the Java and C for loop. A for statement looks as follows: js. for (initialization; condition;
afterthought) statement.
Example : for(i=1;i<=10;i++) [Loop for 1 to 10 Counting]

You might also like