JavaScript for PHP Developers

JavaScript for PHP developers

The Good Parts

Karsten Dambekalns <karsten@typo3.org>

Freitag, 15. Mai 2009

What this is aboutthe JavaScript language

not DOM

not browsers

not JS frameworks

not website building

Freitag, 15. Mai 2009

Am I qualified?

Probably not, when it comes to JS

Absolutely when it comes to PHP

Freitag, 15. Mai 2009

My JS backgroundFirst JS usage in the days of NN4

Used DynAPI, modified it

Saw alert() fix timing issues in browsers

Was happy when I did not have to use JavaScript anymore

Thought I would never touch it again

Freitag, 15. Mai 2009

In JavaScript, there is a beautiful, elegant,

highly expressive language...

Freitag, 15. Mai 2009

...that is buried under a steaming pile of

good intentions and blunders.

Douglas Crockford

Freitag, 15. Mai 2009

Grammar

Freitag, 15. Mai 2009

Names

Names can be chosen freely

Some words are reserved, most of them not used in JavaScript, though

Some word should have been reserved:

NaN, Infinity, undefined

Freitag, 15. Mai 2009

Numbers

Only one type, 64 bit floating point internally

Numbers have methods

(Most things in JavaScript are objects)

Freitag, 15. Mai 2009

Strings

16 bit Unicode, as such somewhat limited

Strings have methods and propertiestoUpperCase(), length

Concatenation is done with +, as is addition

(Beware of errors as a result of this!)

Freitag, 15. Mai 2009

var

Most confusing for me was var – it seemed to make no difference most of the time

Inside a function var defines a function’s private variables

Otherwise variables will be globally accessible!

Freitag, 15. Mai 2009

Type issues

typeof returns a string with a type

For arrays and null it returns ‘object’

typeof NaN === ‘number’ // true!

undefined and NaN are global variables – you can change their values

Freitag, 15. Mai 2009

Functions

Freitag, 15. Mai 2009

Basics

Functions are objects, they can be

stored in variables, arrays, objects

passed as arguments and returned

Functions can have methods (they are objects!)

Freitag, 15. Mai 2009

Defining functions

JavaScript has a function statement and a function expression: function foo() {}means about the same as var foo = function foo() {}

Remember: functions are values

Freitag, 15. Mai 2009

Closure

Inner functions can access parameters and variables of the context in which they are created

This can be used

to protect variables against manipulation

to keep values over function calls

Freitag, 15. Mai 2009

var myObject = function () {var value = 0;return {

increment: function (inc) {value += typeof inc === ‘number ? inc : 1;

}getValue: function () {

return value;}

}();

Freitag, 15. Mai 2009

Objects

Freitag, 15. Mai 2009

Basics

Numbers, strings, booleans, null, undefined are simple types

Everything else is an object: arrays, functions, regular expressions

Objects have properties with name and value

Objects are class free

Freitag, 15. Mai 2009

Object literals

Very cool way of creating objects, confusing if seen for the first time (no new?!)

var flight = { airline: ‘FLOW Flights’, number: 3, captain: { ... }}

Freitag, 15. Mai 2009

The new statementnew creates an object that inherits from the operand, then calls the operand with the created object bound to this

If the operand customizes the object but you forgot new, you change global variables!

If you use new, make constructor method names UpperCamelCase

Freitag, 15. Mai 2009

Inheritance

Objects inherit from objects, no classes

Prototypal inheritence allows to augment existing objects during runtime: Foo.prototype.bar = function () { ... }

Even built-in objects can be enhanced

Local properties hide inherited ones

Freitag, 15. Mai 2009

Arrays

Freitag, 15. Mai 2009

Basics

Arrays can be created with array literals: var data = [‘one’, ‘two’, ‘three’];

The length property of an array

is the largest integer property name +1

can be set and thus cut off arrays at the end

Freitag, 15. Mai 2009

Array or Object?

Simple rule for what to use:When property names are small sequential integers, use an array. Otherwise an object.

Hard to find out what you have:You need to define a useful is_array method yourself.

Freitag, 15. Mai 2009

Awful & bad parts

Freitag, 15. Mai 2009

Semicolon inerstion

JavaScript tries to fix programs by inserting semicolons – do not rely on that!

What does this return?return{ status: true};

Freitag, 15. Mai 2009

parseInt

parseInt(’16’) == parseInt(’16 tons’) == 16

parseInt(’08’) returns 0 because it assumes octal numbers

Always provide the radix parameter to parseInt

Freitag, 15. Mai 2009

Bitwise operators

Avoid them if you think you gain speed

All numbers are floating point, so bitwise operators convert to integer and back

Freitag, 15. Mai 2009

Read this!JavaScript: The Good Parts

Douglas CrockfordO’Reilly

Freitag, 15. Mai 2009

Thanks!

Freitag, 15. Mai 2009