JavaScript

INFO1-CE9755

Professor:Sam Sultan  [sam.sultan@nyu.edu]
Class website: [workshop.sps.nyu.edu/~sultans/javascript] (or) [samsultan.com/javascript/]
Course Days: Tuesdays - 9/24 - 12/3 (No class 11/5)
Course Hours: 6:30pm - 9:30pm
Modality: Online via Zoom
Announcement(s):

+syllabus
+course outline
+grades & evaluation
+student listing
+examples & demos
+final project
+student feedback
+student evaluation & comments

Prerequisites - html   tables   forms  
Session - 1   2   3   4 / 5   6 (CSSa CSSb)   7   8   9   10   Extra Topics (self-study): OO   jQuery  


HTML - CSS - JavaScript - DOM - JSON - AJAX - jQuery - JavaScript*Tester©
Site Helpful?

COURSE DESCRIPTION:

JavaScript is a scripting language embedded in webpages to create dynamic, interactive content. In this hands-on course, learn the fundamentals of employing JavaScript for web applications. Use JavaScript to display clocks, slide shows, and dynamic image galleries. Learn how to create reusable components such as form validators. Work with and set cookies to create personalized pages. Understand the Document Object Model (DOM), and learn how to use it with JavaScript to create DHTML components such as hover menus, flyouts, and mouse-over effects. Complete the course by learning about asynchronous web services using AJAX and Fetch.


COURSE LEARNING GOALS:

1. Course Objectives:

The objective of this course is to teach you JavaScript as it relates to web page development. The course will discuss JavaScript core language, including JavaScript data types and variables, expressions and operators, functions, arrays and objects. We will also examine the Document Object Model and JavaScript event model, and will explain how you can use these to interact with HTML components to create dynamic web content. The course will also show you how to interact with HTML forms, and how to create, manipulate and save client-side cookies.

In addition the course will also examine Cascading Style Sheet and DHTML, and will teach you how to create dynamic HTML components by creating and manipulating HTML content through their DOM element objects. The course completes with some discussions on advanced topics such as jQuery, AJAX and OO. jQuery is a very popular javaScript library that makes coding and interacting with HTML elements much simpler. AJAX allows you to perform dynamic asynchronous communications with the server to obtain and present data more interactively. And OO which stands for object oriented teaches you techniques for writing object oriented JavaScript.

2. Student Learning Outcomes:


BOOKS - (Required / Suggested)

Required Books -

Suggested Books -

GRADE ASSIGNMENT AND EVALUATION:

Your final grade will be based on the following:


Details of Assignment, Exam and Grade Evaluation.


NE and P/F Grades
If you are not interested in receiving a grade, and you simply require an NE (non-evaluative) or P/F (pass/fail) grade, please fill out the appropriate form listed. Neither an NE nor a P/F grade will count toward an NYU certificate.

NYU SPS Grading Scale and Policies https://www.sps.nyu.edu/homepage/student-experience/policies-and-procedures.html>

Grades are FINAL
Please do not negotiate for a better grade. If you are expecting to receive a grade of an "A" at the end of the semester, then I expect you to attend all sessions (unless you previously notify me), to participate in every class, to turn in your homework on time, and to keep up with the class reading material. If you see yourself falling behind do not hesitate to ask for help. This will ensure that you stay current with the class, and will ensure that you get a good grade on your work.

Your Final Grades will be posted to NYU Albert:


COURSE OUTLINE:

