Download - JavaScript for PHP Developers
JavaScript for PHP DevelopersEd Finkler@[email protected]
May 18, 2010
#tekX #js4phphttp://joind.in/1564
Wednesday, May 19, 2010
JavaScript for PHP Developers - Ed Finkler - tek-X - May 18, 2010
What is this?
2Wednesday, May 19, 2010
Stop c+p'ing, start writing
JavaScript for PHP Developers - Ed Finkler - tek-X - May 18, 2010
A practical overview of JSfor the PHP developer
3Wednesday, May 19, 2010
I'm too dumb for that
JavaScript for PHP Developers - Ed Finkler - tek-X - May 18, 2010
NOT CS-oriented
4Wednesday, May 19, 2010
FWIW
JavaScript for PHP Developers - Ed Finkler - tek-X - May 18, 2010
My experiences and best practices
5Wednesday, May 19, 2010
JS devs are kind of dickheads
JavaScript for PHP Developers - Ed Finkler - tek-X - May 18, 2010
JavaScript dev is opinionated
6Wednesday, May 19, 2010
JavaScript for PHP Developers - Ed Finkler - tek-X - May 18, 2010
History of JavaScript
7Wednesday, May 19, 2010
JavaScript for PHP Developers - Ed Finkler - tek-X - May 18, 2010
Brendan Eich
8Wednesday, May 19, 2010
JavaScript for PHP Developers - Ed Finkler - tek-X - May 18, 2010
"Mocha"
9Wednesday, May 19, 2010
JavaScript for PHP Developers - Ed Finkler - tek-X - May 18, 2010
"LiveScript"
10Wednesday, May 19, 2010
Seemed like a good idea at the time
JavaScript for PHP Developers - Ed Finkler - tek-X - May 18, 2010
"JavaScript"
11
http://www.infoworld.com/d/developer-world/javascript-creator-ponders-past-future-704
Wednesday, May 19, 2010
Yeesh
JavaScript for PHP Developers - Ed Finkler - tek-X - May 18, 2010
ECMAScript
12Wednesday, May 19, 2010
JavaScript for PHP Developers - Ed Finkler - tek-X - May 18, 2010
Core JavaScript
13Wednesday, May 19, 2010
aka ECMAScript 3, circa 1999
JavaScript for PHP Developers - Ed Finkler - tek-X - May 18, 2010
Baseline is JS 1.5
14Wednesday, May 19, 2010
Hey, I know that!
JavaScript for PHP Developers - Ed Finkler - tek-X - May 18, 2010
Dynamically typed
15Wednesday, May 19, 2010
JavaScript for PHP Developers - Ed Finkler - tek-X - May 18, 2010
Object-based
16Wednesday, May 19, 2010
But not how you think
JavaScript for PHP Developers - Ed Finkler - tek-X - May 18, 2010
Object-oriented
17Wednesday, May 19, 2010
First class, baby!
JavaScript for PHP Developers - Ed Finkler - tek-X - May 18, 2010
Functional
18Wednesday, May 19, 2010
Like giving clay to a monkey
JavaScript for PHP Developers - Ed Finkler - tek-X - May 18, 2010
Malleable
19Wednesday, May 19, 2010
You mean I don't have to memorize 4,500 function names?
JavaScript for PHP Developers - Ed Finkler - tek-X - May 18, 2010
Core is pretty darn small
20Wednesday, May 19, 2010
JavaScript for PHP Developers - Ed Finkler - tek-X - May 18, 201021
Core Objects Core Global FunctionsBoolean decodeURINumber decodeURIComponentString encodeURIArray encodeURIComponentObject evalFunction isFiniteRegExp isNaNDate parseFloat
parseInt
Core JS
Wednesday, May 19, 2010
All the cool stuff!
JavaScript for PHP Developers - Ed Finkler - tek-X - May 18, 201022
What's missing?
Wednesday, May 19, 2010
JavaScript for PHP Developers - Ed Finkler - tek-X - May 18, 201023
File i/o
Wednesday, May 19, 2010
JavaScript for PHP Developers - Ed Finkler - tek-X - May 18, 201024
Networking
Wednesday, May 19, 2010
JavaScript for PHP Developers - Ed Finkler - tek-X - May 18, 201025
DB APIs
Wednesday, May 19, 2010
Yep, the DOM is not part of JavaScript
JavaScript for PHP Developers - Ed Finkler - tek-X - May 18, 201026
DOM
Wednesday, May 19, 2010
Please don't leave yet.
JavaScript for PHP Developers - Ed Finkler - tek-X - May 18, 201027
So what's it good for?
Wednesday, May 19, 2010
Please don't leave yet.
JavaScript for PHP Developers - Ed Finkler - tek-X - May 18, 201028
So what's it good for?
Wednesday, May 19, 2010
What?
JavaScript for PHP Developers - Ed Finkler - tek-X - May 18, 201029
Asynchronous actions
Wednesday, May 19, 2010
Oh!
JavaScript for PHP Developers - Ed Finkler - tek-X - May 18, 201030
Like GUI stuff
Wednesday, May 19, 2010
JavaScript for PHP Developers - Ed Finkler - tek-X - May 18, 201031
Browsers!
Wednesday, May 19, 2010
JavaScript for PHP Developers - Ed Finkler - tek-X - May 18, 201032
Web Runtime Platforms!
Wednesday, May 19, 2010
Dear God
JavaScript for PHP Developers - Ed Finkler - tek-X - May 18, 201033
Widget engines!
Wednesday, May 19, 2010
JavaScript for PHP Developers - Ed Finkler - tek-X - May 18, 201034
Server-side platforms
Wednesday, May 19, 2010
http://nodejs.org/
JavaScript for PHP Developers - Ed Finkler - tek-X - May 18, 201035
Node.js
Wednesday, May 19, 2010
http://narwhaljs.org/
JavaScript for PHP Developers - Ed Finkler - tek-X - May 18, 201036
Narwhal
Wednesday, May 19, 2010
http://code.google.com/p/v8cgi/
JavaScript for PHP Developers - Ed Finkler - tek-X - May 18, 201037
v8cgi
Wednesday, May 19, 2010
Don't quit your day job
JavaScript for PHP Developers - Ed Finkler - tek-X - May 18, 201038
SSJS isn't terribly mature
Wednesday, May 19, 2010
JavaScript for PHP Developers - Ed Finkler - tek-X - May 18, 201039
Syntax
Wednesday, May 19, 2010
Like PHP!
JavaScript for PHP Developers - Ed Finkler - tek-X - May 18, 201040
C/Java-like
Wednesday, May 19, 2010
But they can.
JavaScript for PHP Developers - Ed Finkler - tek-X - May 18, 201041
Variable names don't start with '$'
Wednesday, May 19, 2010
Not dot.
JavaScript for PHP Developers - Ed Finkler - tek-X - May 18, 201042
Concatenation with '+'
Wednesday, May 19, 2010
Not '->'. You will screw this up.
JavaScript for PHP Developers - Ed Finkler - tek-X - May 18, 201043
Dot for members. Or []
Wednesday, May 19, 2010
You will also screw this up.
JavaScript for PHP Developers - Ed Finkler - tek-X - May 18, 201044
Always case-sensitive
Wednesday, May 19, 2010
But you had better always use them
JavaScript for PHP Developers - Ed Finkler - tek-X - May 18, 201045
Semicolons are optional
Wednesday, May 19, 2010
Semicolons!
JavaScript for PHP Developers - Ed Finkler - tek-X - May 18, 201046
CODE TIME
Wednesday, May 19, 2010
"Primitives"
JavaScript for PHP Developers - Ed Finkler - tek-X - May 18, 201047
Data Types
Wednesday, May 19, 2010
Integers and floats
JavaScript for PHP Developers - Ed Finkler - tek-X - May 18, 201048
Numbers
Wednesday, May 19, 2010
Truthy
JavaScript for PHP Developers - Ed Finkler - tek-X - May 18, 201049
Booleans
Wednesday, May 19, 2010
JavaScript for PHP Developers - Ed Finkler - tek-X - May 18, 201050
Strings
Wednesday, May 19, 2010
Not NULL, not Null.
JavaScript for PHP Developers - Ed Finkler - tek-X - May 18, 201051
null
Wednesday, May 19, 2010
Declared, but no value set. Not the same as null
JavaScript for PHP Developers - Ed Finkler - tek-X - May 18, 201052
undefined
Wednesday, May 19, 2010
JavaScript for PHP Developers - Ed Finkler - tek-X - May 18, 201053
That's it.
Wednesday, May 19, 2010
JavaScript for PHP Developers - Ed Finkler - tek-X - May 18, 201054
Other elements
Wednesday, May 19, 2010
MDC: "Named containers for values"
JavaScript for PHP Developers - Ed Finkler - tek-X - May 18, 201055
Objects
Wednesday, May 19, 2010
All objects
JavaScript for PHP Developers - Ed Finkler - tek-X - May 18, 201056
Arrays, Date, RegExp
Wednesday, May 19, 2010
MDC: "Procedures your application can perform"
JavaScript for PHP Developers - Ed Finkler - tek-X - May 18, 201057
Functions
Wednesday, May 19, 2010
Hang on!
JavaScript for PHP Developers - Ed Finkler - tek-X - May 18, 201058
Scope
Wednesday, May 19, 2010
JavaScript for PHP Developers - Ed Finkler - tek-X - May 18, 201059
More bleed than PHP
Wednesday, May 19, 2010
No need for global declaration
JavaScript for PHP Developers - Ed Finkler - tek-X - May 18, 201060
Globals automatically available
Wednesday, May 19, 2010
With or without
JavaScript for PHP Developers - Ed Finkler - tek-X - May 18, 201061
Declaring variables
Wednesday, May 19, 2010
scope maintained
JavaScript for PHP Developers - Ed Finkler - tek-X - May 18, 201062
With var
Wednesday, May 19, 2010
Oops! Automatically global
JavaScript for PHP Developers - Ed Finkler - tek-X - May 18, 201063
Without var
Wednesday, May 19, 2010
window in browsers
JavaScript for PHP Developers - Ed Finkler - tek-X - May 18, 201064
Globals are properties ofglobal object
Wednesday, May 19, 2010
globals!
JavaScript for PHP Developers - Ed Finkler - tek-X - May 18, 201065
CODE TIME
Wednesday, May 19, 2010
This is awesome
JavaScript for PHP Developers - Ed Finkler - tek-X - May 18, 201066
Closures
Wednesday, May 19, 2010
Anything within context of function declaration is fair game
JavaScript for PHP Developers - Ed Finkler - tek-X - May 18, 201067
Using a var from outside function
Wednesday, May 19, 2010
Closures
JavaScript for PHP Developers - Ed Finkler - tek-X - May 18, 201068
CODE TIME
Wednesday, May 19, 2010
Literally
JavaScript for PHP Developers - Ed Finkler - tek-X - May 18, 201069
Literals
Wednesday, May 19, 2010
Right.
JavaScript for PHP Developers - Ed Finkler - tek-X - May 18, 201070
Numbers
Wednesday, May 19, 2010
Yep.
JavaScript for PHP Developers - Ed Finkler - tek-X - May 18, 201071
Booleans
Wednesday, May 19, 2010
Hmmm.
JavaScript for PHP Developers - Ed Finkler - tek-X - May 18, 201072
RegExp
Wednesday, May 19, 2010
Hey there.
JavaScript for PHP Developers - Ed Finkler - tek-X - May 18, 201073
['a','r','r','a','y','s'];
Wednesday, May 19, 2010
Oh snap!
JavaScript for PHP Developers - Ed Finkler - tek-X - May 18, 201074
{object:"literals"};
Wednesday, May 19, 2010
Literals
JavaScript for PHP Developers - Ed Finkler - tek-X - May 18, 201075
CODE TIME
Wednesday, May 19, 2010
JavaScript for PHP Developers - Ed Finkler - tek-X - May 18, 201076
Operators
Wednesday, May 19, 2010
+ , = == === < > ! && ||
JavaScript for PHP Developers - Ed Finkler - tek-X - May 18, 201077
Mostly like PHP
Wednesday, May 19, 2010
JavaScript for PHP Developers - Ed Finkler - tek-X - May 18, 201078
this
Wednesday, May 19, 2010
Remember, no classes in JS
JavaScript for PHP Developers - Ed Finkler - tek-X - May 18, 201079
new
Wednesday, May 19, 2010
Does this key exist?
JavaScript for PHP Developers - Ed Finkler - tek-X - May 18, 201080
in
Wednesday, May 19, 2010
"is X of type Y?"
JavaScript for PHP Developers - Ed Finkler - tek-X - May 18, 201081
instanceof
Wednesday, May 19, 2010
Returns string of core type
JavaScript for PHP Developers - Ed Finkler - tek-X - May 18, 201082
typeof
Wednesday, May 19, 2010
JavaScript for PHP Developers - Ed Finkler - tek-X - May 18, 201083
typeof returnstypeof {} "object"typeof function() {} "function"typeof new Function(); "function"typeof true "boolean"typeof new Date(); "object" // not "date"; use instanceoftypeof [1,2,3] "object" // not "array"typeof NaN "number"typeof null "object"typeof undefined "undefined"
Wednesday, May 19, 2010
JavaScript for PHP Developers - Ed Finkler - tek-X - May 18, 201084
Type conversion
Wednesday, May 19, 2010
Radix is optional, but Douglas Crockford will hate you
JavaScript for PHP Developers - Ed Finkler - tek-X - May 18, 201085
parseInt(val, [radix])
Wednesday, May 19, 2010
Like parseInt, returns NaN if cannot convert
JavaScript for PHP Developers - Ed Finkler - tek-X - May 18, 201086
parseFloat(val)
Wednesday, May 19, 2010
JavaScript for PHP Developers - Ed Finkler - tek-X - May 18, 201087
String(obj)
Wednesday, May 19, 2010
JavaScript for PHP Developers - Ed Finkler - tek-X - May 18, 201088
Number(obj)
Wednesday, May 19, 2010
JavaScript for PHP Developers - Ed Finkler - tek-X - May 18, 201089
Boolean(obj)
http://jibbering.com/faq/notes/type-conversion/
Wednesday, May 19, 2010
JavaScript for PHP Developers - Ed Finkler - tek-X - May 18, 201090
Functions
Wednesday, May 19, 2010
JavaScript for PHP Developers - Ed Finkler - tek-X - May 18, 201091
In the procedural tradition
Wednesday, May 19, 2010
JavaScript for PHP Developers - Ed Finkler - tek-X - May 18, 201092
As objects
Wednesday, May 19, 2010
JavaScript for PHP Developers - Ed Finkler - tek-X - May 18, 201093
As constructors
Wednesday, May 19, 2010
An array, kind of
JavaScript for PHP Developers - Ed Finkler - tek-X - May 18, 201094
Function arguments
Wednesday, May 19, 2010
Fun with functions
JavaScript for PHP Developers - Ed Finkler - tek-X - May 18, 201095
CODE TIME
Wednesday, May 19, 2010
JavaScript for PHP Developers - Ed Finkler - tek-X - May 18, 201096
Objects
Wednesday, May 19, 2010
Or associative arrays
JavaScript for PHP Developers - Ed Finkler - tek-X - May 18, 201097
As hashes
Wednesday, May 19, 2010
JavaScript for PHP Developers - Ed Finkler - tek-X - May 18, 201098
As static modules
Wednesday, May 19, 2010
Objects as modules
JavaScript for PHP Developers - Ed Finkler - tek-X - May 18, 201099
CODE TIME
Wednesday, May 19, 2010
Not a word
JavaScript for PHP Developers - Ed Finkler - tek-X - May 18, 2010100
As instance-able objects
Wednesday, May 19, 2010
Just make the object and have a constructor func
JavaScript for PHP Developers - Ed Finkler - tek-X - May 18, 2010101
No classes
Wednesday, May 19, 2010
No public, private, protected
JavaScript for PHP Developers - Ed Finkler - tek-X - May 18, 2010102
No visibility levels
Wednesday, May 19, 2010
JavaScript for PHP Developers - Ed Finkler - tek-X - May 18, 2010103
Prototypes & inheritance
Wednesday, May 19, 2010
JavaScript for PHP Developers - Ed Finkler - tek-X - May 18, 2010104
Every object has a prototype
Wednesday, May 19, 2010
JavaScript for PHP Developers - Ed Finkler - tek-X - May 18, 2010105
Prototype providesattributes of object
Wednesday, May 19, 2010
JavaScript for PHP Developers - Ed Finkler - tek-X - May 18, 2010106
Modifying prototype changesall objects that use it
Wednesday, May 19, 2010
points to constructor function of object
JavaScript for PHP Developers - Ed Finkler - tek-X - May 18, 2010107
Prototype has .constructor
Wednesday, May 19, 2010
Prototypes and inheritance
JavaScript for PHP Developers - Ed Finkler - tek-X - May 18, 2010108
CODE TIME
Wednesday, May 19, 2010
Kinda suck in JS
JavaScript for PHP Developers - Ed Finkler - tek-X - May 18, 2010109
Dates
Wednesday, May 19, 2010
Almost a necessary evil
JavaScript for PHP Developers - Ed Finkler - tek-X - May 18, 2010110
eval()
Wednesday, May 19, 2010
That again
JavaScript for PHP Developers - Ed Finkler - tek-X - May 18, 2010111
Malleability
Wednesday, May 19, 2010
Cookies???
JavaScript for PHP Developers - Ed Finkler - tek-X - May 18, 2010112
BREAK TIME
Wednesday, May 19, 2010
JavaScript for PHP Developers - Ed Finkler - tek-X - May 18, 2010113
JS in the browser
Wednesday, May 19, 2010
Non-sequential, long-running
JavaScript for PHP Developers - Ed Finkler - tek-X - May 18, 2010114
Execution model
Wednesday, May 19, 2010
JavaScript for PHP Developers - Ed Finkler - tek-X - May 18, 2010115
Single threaded
Wednesday, May 19, 2010
Oh the humanity
JavaScript for PHP Developers - Ed Finkler - tek-X - May 18, 2010116
Browser compatibility
Wednesday, May 19, 2010
Woo wee!
JavaScript for PHP Developers - Ed Finkler - tek-X - May 18, 2010117
DOM APIs
Wednesday, May 19, 2010
Words and pictures and movin' stuff!
JavaScript for PHP Developers - Ed Finkler - tek-X - May 18, 2010118
Elements and events
Wednesday, May 19, 2010
Trust me
JavaScript for PHP Developers - Ed Finkler - tek-X - May 18, 2010119
These are terrible
Wednesday, May 19, 2010
They suck
JavaScript for PHP Developers - Ed Finkler - tek-X - May 18, 2010120
I'm not going to teach you these
Wednesday, May 19, 2010
Basically fixes everything
JavaScript for PHP Developers - Ed Finkler - tek-X - May 18, 2010121
Just use jQuery
Wednesday, May 19, 2010
DOM manipulation and events
JavaScript for PHP Developers - Ed Finkler - tek-X - May 18, 2010122
CODE TIME
Wednesday, May 19, 2010
JavaScript for PHP Developers - Ed Finkler - tek-X - May 18, 2010123
HTTP interaction
Wednesday, May 19, 2010
JavaScript for PHP Developers - Ed Finkler - tek-X - May 18, 2010124
JSON is love
Wednesday, May 19, 2010
JavaScript for PHP Developers - Ed Finkler - tek-X - May 18, 2010125
Use JSON2.js
Wednesday, May 19, 2010
JavaScript for PHP Developers - Ed Finkler - tek-X - May 18, 2010126
Newer browsers havenative implementations
Wednesday, May 19, 2010
Web APIs, woooooooooo!
JavaScript for PHP Developers - Ed Finkler - tek-X - May 18, 2010127
CODE TIME
Wednesday, May 19, 2010
JavaScript for PHP Developers - Ed Finkler - tek-X - May 18, 2010128
Resources
Wednesday, May 19, 2010
<Name of Talk> - <Who> - <Where> - <When>
Resources:Code
129
•SpazCorehttp://github.com/funkatron/spazcore
•Underscore.jshttp://documentcloud.github.com/underscore/
•http://delicious.com/funka7ron/javascript
Wednesday, May 19, 2010
JavaScript for PHP Developers - Ed Finkler - tek-X - May 18, 2010130
Resources:Web
•Mozilla Dev Center: Code JavaScript Guidehttps://developer.mozilla.org/en/Core_JavaScript_1.5_Guide
•Mozilla Dev Center: Core JavaScript Referencehttps://developer.mozilla.org/en/Core_JavaScript_1.5_Reference
•Eloquent JavaScripthttp://eloquentjavascript.net/
•comp.lang.javascript FAQhttp://jibbering.com/faq/
•Nicholas C. Zakas' Bloghttp://www.nczonline.net/
•John Resig's Bloghttp://ejohn.org/
•http://wtfjs.com/
Wednesday, May 19, 2010
JavaScript for PHP Developers - Ed Finkler - tek-X - May 18, 2010131
Resources:Books
•JavaScript: The Definitive GuideDavid Flanagan
•JavaScript: The Good PartsDouglas Crockford
•High-Performance JavaScriptVarious
Wednesday, May 19, 2010
JavaScript for PHP Developers - Ed Finkler - tek-X - May 18, 2010132
References
Wednesday, May 19, 2010
JavaScript for PHP Developers - Ed Finkler - tek-X - May 18, 2010133
References
•Mozilla Dev Center: Core JavaScript Guide•Eloquent JavaScript
Wednesday, May 19, 2010