This is Ricardo Barros Becheli's notebook with exercices and remarks about the JavaScript course from "Curso em Vídeo".
Hello world accomplished and so was the first lesson but I decided to pause
this JavaScript course while I'm doing two HTML/CSS courses (Curso em Vídeo and Rocketseat). JavaScript will be re-started later.
Today I decided to come back to JS because I'm almost reaching the "main 20%" knowledge of CSS and the conbined date to deploy the first JS code in my HTML/CSS/JS Github repo website project is near.
Well, I found this way of making "post-it" remarks in CSS. Cool!
All this frame's content was taken from the JS code.
Where is the JS code?
The JS code can be placed:
In the head area, inside a <script> tag (less usual);
Directly at the end of the HTML <body>, inside a <script> tag;
Linked to a separate file at the end of the HTML <body>, inside a <script> tag; (see the figure below)
Why comments?
Comments are useful for:
Helping people (including you, in the - near - future) to understand why something was done in the code;
Testing the code, by making that snippet "on - off" *
* Yes, because when you "comment", that snippet stops running. It stops being part of the valid code.
Double slash // means "ONE LINE COMMENT" in any Javascript code.
This here is a transcript from the JavaScript code wherever it is, be it in the end of the HTML "body" or in the resperctive separate ".js" file. Just to show you how it works.
And /* to open and */ to close mean "SEVERAL LINES COMMENT" (just like in CSS).
Comments are useful to explain parts of the code for either yourself in the future or some other person that has to check the code for any reason.
// window.alert("Click OK to continue"). I have taken this command out of use (BY USING COMMENT). Only lesson 1 used it and it was tyring to face that every page refresh.
// window.confirm("How do you like JS?"). I have taken this command out of use (BY USING COMMENT). Only lesson 1 used it and it was tyring to face that every page refresh.
The same goes to the below "one line comments":
var nome = window.prompt("What's your name?")
window.alert("It's a great pleasure to meet you, " + nome + "!")
// The + (plus) signal produces concatenation.
var n1 = Number.parseInt(window.prompt("Digite um número: ")) //
See "several lines comment" below
var n2 = Number.parseInt(window.prompt("Digite outro número: "))
var s = n1 + n2
window.alert("A soma dos valores é " + s)
Several lines comment
/* Must put:
Number.parseInt
For JS stop concatenating the 2 numbers instead of summing them.
(i.e. returning 42 instead of 6 for "4 + 2" is concatenating)
This command returns an integer number (= no decimals)
Or...
For floating point (floating point = real number = a number with decimals) it should be:
Number.parseFloat.
Note the capital letters because they make a difference!
EVEN BETTER:
You can also force JS stop concatenating instead of summing by the following command:
var n1 = Number(window... etc... as coded above - or whatever you want to be contained in your variable and fits here)
And JavaScript will decide if "Number" is an integer or a real number.
*/
Grip the code!
Variables
So it's widely sayd that "variables are containers for storing values" (w3schools).
Therefore
Aren't variables tiny databanks?
To be or not? The question is that.
And the informal answer given by myself (at least at this point of study) is YES!
Think about that when you go into real data bases, banks or lakes.
The data is calmly laying there.
Until one fine day when you invoke them and they rise from the tomb...
More transformations
The JS commands:
String(n)
Or
n.toString()
Make whatever is "n" into a string.
Thus, the code to return the result of the given numbers as a string would be:
window.alert("A soma dos valores é " + String(s))
Or...
window.alert("A soma dos valores é " + n.toString(s)
The "s" above is the variable that contais the sum. Check the frame above or the code itself.
So, depending on what you code...
A "string" + a "string" JS uses the plus sign to CONCATENATE.
And
A "number" + a "number" JS uses the plus sign to SUM.
Some exercices in the terminal.
Concatenation and sum. (= quoted text x unquoted numbers)
Another way of making the same concatenation of text and variables is through
Template literals (Template strings)
Synonyms:
Template Literals
Template Strings
String Templates
Back-Tics Syntax
Template strings will be used in this course to interpolate. JavaScript string interpolation is the process of embedding an expression into part of a string. Plain text and JS variables together in the same paragraph, for instance.