(18.99+20.95+7.99)*0.
4.793
Math.round((1899+2095+799)*0.1)/100
4.79
Math.floor(((1899+2095+799)*0.1)/100)
Math.round(((1899+2095+799)*0.1)/100)
alert('hello');
'hello' +3
'hello3'
'$' +20.95+7.99
'$20.957.99'
'$' +(2095+799)/100
'$28.94'
'iteam (' + (1+1) + '): $' + (2095+799)/100
'iteam (2): $28.94'
"I'm learing javascript"
"I'm learing javascript"
'i\'m learning javacsript'
"i'm learning javacsript"
alert(' hello \nman')
popup hello
man
alert('how is he\"mala asked me\" \phe is fine\"I replied\" ')
undefined
`hello`
'hello'
'purpose of backtick'
`interpolation`
'interpolation'
`iteam (${1+1}): $${(2095+799)/100}` No of iteams('+(1+1)+')total cost $'+(5+3)
'iteam (2): $28.94' 'No of iteams(2)total cost $8'
`some `no of iteams(${1+1}) cost $:${5+3}`
text` 'no of iteams(2) cost $:8'
'some \ntext'
"use\'...' by default... if we need interpolation use`...`"
"use'...' by default... if we need interpolation use`...`"
Class 05
1. Variable = a way to save values
2. Re-assign a variable
3. Created the cart Quantity feature
4. Shortcuts for re-assigning and best practices
5. Naming conventions and best practices
6. 3 ways to create a variable: let , const, var
7. Ex 2.42
Variable re assigning shortcuts
+=2 ; variable =variable +2
-=2 ; variable =variable-2
*=2 ; variable =variable*2
/=2 ; variable =variable/2
++ ; variable =variable + 1
--; variable =variable - 1
Naming Conventions
camelCase --- cartQuantity
PascalCase --- CartQuantity
kebab-case --- cart-quantity (not work in JavaScript work in html,css)
snake_case --- cart_Quantity (not work in JavaScript work in other)
'const' cant change this where as 'let' can be chaned
Class 06- BOOLIAN
1. Boolean values (true,false)
2. If-else statement
3. Comparison operation(>,<,=,….)
4. Logical operators
5. Truthy and falsy values
6. Shortcuts for if else statements
Greater than >
Less than <
>=
Equal to ===
Not equal to !==
Rock Paper Scissers
Divide 0 to 1 into three parts (0 to1/3 ; 1/3 to 2/3; 2/3 to 1) and assignee each part for R/P/S
Order of operation
1. BODMAS
2. Comparison
3. Logical operation (AND--&&-- Both are true;
4. OR || any one is true ;
5. NOT ! flip the value)
In if else all elements will be present only inside the curly brackets called ‘scopes’
‘Var’ will not obey scopes
‘Truthy’ value
False – 0 ‘’ NaN undefined null
All other are truthy value
Shortcuts for if-statement
? – ternary operator – replace for if-else
&& - Guard operator - replace if
|| - Default Operator –
! – not
const result = 7 ? 'truthy': 'falsy';
console.log (result)//shortcut fot 'if - else'
6 && console.log('res'); // shortcut for 'if'
const message = 8 &&`hello`
console.log(message)
const currency = 0 || 'USD'
console.log(currency)
Class 07- FUNCTION
Doubts
Function , return?
Function allows to reuse code
Class 08- OBJECTS
1. Objects = group related values together
2. Added a score to rock paper scissors
3. Built-in objects (JSON, localStorage)
4. More details (null, auto-boxing ,references)
5. Shortcuts( destructuring , shorthand property, shorthand method)
inside the object you can put multiple values, it is another type of value
( red – object; blue- values; pink- property)
const product ={
name : 'socks',
price: 1090
};
product.name
1. Let us group multiple values together
2. Let us use multiple values together
Object + function = method [math.random(), console.log()]
BUILD-IN OBJECTS
1. math.random()
2. console.log()
3. JSON (JavaScript Object Notation)
a. Similar to JS object
b. But with less features
c. More universal
4. localStorage
5. 401K
projects in-complete
objects group multiple values to gether
Math.random();
localStorage.setItem('score',JSON.stringify (score));
JSON.parse(localStorage.getItem('score'))
console.log()
Class 09- Document Object Model (DOM)
Lesson learned
1. DOM
2. document.querySelection(…)
3. .innerHTML
4. 3projects using the DOM
5. Onkeydown=””
a. More details about string + window object
Another built in document object
The document object represents/ models the webpage.
document.body.innerHTML = 'hello';
document.title ='good job !';
onclick = click
onkeydown = key press
Onscroll = scrolling
onmouseenter = hovering over
onmouseleave = stop hovering over and many more
window – represent the browser
Projects to be completed
1. Last two
Class 10- Rock-paper-scissers
Lesson learned
1. Review CSS , and added CSS to project
2. classlist
3. finished Rock Paper Scissors
4. Organize JavaScript and CSS code into separate files
