Javascript Javascript basics for Beginners (Vickler, Andy [Vickler, Andy]) (Z-Library)

JavaScript Programming JavaScript Basics for Beginners

Table of Contents Introduction Chapter One: An Introduction to JavaScript The Developer of JavaScript The Use Cases of JavaScript The <script> Tag Display Values Numbers Arithmetic Strings JavaScript Arrays Chapter Two: JavaScript Variables JavaScript Identifiers Datatypes Declaration of Variables The Undefined Variables Re-Declaration Arithmetic JavaScript String Concatenation JavaScript Let Keyword Chapter Three: JavaScript Constants Block Scope Primitive Values JavaScript Constants Chapter Four: Prompts and Conditionals The JavaScript if Statement

The else Statement The else if Statement JavaScript Switch Statement Chapter Five: JavaScript Strings and Arrays The lastIndexOf() Method What If the Index Is Not Found? The search() Method JavaScript Arrays JavaScript Array concat() Array Sorting Reverse Gear Sorting Numeric Compare Function Random Sorting Array Values Object Array Sorting JavaScript Iteration Chapter Six: JavaScript Loops The for/in Loop The forEach() Loop The for/of Loop Eternal Loops JavaScript while Loops The do/while Loop JavaScript Break and Continue Statements Chapter Seven: JavaScript Functions The Invocation of Function

The () Operator Functions as Variables Local Variables JavaScript Expressions The constructor() Self-Invoking Functions or Objects The toString() Method Arrow Functions Parameters & Arguments Invocation Global Objects Reusing Methods Chapter Eight: JavaScript Objects The new Keyword Object Properties The Deletion Dates JavaScript Classes Passing Parameters Class Inheritance Conclusion References

© Copyright 2021 - All rights reserved. The contents of this book may not be reproduced, duplicated or transmitted without direct written permission from the author. Under no circumstances will any legal responsibility or blame be held against the publisher for any reparation, damages, or monetary loss due to the information herein, either directly or indirectly. Legal Notice: This book is copyright protected. This is only for personal use. You cannot amend, distribute, sell, use, quote or paraphrase any part or the content within this book without the consent of the author. Disclaimer Notice: Please note the information contained within this document is for educational and entertainment purposes only. Every attempt has been made to provide accurate, up to date and reliable complete information. No warranties of any kind are expressed or implied. Readers acknowledge that the author is not engaging in the rendering of legal, financial, medical or professional advice. The content of this book has been derived from various sources. Please consult a licensed professional before attempting any techniques outlined in this book. By reading this document, the reader agrees that under no circumstances is the author responsible for any losses, direct or indirect, which are incurred as a result of the use of information contained within this document, including, but not limited to, —errors, omissions, or inaccuracies.

Introduction This book contains proven steps and strategies on how to code in JavaScript. I have included in the book step-by-step programming techniques in JavaScript so that you can learn them properly. JavaScript is a scripted language. You will see a lot of script embedded in HTML tags. As JavaScript cannot work alone, I deemed it fit to embed it in HTML so that when you want to run it, it works well in web browsers. If you want to practice what you have learned, you can open up a code editor, copy the code, and paste it in to check out the results. Also, you can simply load up the page to the web browser to see the results directly on the web page. Embedded scripts are in ready-to- work form. The best method to learn the scripts by heart and then edit them to customize them so that you can learn faster and in a fun way. Whether you are making websites or are a student who aspires to become a web developer, or are planning to build a website for your own business, this book is the best literature you may come across on the market. Once you have gone through the first couple of chapters, you will be in the right mindset to move on and learn the complex topics. The best method is to go slow at first and pace yourself as the concepts become clearer.

