JavaScript

INFO1-CE9755
Fall 2017

Professor:Sam Sultan [sam.sultan@nyu.edu]
Class website: [oit2.scps.nyu.edu/~sultans/javascript] (or) [samsultan.com/javascript]
Course Days: Sundays
Course Hours: 9:00pm - 5:00pm
Location: Woolworth Bldg. room 418B
Announcement(s):

+ outline
+ books
+ grades
+ final project
+ policies & procedures
+ student listing
+ examples & demos
+ homework submission
+ student feedback
+ student evaluation & comments

Session - 1   2   3   4 / 5   6 CSSa CSSb   7   8   9   10   Extra Topics: OO   jQuery  


ITS - HTML - JavaScript - DOM - CSS - DHTML - 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 the newest web techniques using AJAX.


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:


COURSE REQUIREMENTS AND POLICIES:

See [Requirements and Policies]


BOOKS - (Required / Suggested)

Required Books -

Suggested Books -

GRADE ASSIGNMENT AND EVALUATION:

For non-credit and NYU Undergraduate 2 credit students, your final grade will be based on the following:

For NYU Undergraduate 4 credit students, your final grade will be based on the following:


Details of Assignment and Evaluation. 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, to participate in 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. 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 I am notified ahead of time), to participate in these sessions, to keep up with the class reading material, and to complete your homework assignments. This will ensure that you stay current with the class content, and will ensure that you get a good grade on your test(s), project as well as your final grade.

If you are a non-credit student, and are not interested in a grade, or you do not submit your homeworks/project or take the exams, then you will receive a grade of an "NE" (Non-Evaluative). A grade of NE is final, and cannot be changed. A grade of NE cannot be applied as partial fulfillment for any NYU certificate program.


To receive your final grade at the end of the semester, follow these steps:

  1. click on http://www.scps.nyu.edu/academics/noncredit-offerings/academic-noncredit-policies-and-procedures.html#Obtaining_Grades
  2. Log into Albert using your net id, at: https://admin.portal.nyu.edu/psp/paprod/EMPLOYEE/EMPL/h/?tab
  3. Click on "Student Center"
  4. Within your student center, in the "academics" section click on the dropdown: "other academic"
  5. From the dropdown select "grades"
  6. For complete instructions click here


COURSE OUTLINE:

DATE SESSION TOPIC[s] COVERED
[Week 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
     
    [Week 1] 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
     
    [Week 2] 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)
     
    [Week 2 & 3] 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
     
    [Week 4] 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
     
    [Week 4] 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
     
    [Week 5] 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
     
    [Week 5] 9
  • AJAX - Asynchronous JavaScript and XML
  • Basic client/server web communication
  • The HTTP request/response paradigm
  • Asynchronous server communication
  • The XMLHttpRequest Object
  • XML data Streams
  • Advantages of asynchronous processing
  • Ajax examples

  • Reading: Chapter 12, 14
     
    [Week 5] 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