TYPES, VALUES & VARIABLES

How can we classify the values?
What boolean operators does JavaScript support?
Can you explain what "isNaN" function does?
Where is the correct place to insert the JavaScript?
What is the difference between "var a=2" and "a=2"?

5 QUESTIONS from Liana Buiga

1. How can we classify the values?

PRIMITIVES

number - eg: 3, 4, 5
string - eg: "value"/'value'
boolean - eg: true/false
null - eg: the absence of a value
undefined - eg: value not set

COMPOSITES

object - eg: values with properties and methods
array - eg: store multiple values in a single variable
function - eg: block of code designed to perform a particular task

2. What boolean operators does JavaScript support?

Java Script supports AND (&&), OR (||) and NOT (!)

boolean operators.

a && b

&& returns a if it can be converted to FALSE
&& returns b otherwise
with boolean values && returns TRUE if both a and b are TRUE otherwise, FALSE
a=true
b=true
a&&b -> TRUE

a || b

|| returns a if it can be converted to TRUE
|| returns b otherwise
with boolean values || returns TRUE if either a OR b are TRUE, otherwise if both are FALSE, returns FALSE

! returns FALSE if a can be converted to TRUE
otherwise returns TRUE

GOOD TO KNOW:

Expressions that can be converted to FALSE are those that evaluate at

null
0
empty string
undefined

false && true || true // true
false && (true || true) // false

eg:

3.Can you explain what "isNaN" function does?

isNaN() determines if a value is an illegal number (not a numeric value)- NaN or not.

isNaN() returns true if the value is NaN (or cannot be converted to a number), and false if not

WHY DO WE NEED THE isNaN FUNCTION?

We cannot rely on the equality operators (== or ===) to see if a value in NaN or not

BECAUSE

NaN == NaN // false
NaN === NaN // false

NaN values appear when arithmetic operations result in
UNDEFINED / UNREPRESENTABLE

values

eg: 0 % 0 -> results in a NaN

Dividing other numbers to 0 don't result in NaN

If the value being evaluated is null or an empty string, isNaN returns false BECAUSE

both null and empty string evaluate to 0.

The isNaN() function is useful to test whether a value is a NaN because NaN is not equal to any other value, including itself:

THEREFORE

isNaN(NaN);       // true
isNaN(undefined); // true

isNaN(true);      // false
isNaN(null);      // false
isNaN(37);        // false

isNaN("66");      // false: "66" is converted to the number 66 - this is not NaN
isNaN("45.45");   // false: "45.45" is converted to the number 45.45 - this is not NaN
isNaN("");        // false: the empty string is converted to 0 - this is not NaN
isNaN(" ");       // false: a string with spaces is converted to 0 - this is not NaN

eg:

4. Where is the correct place to insert the JavaScript?

The SCRIPT elements can be put in the HEAD of the document OR in the BODY

BUT

When a script is placed in the HEAD of the HTML document, that document instantly slows down and it takes
longer to download.

WHY?

Because of how web pages load

The browser sends a request to the server for the document at the URL.
Once that document arrives at the browser, the browser parses it and starts making additional requests to the server for external components like style sheets, images, and scripts.
The browser downloads these components in parallel - up to two components at one time
Scripts block parallel downloads.
Once a browser starts downloading a script, it won’t download anything else until the script has finished downloading.

BASIC STEPS

Browsers read HTML documents from the top to the bottom, (starting with the doctype and <html> opening tag)

Any scripts that are in the HEAD are going to be some of the first components downloaded.

Until the browser finishes downloading the scripts, nothing else on the page will be downloaded.

PUT YOUR SCRIPTS AT THE BOTTOM

The best location for scripts is AT THE BOTTOM of the HTML document, right before the closing </body> tag.

THIS allows every other external component on the page to download as quickly as possible before the scripts are loaded.

EXCEPTIONS:

scripts that need to run before the document loads or as it loads
scripts with document.write lines that require they be placed higher on the page.

MODERN APPROACH

Browsers support the async and defer attributes on scripts.

they are an alternative to tell the browser it's safe to continue parsing while the scripts are being downloaded.

async

Scripts with the async attribute are executed asynchronously.
The script is executed as soon as it's downloaded, without blocking the browser in the meantime.
It's possible script 2 is downloaded & executed before script 1.

<script type="text/javascript" src="path/to/script1.js" async></script>
<script type="text/javascript" src="path/to/script2.js" async></script>

defer

Scripts with the defer attribute are executed in order (i.e. first script 1, then script 2).

This does not block the browser.

Defer scripts are only executed after the entire document has been loaded.

* 80% of all browsers support this. 88% support it at least partially.

* In some circumstances IE <= 9 may execute deferred scripts out of order.

<script type="text/javascript" src="path/to/script1.js" defer></script>
<script type="text/javascript" src="path/to/script2.js" defer></script>

5. What is the difference between

"var a=2" and "a=2"?

"var" DEFINES THE SCOPE OF THE VARIABLE

One variable is LOCAL

"var a=2"
One variable is GLOBAL

"a=2"

When adding "var" to a variable value assignment, JS ensures that the variable is confined to which function it is assigned to and does not collide with the same name variable within another function.

When we don't use "var" - it is declared as a global function and chances of collision can happen.

+ var

- var

It is ALWAYS advisable to use “var” before

variable value assignment.

TYPES, VALUES & VARIABLES

By mihaelaadln

TYPES, VALUES & VARIABLES

TYPES, VALUES & VARIABLES - 5 Questions from Liana Buiga

TYPES, VALUES & VARIABLES

TYPES, VALUES & VARIABLES

More from mihaelaadln