DATE SESSION TOPIC[s] COVERED
[Session 1] 1
  • Introduction to JavaScript
  • HTML and scripting languages
  • Where to insert JavaScript in HTML
  • The <script> tag
  • JavaScript variables and data types
  • Numeric and String operators
  • Comparison and Logical operators
  • JavaScript Arrays and Objects
  • What is an array?
  • Accessing array elements
  • What is an object?
  • Object properties and methods

  • Reading: Chapters 1, 2
     
    [Session 2] 2
  • Basic JavaScript programming concepts
  • The if statement
  • The else condition
  • The switch and case statements
  • The for and for..in loops
  • The while and do..while loops
  • The break and continue statements
  • The label identifier
  • Defining functions
  • Passing parameters and receiving data from functions
  • Variable scope and the var statement

  • Reading: Chapter 3, 4
     
    [Session 3] 3
  • The Browser Objects
  • The Browser Object Hierarchy
  • The Window object
  • The History object
  • The Location object
  • The Navigator object
  • The Screen object
  • Opening up additional windows
  • Accessing other frames
  • JavaScript events and event handling
  • Setting up timers

  • Reading: Chapters 8, 7 (timers only)
     
    [Session 4/5] 4/5
  • The Document Object Model
  • The Document object
  • The Image object
  • Creating an image rollover effect
  • The Form object
  • The elements Input object
  • Common properties and methods
  • The Select and option objects
  • Interacting with HTML form elements
  • Validating data entered in a form

  • Reading: Chapters 9 (first half), 11
     
    [Session 6] 6
  • Midterm Exam

  • Core DOM and DHTML Effects
  • Cross browser challenges
  • Core DOM in modern W3C compliant browsers
  • The HTMLElement Object
  • The element Style Object
  • Accessing HTML elements
  • Altering the content of HTML elements
  • Altering the style of HTML elements
  • Hiding and showing content
  • Dynamically creating HTML elements & attributes
  • Unobstrusive JavaScript

  • Reading: Chapter 9 (second half), 10
     
      CSSa







    CSSb
  • CSS - Cascading Style Sheets
  • Structure of a CSS rule
  • Inline, embedded and external CSS
  • Creating style sheets
  • Applying styles to your HTML
  • CSS selectors
  • Class and Id selectors
  • Cascading and Inheritance rules

  • CSS Properties and Values

  • Reading: Online @ www.w3schools.com/css
     
    [Session 7] 7
  • JavaScript built-in objects
  • The Math object
  • The String object
  • String manipulation
  • The Array object
  • Sorting arrays with additional helper functions
  • The Date object
  • Date manipulation
  • Conversion between data types

  • Reading: Chapters 5, 6, 7
     
    [Session 8] 8
  • What is a cookie?
  • The structure of HTTP cookies
  • Storing data in a cookie
  • Transient vs. permanent cookies
  • Retrieving data from cookies
  • HTML5 Web Storage
  • Working with sessionStorage and localStorage

  • Reading: Chapter 13
     
    [Session 9] 9
  • Web Services - Full Stack Development
  • Basic client/server web communication
  • The HTTP request/response paradigm
  • Asynchronous server communication
  • Advantages of asynchronous processing
  • Ajax - Asynchronous JavaScript and XML
  • The XMLHttpRequest Object
  • XML data streams
  • JSON data streams
  • Ajax examples
  • The Fetch command
  • Full Stack Web Services
  • The role of a Web Server
  • Example of Web Services in Perl,Python,PHP and Java

  • Reading: Chapter 12, 14
     
    [Session 10] 10
  • Final Exam
  • Final Project Class Presentations
  •  
    [Extra] OO
  • JavaScript Object Oriented Concepts.
  • Objects vs. Classes.
  • Defining Object Constructors.
  • Defining Properties and Methods.
  • Instantiating Objects.
  • Class vs. Instance properties and methods.
  • The "This" keyword.
  • Defining Object prototype.

  • Reading: Chapter 9 (Javascript - The Definitive Guide)
     
    [Extra] jQuery
  • jQuery - JavaScript Library
  • Downloading and using jQuery library
  • Typical tasks you perform with jQuery
  • Selecting elements from the DOM
  • Changing element content
  • Adding/Changing/Removing attributes
  • Adding/Removing/Toggling CSS classes
  • Adding/Changing CSS properties
  • Adding/Replacing/Removing elements
  • jQuery built-in animation effects
  • Working with element Set
  • Working with arrays and objects

  • Reading: Chapter 16, 17



    All contents © Sam Sultan.
    For more information, send e-mail to: sam.sultan@nyu.edu