JavaScript Introduction
By Lisa Saldivar and Aletha Read
()
About this ebook
This book will help students learn to:
Use features of the most recent version of JavaScript
Use complex and primitive variables and data types
Work with Objects in JavaScript
Use Regular Expressions for pattern matching
Handle and respond to screen and keyboard events
Validate form input with JavaScript
A copy of the exercise files used in this course can be obtained by emailing info @ skillforge.com
Related to JavaScript Introduction
Related ebooks
The Best Javascript Rating: 0 out of 5 stars0 ratingsSchematron: A language for validating XML Rating: 0 out of 5 stars0 ratingsFour Programming Languages Creating a Complete Website Scraper Application Rating: 0 out of 5 stars0 ratingsMastering Ext JS - Second Edition Rating: 0 out of 5 stars0 ratings.Net Framework and Programming in ASP.NET Rating: 0 out of 5 stars0 ratingsPHP 5 CMS Framework Development - 2nd Edition Rating: 0 out of 5 stars0 ratingsMastering Magento Theme Design Rating: 0 out of 5 stars0 ratingsLearning Magento Theme Development Rating: 0 out of 5 stars0 ratingsInstant Magento Shipping How-To Rating: 0 out of 5 stars0 ratingsMagento 2 Development Essentials Rating: 0 out of 5 stars0 ratingsReal-World Solutions for Developing High-Quality PHP Frameworks and Applications Rating: 3 out of 5 stars3/5Jump Start Web Performance Rating: 0 out of 5 stars0 ratingsBeginning CSS: Cascading Style Sheets for Web Design Rating: 4 out of 5 stars4/5MySQL 5.1 Plugin Development Rating: 0 out of 5 stars0 ratingsJavaScript Rating: 0 out of 5 stars0 ratingsInstant Hands-on Testing with PHPUnit How-to Rating: 0 out of 5 stars0 ratingsNuxt 3 Projects: Build scalable applications with Nuxt 3 using TypeScript, Pinia, and Composition API Rating: 0 out of 5 stars0 ratings30 Days to DevOps Proficiency Rating: 0 out of 5 stars0 ratingsPHP Team Development Rating: 3 out of 5 stars3/5PhpStorm Cookbook Rating: 0 out of 5 stars0 ratingsInstant Play Framework Starter Rating: 0 out of 5 stars0 ratingsLearn to Code With JavaScript Rating: 0 out of 5 stars0 ratingsMVVM Survival Guide for Enterprise Architectures in Silverlight and WPF Rating: 0 out of 5 stars0 ratingsProgramming the Network with Perl Rating: 0 out of 5 stars0 ratingsApache Cassandra Essentials Rating: 4 out of 5 stars4/5AJAX Interview Questions, Answers, and Explanations: AJAX Certification Review Rating: 0 out of 5 stars0 ratingsMastering Java: A Comprehensive Guide to Programming Excellence Category Rating: 0 out of 5 stars0 ratings
Programming For You
Coding All-in-One For Dummies Rating: 4 out of 5 stars4/5Excel : The Ultimate Comprehensive Step-By-Step Guide to the Basics of Excel Programming: 1 Rating: 5 out of 5 stars5/5Python QuickStart Guide: The Simplified Beginner's Guide to Python Programming Using Hands-On Projects and Real-World Applications Rating: 0 out of 5 stars0 ratingsMastering Windows PowerShell Scripting Rating: 4 out of 5 stars4/5SQL QuickStart Guide: The Simplified Beginner's Guide to Managing, Analyzing, and Manipulating Data With SQL Rating: 4 out of 5 stars4/5Python Programming : How to Code Python Fast In Just 24 Hours With 7 Simple Steps Rating: 4 out of 5 stars4/5Grokking Algorithms: An illustrated guide for programmers and other curious people Rating: 4 out of 5 stars4/5Learn to Code. Get a Job. The Ultimate Guide to Learning and Getting Hired as a Developer. Rating: 5 out of 5 stars5/5HTML & CSS: Learn the Fundaments in 7 Days Rating: 4 out of 5 stars4/5Python: Learn Python in 24 Hours Rating: 4 out of 5 stars4/5Linux: Learn in 24 Hours Rating: 5 out of 5 stars5/5Spies, Lies, and Algorithms: The History and Future of American Intelligence Rating: 4 out of 5 stars4/5C Programming For Beginners: The Simple Guide to Learning C Programming Language Fast! Rating: 5 out of 5 stars5/5HTML in 30 Pages Rating: 5 out of 5 stars5/5Raspberry Pi Electronics Projects for the Evil Genius Rating: 3 out of 5 stars3/5Python for Beginners: Learn the Fundamentals of Computer Programming Rating: 0 out of 5 stars0 ratingsPython Data Structures and Algorithms Rating: 5 out of 5 stars5/5Assembly Programming:Simple, Short, And Straightforward Way Of Learning Assembly Language Rating: 5 out of 5 stars5/5PYTHON: Practical Python Programming For Beginners & Experts With Hands-on Project Rating: 5 out of 5 stars5/5JavaScript All-in-One For Dummies Rating: 5 out of 5 stars5/5Java for Beginners: A Crash Course to Learn Java Programming in 1 Week Rating: 5 out of 5 stars5/5Linux Command Line and Shell Scripting Bible Rating: 3 out of 5 stars3/5
Reviews for JavaScript Introduction
0 ratings0 reviews
Book preview
JavaScript Introduction - Lisa Saldivar
Lesson 1: Introduction to JavaScript
Unit time: 75 minutes
In this lesson, you will learn about:
1 Versions of JavaScript
2 Scripting Terminology
3 Language Fundamentals
4 Built in Objects
5 User Input Methods
Versions of JavaScript
JavaScript was created by Brendan Eich at Netscape Navigator in 1995. It was developed to interact with HTML pages. It was originally called Mocha, then LiveScript before being renamed JavaScript.
JavaScript is an interpreted scripting language, rather than a compiled programming language.
ECMAScript is the standardized specification of a few similar client-side scripting languages including JavaScript and Microsoft’s implementation, JScript. In 1999, edition 3 of ECMAScript added regular expressions and try/catch statements. In 2009, edition 5 added strict mode. ECMAScript edition 6 introduces significantly new syntax, including Python-like features. ECMAScript edition 6 was published in June 2015, but is not yet fully supported by browsers. This course will focus on edition 5.1.
JavaScript has grown more popular in recent years because of its contribution to rich internet applications and AJAX. This has led to an increase in JavaScript libraries such as jQuery for Document Object Model (DOM) scripting and JavaScript Model-View-Controller (MVC) frameworks such as AngularJS and Backbone.js. A main use of JavaScript is to manipulate the DOM through user events, providing immediate interaction and giving the server a break. JavaScript is also used in HTML5 Application Program Interfaces (APIs).
Each browser has its own engine for interpreting JavaScript, which occasionally leads to browser differences in how JavaScript is interpreted. Several JavaScript libraries provide an abstraction layer to deal with browser differences behind the scenes.
JavaScript isn’t only used in web browsers. MongoDB and CouchDB are two databases that use JavaScript as their query language. Node.js is a platform that allows JavaScript beyond the browser, and it is even used to create dynamic HTTP servers.
Creating your first JavaScript page
JavaScript can be added to an HTML page in two different ways. It can be added between tags that are inside the HTML page, or in a separate file of only JavaScript. Most applications will use a separate JavaScript file. Using a separate file allows the script to be be re-used and updated efficiently by developers. It also allows the browser to cache the script.
Exercise 1-1 Add a script to your page
Complete the exercise below to add a script to your page using tags and a separate file.
In an editor, open Lesson 1/Exercises/exercise1-1.html.
Add a set of
Inside the
Save exercise1-1.html.
Open the file in your browser.
Open exercise1-1.html in your editor.
Move only the JavaScript code between the
Save the file as exercise1-1.js in the Lesson 1/Exercises/js folder.
In the exercise1-1.html file, add a src attribute to the
Save exercise1-1.html.
Open it in your browser.
It should look the same as in step 5.
Scripting Terminology
Before we begin, we need to cover some terms to assist with the learning process.
Expression
In scripting or programming, an expression produces a value. Any value written literally such as a number or string is an expression.
An expression can assign a value to a variable, or just have a value. JavaScript expressions can evaluate to a number, character string or true/false.
Below is an example of an arithmetic expression. It evaluates to 3 without an assignment.
1 + 2;
Variable
A variable captures and holds values. It can be updated.
Operators
Operators are unary, binary or ternary with one, two or three operands. Operators can be different types including arithmetic, string, logical, assignment and comparison. Most JavaScript operators are binary, requiring an operand on either side of the operator.
In this example, the assignment operator (=) is a binary operator and so is the addition (+) operator.
var x = 1 + 2;
The operand is the part of the expression being manipulated by the operators. Above, the numbers 1 and 2 and the variable x are the operands.
There are a few unary operators with one operand to the left or right of the operator. The minus sign (-) can be used to subtract one number from another in a binary operation, or to negate a value in a unary operation.
var x = -3; //x is negative 3
JavaScript has one ternary operator that has two operators between three operands. It is a shortcut for a true/false test and will be demonstrated later.
Statement
A statement can consist of expressions, variables and operators. A statement is a complete instruction that contains an expression, to be executed by the web browser. Statements should have semicolons separating them.
var x = 1 + 2; //statement
x = 3; //statement
1 + 2; //not a statement
Language Fundamentals
The below section will introduce you to the JavaScript syntax and concepts.
Declaring Variables
In JavaScript, variables are local or global. Local variables are declared with the keyword var. Variables that are set without being declared are global by default. When variables are declared within a function, they are local to that function and unavailable outside the function. JavaScript generally has C-style operators that have hierarchy and associativity.
Below is an example that declares the variable x.
var x;
The declared variable x can be set later in the code.
x = 1 + 2;
Or a variable can be set and declared on one line with the keyword var:
var y = 10 * 2;
Best practice is to declare variables at the top of the JavaScript page in alphabetical order. Note that you use the keyword var once to declare the variables.
var x, y, z;
x = 10;
y = 20;
z = 10;
Assigning or Setting Variables
Variables are assigned or set using the equal sign (=). JavaScript has C-style assignment shortcuts: +=, -=, *=, /= and %=. Below are examples of the various assignment options.
//assign the string hello
to the variable str
var str = hello
;
//concatenate world
to the variable
str += world
;
//+= is a shortcut for
str = hello
;
str = str + world
;
var x = 5;
x *= 10;
//*= is a shortcut for
x = 5;
x = x * 10;
Case Sensitive
JavaScript is case-sensitive. Variables, built-in objects, keywords, functions and methods must use the correct case.
JavaScript convention is to use camelCase to name identifiers (variables and functions). JavaScript's camelCase means putting multiple words together and capitalizing all but the first word:
var userName = ;
function calculateTotalProfits(){}
Hungarian notation is also popular, where the name of the identifier indicates its type and/or intended use.
var intAge = 100; //integer value
var strDept = IT
; //string value
var boolFullTime = true; //Boolean value
var arrEmployeeList = []; //enumerated array
Note that using camelCase is not required, and that Hungarian