Variations on a Theme:
JavaScript
An object-oriented Introduction

by Ralph P. Lano, 1. Edition

Why

this book?  I have always been writing little bits and pieces of JavaScript, but my preferred language always was Java, which is what I teach.  What triggered this book, was a student with an iPad Pro, who asked if he could use it for my class.  Unfortunately, the answer was no.  Times change, and so did JavaScript.  With the advent of ES6, some "syntactic sugar" was added to the language: classes.  And since I really like sugar, I set myself the challenge: could I rewrite my introductory Java book in JavaScript?  My main design criteria was to have as few changes as possible to convert Java examples to JavaScript.  And surprisingly, it worked really well.  This may not really be a good reason to write a book, but then, what is?

For whom

Well, obviously for the student with the iPad.  Definitely, hardcore JavaScript folks will not like it, and this is NOT a mainstream JavaScript book.  This is a fun project.  And if you have little or no programming skills, maybe this book here will be a helpful introduction.  If you like books with many pictures, then also, this book may be for you.  But don't be fooled by the number of pages: there is a lot of work to be done.  If a lot of work is not your thing, then this book probably is not for you.

From whom

I have been teaching Java for roughly twenty years now, in different forms, courses and universities.  So naturally, this is JavaScript through the eyes of a Java developer.  Since 2011, I have been Professor of Internet Programming and Multimedia Applications in the MediaEngineering program at the Nuremberg Institute of Technology.  From 2003 to 2010 I was Professor of Software Engineering and Multimedia Applications at the University of Applied Sciences  Hof, and from 2010 to 2011 Professor of Media and Computing at HTW Berlin.  I received my doctorate in 1996 from the University of Iowa on the subject 'Quantum Gravity: Variations on a Theme'.  From 1996 to 1997 I was Postdoctoral Research Associate at the Centre for Theoretical Studies of the Indian Institute of Science.  From 1997 to 2003 I worked at Pearson Education and later at Siemens AG in software development and project management.

About what

It's getting a bit technical now, but some people want to know what they're getting into:  In the first chapter we take the first programming steps with Karel.  We get to know functions, loops, conditions and our first software engineering principles.  Above all, the top-down principle is introduced for the first time.  The second chapter introduces graphics programming, we learn to use objects using a JavaScript version of the ACM graphics library.  This is followed by an introduction to console programs.  The point here is to get to know variables and operators, conditions and loops are deepened, boolean variables are introduced and the 'Loop and a Half' is shown.  In the chapter Agrar the top-down principle is deepened and functions are put on a new foundation.  It is also shown how animations and mouse events work, and the random generator is used for the first time.  Chapter five deals with strings and introduces classes.  The Swing chapter introduces the basics of graphical user interfaces and concretizes the concept of instance variables.  The basics of object orientation, inheritance and composition, will be discussed in detail in the following chapter and will be deepened by numerous examples.  Arrays and simple image processing are also introduced.  Then we finish off the main part with the introduction of the list and map data structures, and we conclude with interfaces and loosely introduce the term polymorphism.

The appendix starts with a primer on JavaScript and some of its new features.  This is followed by a brief description of each of the libraries we use in the main part.  Especially the graphics libraries are nothing but a thin wrapper around the p5.js library from the Processing Foundation [7].  The final chapter, is just a loose collection of idea, which is work in progress.

How

does one learn to play the piano?  Not by watching or listening.  It's the same with programming: you have to practice a lot!  And the more you practice, the better you become with programming.  We're not only learning programming here, but also actually taking our first steps in software engineering.  But as Johann Sebastian Bach so nicely said: "All you have to do is hit the right key at the right time."

The course as I teach it, consists of three components: the lecture, the labs and homework.  The lecture is four hours per week and corresponds to the first part of each chapter in the book.  We complete one chapter in about one to two weeks.  In the labs, which also last four hours a week, we then devote ourselves to the projects.  We manage between four and six of the projects per lab.  In the labs, the students work in teams, usually in pairs, to help each other.

Homework is done on a weekly basis and takes about 8 to 10 hours per week.  It is important that the students work alone on their homework.  I attach great importance to the fact that the students commit themselves to follow the Stanford University honor code.  The homework also doesn't have to be complete or work perfectly.  The homework is discussed individually in the labs, and almost all problems related to the homework usually can be solved within five minutes.

Where

can I find the examples and the source code?  You can find them on the website of the book: https://github.com/rplano.  Also, the book in electronic form, including updates, can be found there.  The book in printed form is available on Amazon, in black and white.

May I

use the examples, or copy the book?  This material is licensed under Creative Commons Attribution - Non-commercial - Distribution under Equal Terms 4.0 International (CC-BY-NC-SA 4.0).  That is, you may reproduce and redistribute the material in any format or medium, remix the material, modify it, and build upon it.  However, you must provide appropriate copyright and other proprietary notices, include a link to the license, and indicate whether any changes have been made. This information may be provided in any reasonable manner, but not in such a way as to create the impression that the Licensor is specifically endorsing you or your use.  You may not use the material for commercial purposes.  And if you remix, modify, or otherwise directly build upon the material, you may distribute your submissions only under the same license as the original, and you may not use any additional clauses or technical procedures that legally prohibit others from doing anything that the license permits.  To view a copy of this license, visit http://creativecommons.org/licenses/by-nc-sa/4.0/.

The source code is available under the MIT License (http://choosealicense.com/licenses/mit/).

From where

come the ideas?  Since this book is almost identical to my first book, the style, the pedagogical structure and many of the examples are heavily inspired by Mehran Sahami's lecture [1], which in turn is based on the book by Eric Roberts [2].  I personally learned JavaScript from David Flanagan's book [5].  However, JavaScript has changed quite a bit over the years, and if you really want to understand it, you must read Douglas Crockford's book [3].  The tutorials on W3Schools [4] are really helpful when you need a quick solution for a simple problem.  Addy Osmani website [6] I really like, because it shows that you can write really nice, clean code with JavaScript, just take a look for yourself.

References

[1] Programming Methodology, CS106A, von Mehran Sahami, https://see.stanford.edu/Course/CS106A
[2] The Art and Science of Java, von Eric Roberts, Addison-Wesley, 2008
[3] JavaScript: The Good Parts: Working with the Shallow Grain of JavaScript, Douglas Crockford, O'Reilly, 2008
[4] JavaScript Tutorial - W3Schools, www.w3schools.com/js/
[5] JavaScript: The Definitive Guide, David Flanagan, O'Reilly, 2012
[6] Learning JavaScript Design Patterns, Addy Osmani, https://www.patterns.dev/posts/classic-design-patterns/
[7] p5.js, https://p5js.org/

.