1. JavaScript for PHP
developers
The Good Parts
Karsten Dambekalns <karsten@typo3.org>
Freitag, 15. Mai 2009

2. What this is about
the JavaScript language
not DOM
not browsers
not JS frameworks
not website building
Freitag, 15. Mai 2009

3. Am I qualified?
Probably not, when it comes to JS
Absolutely when it comes to PHP
Freitag, 15. Mai 2009

4. My JS background
First 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

5. In JavaScript, there is
a beautiful, elegant,
highly expressive
language...
Freitag, 15. Mai 2009

6. ...that is buried under
a steaming pile of
good intentions and
blunders.
Douglas Crockford
Freitag, 15. Mai 2009

7. Grammar
Freitag, 15. Mai 2009

8. 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

9. Numbers
Only one type, 64 bit floating point internally
Numbers have methods
(Most things in JavaScript are objects)
Freitag, 15. Mai 2009

10. Strings
16 bit Unicode, as such somewhat limited
Strings have methods and properties
toUpperCase(), length
Concatenation is done with +, as is addition
(Beware of errors as a result of this!)
Freitag, 15. Mai 2009

11. 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

12. 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

13. Functions
Freitag, 15. Mai 2009

14. 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

15. 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

16. 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

17. var myObject = function () {
var value = 0;
return {
increment: function (inc) {
value += typeof inc === ‘number ? inc : 1;
}
getValue: function () {
return value;
}
}();
Freitag, 15. Mai 2009

18. Objects
Freitag, 15. Mai 2009

19. 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

20. 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

21. The new statement
new 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

22. 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

23. Arrays
Freitag, 15. Mai 2009

24. 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

25. 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

26. Awful & bad parts
Freitag, 15. Mai 2009

27. 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

28. 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

29. 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

30. Read this!
JavaScript: The Good Parts
Douglas Crockford
O’Reilly
Freitag, 15. Mai 2009

31. Thanks!
Freitag, 15. Mai 2009