Chapter One: An Introduction to JavaScript JavaScript is an interpreted language. The definition of the language is broader than the word interpreted. You can define it as a procedural language that is weakly typed, based on prototypes, and is dynamic and imperative. JavaScript is developed and implemented in the form of a client-side programming language. It is a part of the web browser and is seen as something that can facilitate developers for the implementation of dynamic features and creation and integration of user interface on the web pages. You may find some implementation of JavaScript on the server-side as well. However, the popularity of the JavaScript programming language is largely based on its applications on the client-side. You may see applications of JavaScript outside of web applications as well. For example, you may find them being used as a way to add some interactivity to the desktop widgets and to documents in PDF format. JavaScript was initially designed in the same mold as the C language was designed, but it also takes some Java programming language names. You should not mistake Java for JavaScript because the two are inherently different. They have different purposes and semantics as well. The Developer of JavaScript Brendan Each developed JavaScript initially with the name Mocha. The name was changed later on to LiveScript. Late on, it was changed again to JavaScript. The name confused some people, and it gave the impression that the new language, namely JavaScript, was an offshoot of Java. People thought that the new programing language was part of Netscape's marketing strategy to gain the much-needed prestige in the world of new programming languages. The next year, Microsoft introduced a similar client-side language integrated into their famous Internet Explorer 3.0 browser. It named the language JScript to get away with brand problems. The term as it sounds and looks was perceived as so much similar to JavaScript; however, where it differed was that it could not be made 100% compatible with the specifications of ECMA.

In 1997, a proposal popped up to submit JavaScript to ECMA standards, and in June 1997, ECMA standards adopted it with the nametag ECMAScript. The programming language also won the ISO standard recommendation. JavaScript amassed high-rated popularity because of the way it adapted to the internet. That is the reason it became one of the most used programming languages across the planet. The Use Cases of JavaScript JavaScript is at work at the client-side of most of the webpages around the world. When you open a webpage, and it had changed from when you previously opened it, well, those changes could have been made using JavaScript. Let me tell you something interesting. Open a web page on your computer screen. Right-click on the web page and then click on View Source. You will see the word JavaScript inside the code of the page. Do not confuse HTML with JavaScript because you may find the two in the code of the page. HTML is a markup language that allows developers to format the content and create a dynamic web page. You can turn the text into bold, create the boxes and tables of your choice, and add buttons and bullets to the page. However, JavaScript lets you alter the text, add pop-up messages, and validate the text you have entered through HTML coding. HTML and JavaScript walk side by side. Where JavaScript moves ahead of HTML is the way it makes the page dynamic and interactive. It will allow your users to click on certain elements and open new pages from the existing page. You should learn JavaScript because it is very easy to implement. All you need is to put the code in an HTML document and then instruct the browser to run it. JavaScript works on many computers and operating systems, even when the systems are offline. With JavaScript's help, you can create responsive interfaces that refine user experience and offers extremely dynamic functionality. JavaScript allows users to load up content in the form of a document whenever the user needs it, and that too without putting the web page into a reload. We call the process Ajax. JavaScript allows you to run a test for existing possibilities in the browser and then react

accordingly. The process is known as defensive Scripting. JavaScript will fix any problems that emerge on your web pages. It will cover up the holes that exist in the browser support. When we compare all that JavaScript can do for us with other programming languages for the web, we realize that it can do so much more. JavaScript is highly demanded and loved because it allows you to build complex applications without any hassle. You can build complex applications with Flash as well, but JavaScript is the best way to go because it is a web standard. When it comes to the uses of JavaScript, the uses keep on changing. At first, JavaScript's interaction with a website was constricted to forming interaction and giving users feedback. However, it evolved with time, and now the uses are much more than how it started. The use cases of JavaScript are changing with the change of times. Users need to change the tried, tested, and boring web interface of clicking on links, filling out information on a web page, and sending off a bunch of forms. They look at making the same processes more modern and user-friendly. JavaScript has enabled users to create a sign-up form that has the capacity to check if a username is already taken or is available. This prevents users from enduring page reload that can somewhat be highly frustrating. A search box shows you the more relevant and suggested results when you type something. It shows something that is based on your entries. The pattern is known as autocomplete - without JavaScript, that would not have been possible. The information that needs to change after set times without any input from the user is possible with the help of JavaScript. JavaScript may attempt to fix layout issues. By using JavaScript, you may find the exact area and position of any element on your web page. You can calculate the dimensions of the window of your browser. By collecting and using this information, you may help prevent the overlap of elements and other related issues. Let us suppose you have a menu for different levels. You can prevent the overlap of the menu items and scroll-bars by checking out the space for the sub-

