JS Basics

Jan Filipowski

Me, myself and I

• work: Arkency
• blog: http://agiler.net
• twitter: @janfilipowski
• github: yashke

Goals

• for noobs: teach basics
• show "hidden" features
• explain objects model

Values

• number
• boolean
• string
• null
• undefined

Type conversions

• number to string - "" + number
• string to number - +"1.1", parseInt, parseFloat
• object to string - object.toString method

Variables

• defined via var keyword
• scoped to current function (!) or global
• in JS 1.7 block scoping with let
• naming: [a-zA-Z_\$][a-zA-Z_\$0-9]+ with support for unicodes

Global variables and constants

window.variable = value

​

const constant = value

Literals

• Array: []
• Object: {} - keys are strings or numbers
• String: "" / '' - unicode
• Boolean: true / false
• Regular expression: //

Numbers

• no distinction between integers and floats
• notation:
• 123 - decimal
• 0123 - octal
• 0x123 - hexadecimal
• 1.1 - float
• 1.1e-2 - exponential

​

Expressions

• assignment
• comparison
• arithmetic
• bitwise
• logical
• string
• special

Special

• conditional: condition ? if true : if false
• comma
• delete
• in
• instanceof
• new
• this
• typeof
• void

​

Regular expression

• RegExp constructor
• or // literal

Statements

• block
• if / else
• switch
• while / do ... while
• for
• for ( ... in ... )
• for each ( ... in ... ) [JS 1.6]
• break
• continue
• label (label: while ...)
• try / catch / finally

Exceptions

• in 1.5 there's only one catch section.
• every object can be thrown as exception
• good practice - exception should have name and description properties
• defaults: Error, EvalError, InternalError, RangeError, ReferenceError, StopIteration (1.8), SyntaxError, TypeError, URIError

Functions

• according to ECMAScript they should be declared in scope of function or global
• function has access to its own variables and to which its parent has access to.
• special variable: arguments
• can be named or anonymous
• can have properties (fields and methods)

Objects

• definition: collection of properties, where property is name and its value
• object initialization possibilities:
• new Object()
• Object.create(prototype, properties)
• {}
• constructor function (class-like)

Object model

• based on objects only
• so object inherits from object - prototype (not class)
• each object has prototype, accessible with __proto__
• each constructor has prototype for constructed objects - accessible with prototype

Property lookup in prototypical inheritance (console(o.field))

1. if o has own property 'field' it returns it
2. if not, it checks if its prototype have such
3. if yes - returns it
4. if no - returns undefined

​

If property in prototype is method, which uses other property of object it starts looking for it's value from original (first) object, not the current one - prototype.

Consequences - examples

• change prototype object
• change object

Object construction flow

Assume we have Foo constructor and we want to create object o. Then flow looks like this:

o = new Object()

o.__proto__ = Foo.prototype

o.Foo()

How to pass arguments to prototype constructor

Assume: Bar.prototype = new Foo()

​

function Bar(name, smth) {

Foo.call(this, name)

this.smth = smth;

}

Setters and getters

No kidding, guys!

Source

https://developer.mozilla.org/en-US/docs/JavaScript/Guide

​

KTHXBYE

Questions?