/*JAVASCRIPT*/
/* <-- internal use of JavaScript for HTML
<script>
js code
</script>
*/
/* <-- external link of Javascript for HTML
<script src="scriptname.js"></script>
*/
/*VARIABLES*/
//Variable values are called Variables.
//javaScript uses the keywords var, let and const to declare variables.
//const Declares a block constant that can't be changed
//Always use const if the value or type should not be changed
//const variables havve a block scope
//let Declares a block variable that can be changed
//Only use let if you can't use const
//let variables have a block scope
//var Declares a variable, used before 2015
//Only use var if you MUST support old browsers.
//var variables always have global scope
/*
<p id="idName"></p> <-- declare id for an HTML element
<script> <-- javascript in HTML document goes in script element
let variableName = "variableValue"; <-- declare variable
document.getElementById("idName").innerHTML = variableName; <-- output
the value in HTML element
</script>
*/
/*FUNCTIONS*/
//function Declares a function
//return Exits a function
//Function parameters are listed inside the parentheses () in the function
definition.
//Function arguments are the values received/returned by the function when it
is invoked.
//Function names are used/called like variables
/*
function funcName(parameterName) {
return parameterName
}
*/
/*OBJECTS*/
//const objectName = {propertyName:propertyValue, propertyName:propertyValue};
<-- create object and it's properties
//objectName.propertyName to Access object property
//this.propertyName to Access the property of a local object
//"this" Refers to an object, like "self" in pyhton
//methods like call(), apply(), and bind() can refer "this" to any object.
/*EVENTS*/
// <elementName eventName="JavaScriptCode"> <-- syntax for HTML elements and
events
// <button onclick="displayDate()">The time is?</button> <-- example of element
and event
//onchange An HTML element has been changed
//onclick The user clicks an HTML element
//onmouseover The user moves the mouse over an HTML element
//onmouseout The user moves the mouse away from an HTML element
//onkeydown The user pushes a keyboard key
//onload The browser has finished loading the page
/*STRING SYNTAX*/
// "this is a string"
// 'this is a string
// `this is a string`
// \' ' Single quote
// \" " Double quote
// \\ \ Backslash
// \b Backspace
// \f Form Feed
// \n New Line
// \r Carriage Return
// \t Horizontal Tabulator
// \v Vertical Tabulator
/*ARRAYS*/
//const arrayName = [propertyName:propertyValue,
propertyName:propertyValue]; <-- array has square brackets
// arrayName[#] Used to get the value through the index number
// an array is a type of object
//const objectName = {propertyName:propertyValue,
propertyName:propertyValue}; <-- object has curly brackets
// objectName.propertyName Used to get the value through the property name
// const arrayName = new Array(); <-- way 1 to create a new array
//const arrayName = []; <-- way 2 to create a new array
/*DATES*/
//const varibaleName = new Date()
//new Date()
//new Date(date string)
//new Date(year,month)
//new Date(year,month,day)
//new Date(year,month,day,hours)
//new Date(year,month,day,hours,minutes)
//new Date(year,month,day,hours,minutes,seconds)
//new Date(year,month,day,hours,minutes,seconds,ms)
//new Date(milliseconds)
//ISO dates can be written with added hours, minutes, and seconds (YYYY-MM-
DDTHH:MM:SSZ):
// the T seperates day and time, the Z defines UTC time
//getFullYear() Get year as a four digit number (yyyy)
//getMonth() Get month as a number (0-11)
//getDate() Get day as a number (1-31)
//getDay() Get weekday as a number (0-6)
//getHours() Get hour (0-23)
//getMinutes() Get minute (0-59)
//getSeconds() Get second (0-59)
//getMilliseconds() Get millisecond (0-999)
//getTime() Get time (milliseconds since January 1, 1970)
/*IF/ELSE STATEMENTS*/
//if (condition) {
// block of code to be executed if the condition is true}
// else {
// block of code to be executed if the condition is false}
/*CLASSES*/
// A JavaScript class is not an object. It is a template for JavaScript
objects.
/* <-- create a class with "class" keyword and "constructor" method
class className {
constructor(property1, property2) {
this.property1 = property1;
this.property2 = property1;
} }
*/
/* <-- create an object using a class
const objectName = new className(property1, property2);
*/
/* <-- add methods when creating a class
class ClassName {
constructor() { ... }
method_1() { ... }
method_2() { ... }
method_3() { ... }
}
*/
/*JSON*/
//JSON stands for JavaScript Object Notation
//Data is in name/value pairs ex. "name":value
//Data is separated by commas ex. "name":value, "name":value
//Curly braces hold objects ex. "objectName" {"name":value, "name":value}
//Square brackets hold arrays ex. {"objectName" : [{"name":value,
"name":value}, {"name":value, "name":value}] }
/*DEBUG*/
// press F12 key in browser to activate debugging
// select Console in debugger menu to open console view
// use console.log() to display JavaScript values in the debugger window
// The log() method writes (logs) a message to the console and it useful
for testing
// console.log(message); <-- basic log method syntax
/* <-- example of using log method to write an object to the console
const objectName = {"field":value};
console.log(objectName);
*/
