heading.append(addTitle("Learning the JavaScript Language"));
heading.append(addParagraph("Joe Chellman - LinkedIn Learning - May 2023"));
heading.append(addParagraph("Variables and Types"));
main.append(addHeader("Strings"));
main.append(addParagraph("In JavaScript, you can write a string that spans several lines by putting a backslash and a return at the end of each intermediate line – eg"));
main.append(addInsetCodeListing(["\"This is \\","my favourite\\","string ever\";"]));
main.append(addParagraph("Note – the return character must be the only thing after the backslash!"));
main.append(addHeader("String Properties and Variables"));
main.append(addParagraph("Strings in JavaScript have a number of properties and methods you can make use of. For example"));
main.append(addSyntax("myString.length"));
main.append(addParagraph("returns the length of the string and"));
main.append(addParagraph("We can build a string using something called a template literal. The string goes inside back ticks rather than single or double quotes so you can include both, for example"));
main.append(addSyntax("let declaration = `This I say to you: \"Good morning!\". Huzzah!`;"));
main.append(addParagraph("Another thing you can do with a string template is to include variables. For instance, let's say you already have a string referenced by myString with the contents, \"Good morning!\". We could do this instead."));
main.append(addSyntax("let declaration = `This I say to you: ${myString}. Huzzah!`;"));
main.append(addParagraph("In either case, the result will be the same so if you output the string, you will see"));
main.append(addSyntax("This I say to you: \"Good morning!\". Huzzah!"));
main.append(addParagraph("Obviously, the advantage of using a string template is that you may not know in advance what the value of myString will be. For example, let's say we ask the user to type in their name and we assign whatever they input to myString. We could then use the string template"));
main.append(addSyntax("let declaration = `This I say to you: \"Good morning, ${myString}!\". Huzzah!`;"));
main.append(addParagraph("which will incorporate the users name into the output string!"));
main.append(addParagraph("Of course, there are a lot more methods you can use with strings and you can check out the MDN Web Docs page for string for more information - https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String."));
main.append(addHeader("Numbers"));
main.append(addParagraph("JavaScript doesn't really have number types, ie no int or float type, it just classifies any numerical value as a number. As with strings, there are also methods you can use with numbers and you can get more info in the MDN Web Docs at https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Number"));
main.append(addParagraph("In JavaScript infinity is a number written as Infinity which is essentially just a very big number and you can also have negative infinity which you would write as -Infinity."));
main.append(addParagraph("If you have a situation where JS expects a number but gets something else, it may throw up an error and tell you your variable is NaN (not a number)."));
main.append(addParagraph("JS also has a Math object (note – that these are keywords in JS – that is, Infinity, NaN or Math so they are case-sensitive) which gives you access to a lot of mathematical functions – more info at https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Math."));
main.append(addParagraph("You can use these functions by passing a method to the Math object along with a number (in most cases). For example"));
main.append(addParagraph("An example of a function that doesn't take a number (or at least doesn't have to) is"));
main.append(addSyntax("Math.random()"));
main.append(addParagraph("Which will return a floating point number between 1 and 10."));
main.append(addParagraph("You may find that your IDE will provide you with a list of functions for something that has them and you can do this in Console in your browser's web developer tools as well. For example, if you type a number like 12 or the Math object in the console and press dot you will see a list of the functions you can use. See below."));
main.append(addImageWithCaption("./images/number_functions.png","A list of the functions you can use with a number."));