menu. Perhaps the best way by which JavaScript can help you is to enhance the interface that HTML gives you. Code is labeled as the text that forms programs. In many chapters of the books, you will find a lot of code. Reading and writing code, I must say, is an integral part of the process to learn and write programs. Metaprogramming is considered a powerful technique that can enable you to write a set of programs. The advent of ES6 has further eased off the utilization of metaprogramming in the world of JavaScript programming. You can use proxies and other similar features. The proxies of ES6 tend to facilitate the redefinition of different operations in objects. The <script> Tag Let us talk about the symbol that is the most used tag in the book. All the JavaScript code is enclosed inside the <script> tags. <!DOCTYPE html> <html> <body> <p>JavaScript rests in the Body</p> <p id="demo12"></p> <script> document.getElementById("demo12").innerHTML = "This is your First JavaScript"; </script> </body> </html>

JavaScript Rests in the Body This is your First JavaScript The older type of JavaScript was written differently. It had the following format such as <script type = “text/javascript”>. There are functions in JavaScript that you can use to execute blocks of code. You may call a function when some kind of event occurs. An event can be defined as a click button. You can place any kind of script in an HTML document. You can place the scripts either in the <head> or in the <body> or in both of them. The example of using a script in the head is as under: <!DOCTYPE html> <html> <head> <script> function FunctionUN() { document.getElementById("demo34").innerHTML = "I have changed the Paragraph."; } </script> </head> <body> <p>You have seen the JavaScript in the Head</p> <p id="demo">This is a Paragraph.</p> <button type="button" onclick="FunctionUN()">Click Me</button> </body> </html>

You have seen the JavaScript in the Head This is a Paragraph. Click Me When you click the button on the web browser, you will trigger an invocation of the function. You also can put the script inside the <body> of the HTML page. You will invoke this function when you click the button. <!DOCTYPE html> <html> <body> <p>This is A Web Page</p> <p id="demo1">This is a Paragraph</p> <button type="button" onclick="FunctionZ()">Click Me</button> <script> function FunctionZ() { document.getElementById("demo1").innerHTML = "I have changed the Paragraph."; } </script> </body> </html> This is A Web Page I have changed the Paragraph. Click Me

Display There are different methods to display JavaScript in web browsers. Programmers use different techniques for display purposes. The first method that I have used in the book is the document.getElementById(id) method. In the phrase, id refers to the element that defines the HTML document. The word innerHTML defines the content of HTML. <!DOCTYPE html> <html> <body> <p>This is going to be my First Web Page</p> <p>This will be the First Paragraph.</p> <p id="demo1234"></p> <script> document.getElementById("demo1234").innerHTML = 4567 + 36; </script> </body> </html> This is going to be my First Web Page This will be the First Paragraph. 4603 The second method that you can use is the document.write() method. This also is a simple one. However, I have not created any script in the book by using this method except for this example to show you how it works:

<!DOCTYPE html> <html> <body> <p>This is going to be my First Web Page</p> <p>This will be the First Paragraph.</p> <p id="demo1234"></p> <script> document.write (4567 + 36); </script> </body> </html> This is going to be my First Web Page This will be the First Paragraph. 4603 If you use this method after loading the HTML page, you will lose all data because it will be deleted. Therefore, you should beware of the consequences if you make this mistake. Also, you can create a button with this method and test the HTML page. See the following example. <!DOCTYPE html> <html> <body> <p>This is going to be my First Web Page</p> <p>This will be the First Paragraph.</p>

