====== About Javascript ====== Below are some key points to remember in Javascript. Note that Javascript is really most useful when manipulating and making static web pages dynamic. It can make a web page dynamic through access of objects within the page. The various objects can be access via the [[DOM]] (document object model). ===== Tools ===== Use the **Chrome browser** by pressing F12 to allow you to inspect web pages and see the console, and even inject Javascript code. ===== Variables, Constants, and Comments ===== Key word for defining a variable is ''let''. ''let x = 10;'' For constants use ''const''. ''const pie = 3.14;'' Both ''let'' and ''const'' follow code block scoping rules, but if you use ''var'', that is more of a global type of variable definition. It isn't recommended to use ''var''. ====== Data Types ====== ===== Strings ===== ===== Numbers ===== ===== Arrays ===== ===== Null & Undefined ===== Variables can be purposely set to Null such as ''let x = Null;'' But if you just do this: ''let y'' Then you try to do something with'' y'', you will get an error stating ''y'' is ''undefined''. ===== Boolean & Comparisons ===== ==== loose vs. strict comparison ==== The loose comparator ''=='' versus the strict comparator ''==='' is really something to keep your mind on. In general you should use the strict comparator versus the loose since using the loose comparator will have Javascript doing some of its own data conversion before comparing. ==== truethy and falsesy values ==== === Evaluates to true === * 1 * "0" === Evaluates to false === * null * 0 * "" ===== Objects ===== These could be arrays, functions, etc. Functions can be defined one of two ways: * Through an expression or, * Through an actual function definition (i.e. declaration) **expression**: const speak = function(){ console.log ("Hello"); } The arrow function looks like this: const calcArea = radius => { return 3.14*radius**2; } If there are no parameters, it will look like this: const speak= ()=> { console.log("HI"); } **declaration**: function hello() { console.log("hi!"); } Note that function declarations can be done anywhere in the code, but function via expression has to be setup first before it can be use. **callback functions** This is a function that takes a function as a parameter input. For example: const myFunc = (callbackfunc) => { //do something value = 50; callbackfunc(value); } Here's a call to myFunc: const logIt = value => console.log(value); myFunc(logIt); This will post the value 50 into the browser console. ==== Objects in general ==== Objects have properties and methods. Types of objects, aside from functions, are: * object literals ===literals=== example: let user = { name: 'John', age: 25, email: 'jdoe@gmail.com' } When adding methods inside objects, you can do it in one of two ways: - use key and function pair: ''meth1: function() {}'' - just name the function: ''meth1(){}'' <--recommended way **WARNING**: You can't use the arrow notation to define methods because it point the ''this'' to the window object instead of the literal object. ===forEach() Method=== **Important**: You need to remember this, otherwise, you'll lose hair. The ''forEach'' method really is for array types. It doesn't exist for objects, such as DOM object collections. ===== Primitives vs. Reference Variables ===== Primitives are the very building blocks of data types. Reference types are a level higher. The main difference between them when storing values, is that primitives gets stored in the STACK for quick access, while reference values are stored in the HEAP. Only the pointer is stored in the stack, but the actual object values are stored in the heap, thus causing a slower access time.