WebFund 2016W Lecture 2

Video

The video from the lecture given on January 12, 2016 is now available.

Notes

In-class Notes

Lecture #2
----------
JavaScript

* no declared types
  - strings
  - objects
  - arrays
  - numbers (floats)
  - boolean

With Node
 - asynchronous (non-blocking) I/O

Student Notes

Administration Reminders

JavaScript: As a Language

JavaScript has nothing to do with Java.
- Why is it even called JavaScript then? At first it wasn't; it was developed as Mocha, changed to LiveScript and then finally renamed to JavaScript due to an agreement with Sun (acquired by Oracle).<ref>Stack Overflow - Why is JavaScript called JavaScript, since it has nothing to do with Java?</ref>
The only similarity between Java/JavaScript is some of the syntax, but that can be said for a lot of languages.

What's different about JavaScript?
- No declared data types; it's a loosely typed language.
  - Instead of int i = 0, it's simply var i = 0.
- There's seven data types<ref>MDN - JavaScript Data Structures</ref> (examples in brackets)
  - Boolean (true, false)
  - Number (3.1337, 1337, etc. There's no integer or long, everything is a float)
  - String ("Dave")
  - Symbol
  - Object
  - Null
  - Undefined

How should I learn JavaScript?

Practice! While attending the lectures is a great start, you will have to practice outside of class. This will not be graded, but will ultimately affect your performance in the course (and in the workplace).
- Codecademy has a lot of good resources for beginners.
- For more advanced students, check on GitHub to see if there's any projects you're interested in contributing to. If you plan to work in web development, it's very likely you will be asked in an interview if you've contributed to any open source projects (having a good portfolio will help a lot in getting a first job).
The Mozilla Developer Network maintains a JavaScript reference that is recommend. (Note: There is no official documentation for Google Chrome's V8 engine, although there is an unofficial reference.)

Working with Variables

If you've previously worked with Java, the first large difference you've noticed is likely that variables are very "flexible".

Trying to use things that have not been declared can produce some behaviour that you might not expect:
- Referencing a variable that has not been declared will produce a reference error
- Assigning a value to a variable that has not been declared will implicitly declare the variable at the global level (avoid doing this by explicitly declaring your variables)
- Accessing a property that does not exist in an object will give you undefined
Similar to how in other languages, a symbol x can refer to an object which can encapsulate other object or types of data, in JavaScript, an object can hold various types of data in its properties (e.g., x.y, x.y.z, x.y.x.qwerty, etc).
x.size (dot notation) is the same as x["size"] (array notation).
Functions are also a special type of object and they can be stored in a variable.
JavaScript engines use a garbage collector, so you do not need to manually deallocate memory (in C you need to). Unlike Java, you can "reuse" a variable name and use a completely different type; e.g. creating var x = 1337 and then x = "Dave" later is completely valid.

Regular Expressions (Regex)

While this topic is technically outside of the course material, you will likely need to use it in some assignments. Regex is the same across different languages, so you will not need to relearn it all for every language.

https://developer.mozilla.org/en/docs/Web/JavaScript/Guide/Regular_Expressions

Synchronous vs. Asynchronous

Synchronous (blocking) functions are where a task must be fully complete before the next task can be begin.
- Examples:
  - Waiting on a single network connection before accepting additions requests.
  - Waiting for a file to be fully loaded before displaying it in a text editor.
Asynchronous (non-blocking) functions are where the program is allowed to continue with other tasks while another one is in process.
- Examples:
  - Accepting new network connections while another connection is already in progress.

Node.js

Node.js is designed to provide a server side environment of JavaScript. Instead of using Google's V8 JavaScript inside Chrome/Chromium, Node.js uses the V8 engine directly. Because Node.js is meant to be used outside of the browser, there's some slight differences.

Contains a package manager called npm to manage dependencies (libraries).
Has specialized libraries for networking, file system access, etc that you usually wouldn't find in a browser (mostly for security reasons). These functions have their own set of documentation.
Has no default graphic frontend such as WebKit (although there are libraries to provide that if you wish).

Why use Node.js?

JavaScript makes it easier to write asynchronous functions.
You can reuse your knowledge on client-side JavaScript to apply to server-side Node.js applications.

Getting started with Node.js

To open up Read-Eval-Print-Loop (REPL), run node in a terminal. For more details on setting your environment up, see Tutorial 1.

References