| title | description | created | updated |
|---|---|---|---|
Javascript-Cheatsheet |
beginner friendly javascript tips |
2022-10-17 |
2022-10-0 |
A programming Language which performs logic operation and calculation similar to other language but different because of following reasons:-
A tree like structure of html which can be manipulated through javascript
Add Script Tag in body of the HTML document
Javascript programs run in the console section of the website
console.log("hello world")
Temporary memorary location to store data
To create a variable in JavaScript, use the let keyword.
SYNTAX : let variableName;
It doesn't need any datatype to define a variable name that's why It is called Loosely typed language.
A variavle whose value can't be changed.
let num = 123;
let num = "user";
let num = 10n;
let num; console.log(num) //undefined
let num = null; It’s just a special value which represents “nothing”, “empty” or “value unknown
let num = True;
The purpose of symbols is to create unique property keys that are guaranteed not to clash with keys from other code
A++ : Postfix increment operator-
A-- : Postfix decrement operator.
++A : Prefix increment operator.
--A : Prefix decrement operator.
< : Less than operator.
> : Greater than operator.
<= : Less than or equal operator.
>= : Greater than or equal operator.
== : Equality operator.
!= : Inequality operator.
=== : Strict equality operator.
!== : Strict inequality operator.
&& : Logicl AND.
**|| :**Logical OR.
? : - condition ? expressionIfTrue : expressionIfFalse
An entry control loop , it checks condition at entry time
SYNTAX : while(condition)
An exit control loop , it checks condition at exit time
SYNTAX : do { statements } while(condition)
if to specify a block of code to be executed, if a specified condition is true else to specify a block of code to be executed, if the same condition is false else if to specify a new condition to test, if the first condition is false
SYNTAX : if (condition) statement1 else statement2
Switch statements is used to select one of many code blocks to be executed.
SYNTAX : switch(expression) { case x: // code block break; case y: // code block break; default: // code block }
Switch is used for changing values and if...else is used for range of values
For statement creates a loop with 3 optional expressions: SYNTAX : for (expression 1; expression 2; expression 3) { // code block to be executed } Expression 1 is executed (one time) before the execution of the code block.
Expression 2 defines the condition for executing the code block.
Expression 3 is executed (every time) after the code block has been executed.
A set of instructions or a block of code that performs the task. It leads to reusability of code and provide structure to code Anything inside the function will only be executed when it is called.
SYNTAX : function functionName();
- Alert : This one we’ve seen already. It shows a message and waits for the user to press “OK”.
SYNTAX : alert("Hello");
- Prompt : The function prompt accepts two arguments:
SYNTAX : result = prompt(title, [default]);
- Confirm The function confirm shows a modal window with a question and two buttons: OK and Cancel. The result is true if OK is pressed and false otherwise
SYNTAX : result = confirm(question);
- Collection of elements of same type.
- Store multiple values at one place.
SYNTAX : let variablenme = ["","",""];
To Access Arrays: variableName[indexNumber];
DOM stands for Document Object Model. It is a programming interface that allows us to create, change, or remove elements from a website document. DOM manipulation is when you use JavaScript to add, remove, and modify elements of a website
Intraction with the webpage by clicking on the webpage or moving the cursor.And after interaction the change happen is called Events
By which we perform these events or interactions like buttons or any key structure they are called ***Event Handlers***
And behind all these event handler the code written for that event and event handlers are called ***Event Listeners***
To access the elements on the webpage or in the HTML codes we use Document
If an element has the id attribute, we can get the element using this method and change its properties
If an element has the class attribute, we can get the element using this method and change its properties
If an element is in the tag, we can get the element using this method and change its properties
To select a first element of the CSS selector
All elements inside element matching the given CSS selector are selected.
To make changes inside the HTML code
To change backgroundcolor
To change Textcolor
To change width
and so on... we can change the styling
method sets a new value to an attribute
To change the link
To change the image
To change Input(of html code input) type
To change the value of placeholder
mousedown/mouseup : Mouse button is clicked/released over an element.
mouseover/mouseout : Mouse pointer comes over/out from an element.
mousemove : Every mouse move over an element triggers that event.
onclick : Triggers after mousedown and then mouseup over the same element if the left mouse button was used.
dblclick : Triggers after two clicks on the same element within a short timeframe. Rarely used nowadays.