> For the complete documentation index, see [llms.txt](https://maksimdan.gitbook.io/javascript/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://maksimdan.gitbook.io/javascript/intro_to_javascript/section_2.md).

# Section 2 - Execution Contexts and Lexical Environements

## Dynamic Typing

* Variables are figured out on the fly. Its like the auto keyword in C++.
* This is possible:

```
var a = 'string';
a = 1;
a = true;
```

## Primitive Types

* Variables that hold a single type of value.
* E.g.
  * undefined - initializes variables
  * null - similiar to undefined, but is intended for the user to use.
  * boolean
  * number - floating type
  * string
  * symbol - used in es6

## Operators

* Basic operators like + are infixed functions, meaning they act exactly like functions, for example:

  ```
    var a = 1 + 2;
    console.log(a); // prints 3

    //what is happening:
    function +(a,b) {
        console.log( a + b );
    }

    // calling this function:

    +(1,2);

    //and infix notation means the operator is placed inbetween 1 and 2.
    1 + 2;
  ```
* also includes other primative type operators like > , - , \*, etc. These are essentially functions.

## Operator Precedence and Associativity

* Operaters like + , \* , = , << , etc are have a unique priority for their evaluation.&#x20;
* A full list reference can be found here:
*

## Coersion

* * can also work as a concatenation.

    ```
     var a= 1 + '2' // prints 12
    ```
* 1 was coersed into a string. So the engine concantenated 1 and 2, and evaulated them into a string before.
* This was done for us - so their there is a certain precedence that does this for us. It 'does it best' to understand what it should be.

## Comparison Operators

```
console.log( 1 < 2 < 3); // returns true as expected
console.log( 3 < 2 < 1); // returns true???
```

* Precedence and coersion. (3 < 2) evaluates to false.
* Then false < 1 gets coersed.
  * false try's to evaluate itself as some number
* Javscript has a nice handy built in function for this.

  ```
    //browser console
    Number(false) // returns 0;

    //for fun
    Number('3') // returns the numeric type 3
  ```
* false and true respectively evaluate to 0 and 1, as expected.
* and finally, 0 < 1 evaluates to false. These are how the sequence of operations evaluate from the javascript perspective.

```
Number(undefined) // NaN
Number(null) // 0
```

* NaN = not a number
* There are also special circumstances for these special kind of operations and when they coerse, or not. For example,

```
null < 4 // true null gets coersed to 0
null == 0 // false ?! <-- ex of a special circumstance
"" == 0 // true... ok
false == "" // true as well
```

* This can get pretty strange, so how to we solve this?
* \===

```
3 === 3 // true
3 === '3' // false
0 === false // false
3.0 === 3 // true
'a' === "a" // true
```

* why this is awesome -> values are not coerced. So its a great way for us to actually test for values are what we s
* trictly want them to identify with. Pretty cool.
* Different type will always evaluate to false
* But this doesnt mean coersion is not helpful. There are circumstances where dont want to use strict operations.
* Sameness operations link ->&#x20;

## Existence and Booleans

```
Boolean(undefined);
Boolean(null);
Boolean("");
```

* All evaluate to false.&#x20;
* How this can work to our advantage

```
var a;

if (a || a === 0) {
    console.log('something is here');
}
```

* During the first memory allocation phase of the program, 'a' is undefined. Within the if statement, a is coerced into a boolean automatically. And because we know understand that undefined evaluates to false, we can use this method 'check' for nondefinitions.
* a === 0 is added for a special case, where a = 0 - which is an explicit case.

## Default values

```
 function greet(name) {
    console.log('hello ' + name);
 }

 greet() // hello undefined
```

* First thing to notice is that greet() can be called without a parameter.
* Name is recognized as a variable, but is initiallize as undefined. Thats why this works.
* undefined is also coerced into a string before it becomes conncatinated.
* This is not good behavior. How can we fix this with a default value?
  * 'hello \[student name]

```
 function greet(name) {
    name = name || [your name here];
    console.log('hello ' + name);
 }

 greet() // hello undefined
```

* What this does:&#x20;
* This is a neat little trick to set default values.
* || will evaluate to a variable that can be coerced to true.

```
//console
undefined || 'hello' // hello -> because Boolean('hello') evaluates to true.
'hi' || 'hello' //hi, because hi is evaluate left to right
```

* Evaluates the first value that coerces to true.

## Collisions

* Suppose we have 3 js files.

  ```
    <!doctype html>
    <html class="no-js" lang="">
        <head>

        </head>

        <body>

        <script src="scratchpad1.js"></script>
        <script src="scratchpad2.js"></script>

        </body>
    </html>
  ```
* What happens when we have colliding variables?

```
    //js1
    var a = 1;

    //js2
    var a = 2;


    //console
    console.log(a); // prints 2
```

* The scratchpad3 overwrote var a, since it was read before 1 and 2
* To fix this we can do something like before:

```
    //js 2

    window.a = window.a || 2;

    //console
    console.log(a) // prints 1
```

* Why this works. Because a has been define before as a global variable, previously it does not become coerced.&#x20;
* This helps us recognize conflicting global variables.
* I dont know about the practice in js, but maybe its better to avoid using globals?