University of Computer Studies

Web Technology JavaScript programming

What is JavaScript?

JavaScript Group
Department of Information Technology Supporting and Maintenance
 Reference Book

• Professional JavaScript for Web Developers , Third Edition By Nicholas C. Zakas

 General lecture Plan

• Section 1 • Section 4
What is JavaScript? Document Object Model(DOM) and
JavaScript in HTML DOM Extensions
Variables, Scope, and Memory • Section 5
• Section 2 Events, Forms and Canvas
Language Basics • Section 6
Reference Types Client-side Storage
Function
• Section 3
Understanding Objects
Window Object
 Outline

• A Short History
• JavaScript Implementations
• JavaScript Versions
 What is JavaScript?

• JavaScript is a scripting language designed to interact with web pages

• JavaScript purpose was to handle some of the input validation
• JavaScript has grown into an important feature of every major web browser on the market.
• JavaScript is recognized as a full programming language
• JavaScript is very loosely based on Java
 JavaScript’s History

• JavaScript was created in 10 days by Brendan Eich

• JavaScript original name is Mocha
• Java was famous at that time, hence the name “JavaScript” was changed to ride on Java’s success
• JavaScript has nothing to do with Java
• Microsoft created a reverse engineered version of JavaScript, known as Jscript
 JavaScript Implementation

• Component
• ECMAScript,
• Document Object Model (DOM),
• Browser Object Model (BOM).
• Browser
• IE6, Firefox, Chrome, Opera, Safari, and Microsoft Edge
• Operating System
• Windows, Mac, or Linux
 ECMAScript(European Computer
Manufacturer's Association)

• defined the language in ECMA-262

• isn’t tied to web browsers
• defined this language as a base upon which more-robust scripting languages may be built
 The Document Object Model (DOM)

• DOM is an application programming interface (API) for XML that was extended for use in HTML
• DOM is necessary to preserve the cross-platform nature of the Web
• With the object model, JavaScript gets all the power it needs to create dynamic HTML:
• can change all the HTML elements in the page
• can change all the HTML attributes in the page
• can change all the CSS styles in the page
• can remove existing HTML elements and attributes
• can add new HTML elements and attributes
• can react to all existing HTML events in the page
• can create new HTML events in the page
 The Browser Object Model (BOM)

 The Browser Object Model (BOM) is used to interact with the browser.

 These BOM provides access to the various characteristics of a browser (Browser window itself,
Screen characteristics, Browser history etc…..

 By using BOM, can modify, move the window or can change the text in status bar, read the current
URL, go back or forward of the current page.
 JavaScript Versions

• The Original JavaScript ES1 ES2 ES3 (1997-1999)

• The First Main Revision ES5 (2009)
• The Second Revision ES6 (2015)
• The Yearly Additions (2016, 2017, 2018, 2019, 2020, 2021)
 Summary

• ECMAScript
• Document Object Model (DOM)
• Browser Object Model (BOM)
University of Computer Studies

Thank you! 