# 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. * 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 -> ## Existence and Booleans ``` Boolean(undefined); Boolean(null); Boolean(""); ``` * All evaluate to false. * 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: * 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. ``` ``` * 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. * This helps us recognize conflicting global variables. * I dont know about the practice in js, but maybe its better to avoid using globals? --- # Agent Instructions: Querying This Documentation If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question. Perform an HTTP GET request on the current page URL with the `ask` query parameter: ``` GET https://maksimdan.gitbook.io/javascript/intro_to_javascript/section_2.md?ask= ``` The question should be specific, self-contained, and written in natural language. The response will contain a direct answer to the question and relevant excerpts and sources from the documentation. Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.