One of my resolutions for 2021 is to deepen my knowledge in JS. That's why I started a complete new training in JS. From completely zero to intermediate.
An essential point to remember a training course is to take notes and discuss the subject with others. That's why every day I will post on dev.to the concepts and notes that I learned the day before.
If you want to miss nothing click follow and you are welcome to comments and discuss with me.
Without further ado here is a summary of my notes for day 2.
How to run JS code?
JS code can be run in the browser within a script tag
<script> let number = 10 console.log(number) </script> The script tag can be place in the header or body section of the html page.
If the tag is place in the header, the JS code will be execute before the page is display. This can slow down the speed of initial page display (and frustrate some users).
If the script tag is at the end of the body section, the JS will be execute after most of the page is loaded.
<body> ... ... <script> let number = 10 console.log(number) </script> <body> So depending on how you want your page to behaviour choose wisely.
JS code can also be place in external file. In that case you can reference your code like this
<script src="main.js"> </script> You can also use the defer attribute
<script src="demo_defer.js" defer></script> The script will be downloaded in parallel to parsing the page, and executed after the page has finished parsing
Naming conventions
// camelCase let firstName = 'Mike' const displayProduct() // Use self descriptive naming const max1 = 6 // not good const maxAllowUsers = 6 // good :-) Comments in JS code
// one line comment /* Multi lines comments Can go on more than one line */ Data type
In JS everything is ether object or primitive
There is 7 primitives data type : string, number, boolean, undefined, null, symbol and bigint
JS has dynamic typing. We do not have to manually define the data type. Data type are determined automatically
let name = 'Mike' // string let age = 45 // number const pi = 3.1415 // number let isActive = true // boolean (true or false) let job // undefined let person = { // Object firstName: 'Mike', age: 30 } // To get the variable type use Typeof operator console.log(typeof firstName) // return string // Type coercion (type converted automatically) console.log(firstName + ' ' + age) // convert age to text automatically // Be aware, string will remain string let year = '2020' console.log(year + 1) // 20201 // Convert to number year = Number(year) console.log(year + 1) // 2021 console.log(Number('Mike')) // NaN // Convert number to string console.log(String(300)) // '300' Variables declaration
// Use let keyword for variables that can be change let userName = 'Mike' // Use const keyword for variables that never change const PI = 3.1415 Basic operators
// Basic math operator // = + - * / let sum = 5 + 7 let result = 5 + (10 / 2) // Assignment operators num = num + 10 num += 10 // same as num = num + 10 num++ // num = num + 1 num-- // x = x - 1 // Comparaison operators // > < >= <= console.log(num > result) console.log(result <= num) String concat
const firstName = 'Mike' const LastName = 'Taylor' console.log(firstName + ' ' + lastName) // or use string template literal console.log(`${firstName} ${lastName}`) // Mike Taylor // Use template string to make multi-lines string console.log(`This string is a multi line string`) Conclusion
That's it for day 2. Tomorrow we will look at if else statements and more... Stay Tune!
Top comments (1)
This is helpful to me as a beginner