<button type="button" onclick="document.write(335 + 6)">Click me</button> </body> </html> This is going to be my First Web Page This will be the First Paragraph. Click me Another method is the window alert method. <!DOCTYPE html> <html> <body> <p>This is going to be my First Web Page</p> <p>This will be the First Paragraph.</p> <p id="demo1234"></p> <script> window.alert (4567 + 36); </script> </body> </html> This is going to be my First Web Page This will be the First Paragraph.

The above-mentioned text will be seen on the browser. Each time you run the code, you will see the result of the mathematical calculation on an alert window on the top of the screen. The use of the window keyword is optional. As the window object in JavaScript is global, you may drop its use and still get the same result. The following code will deliver the same result. <!DOCTYPE html> <html> <body> <p>This is going to be my First Web Page</p> <p>This will be the First Paragraph.</p> <p id="demo1234"></p> <script> alert (4567 + 36); </script> </body> </html> Another method is the console.log() method. This method is used for debugging the code and then displaying the data. <!DOCTYPE html> <html> <body> <p>This is going to be my First Web Page</p> <p>This will be the First Paragraph.</p> <p id="demo1234"></p>

<script> console.log (4567 + 36); </script> </body> </html> Values In the world of computers, you will only see one thing that is data. You can read through the data, modify the data, and create new data. All this data is stored in the form of sequences that are fundamentally alike. Bits are two-valued things that are usually described as ones and zeros. If you rip open a computer, you will see that data takes multiple forms like low and high charge, weak or strong signal, or dull and shiny spots on a CD. A piece of discrete information may be reduced to a sequence of ones and zeros. As a result, they are represented as bits. You can express any number in the form of bits. The process is the same as that of the decimal number. However, instead of writing many digits, you only have two to produce the result. So, what are values? Just imagine an ocean of bits. A typical modern computer contains about 30 billion bits in the working memory. The working memory is also known as volatile data storage. The non-volatile storage that belongs to the hard disk or stands equivalent to that has a couple of orders of magnitude. If you want to continue working with these quantities of bits without mixing up and confusing things, you must separate them into tiny chunks known as values. It must be kept in mind that values are created with bits, yet these values play multiple roles. There is a type for each value that determines the role the value has to play. Some values are labeled as numbers, some as pieces of text, and some are known as functions. There is standard practice to create a value - you must invoke its name first. The practice is not only standard but also convenient. There is no need to collect the right building material for the values or right away pay for them. Call

for one, and you will have one. This doesn’t mean that the values will be created out of thin air. Each value needs some place to store itself. So, if you are looking forward to creating a lot of them, you must think about the storage procedure. However, this is not a problem if you are looking forward to not creating them simultaneously. When you are not using a value, it will be discarded by the computer system. Numbers Values of the number are numeric values. In a JavaScript code, you will write it as follows: 13 You will use that inside a program, and it is going to bring bit patterns for the number in the memory of your computer. JavaScript will use a fixed number of bits, 64 bits, for storing value for a single number. There are unlimited patterns that you may create with 64 bits. This means that the amount of different numbers that the system may represent is restricted. With the N decimal digits, you have the opportunity to represent the 10N numbers. The memory of the computer used to be a lot smaller, and people had to use certain groups of 8 and 16 bits in order to represent the numbers. It had been easy to overflow some small numbers to end up along with a number that could not fit inside some bits. Times have changed. Even the computers that fit into our pockets have immense space to save whatever you need. These bits store negative numbers, and one bit of them alludes to the sign of a single number. A bigger issue that you may witness is that non-whole numbers ought to be represented as well. In order to do this, you need to use some bits for storing the decimal point’s position. Arithmetic The main point is that number is used in arithmetic. They are used in programming to perform arithmetic operations like addition and multiplications. The simple operations of multiplication and addition need at least two numbers to produce a third number. The + is the