1. Javascript
The Basics
WOODIWISS.ME
Freelance Web Developer & Lecturer
in the Winchester, Hampshire area.

2. What’s covered
•
What is JavaScript
•
Comments
•
JavaScript in a Browser
•
Data Types
•
Variables
•
Functions
•
Statements
•
Scope
WOODIWISS.ME

3. What is JavaScript
•
Lightweight Scripting
Language.
•
Interpreted.
•
Object Orientated.
•
Prototype-based.
WOODIWISS.ME

4. Easy to pick up.
difficult to master.
WOODIWISS.ME
Freelance Web Developer & Lecturer
in the Winchester, Hampshire area.

5. ECMA
What/Who is ECMA?
WOODIWISS.ME

6. ECMA
What/Who is ECMA?
•
European Computer Manufacturers Association.
WOODIWISS.ME

7. ECMA
What/Who is ECMA?
•
European Computer Manufacturers Association.
•
Non-profit Standards Organisation.
WOODIWISS.ME

8. ECMA
What/Who is ECMA?
•
European Computer Manufacturers Association.
•
Non-profit Standards Organisation.
•
Introducing ECMAScript!
WOODIWISS.ME

9. ECMAScript
Language
ECMAScript.es
Dialects
JavaScript.js
WOODIWISS.ME
ActionScript.as

10. So what can
javascript do?
WOODIWISS.ME
Freelance Web Developer & Lecturer
in the Winchester, Hampshire area.

11. Hardware Programming
•
Arduino via NodeJS
framework.
•
Tessel - micro-controller that
runs JavaScript.
•
Uniduino - gives you the
power to connect the Unity
game engine to Arduino.
•
Control peripherals e.g.
GamePads.
WOODIWISS.ME

12. Create Hybrid Apps
•
PhoneGap - iOS, Android,
Blackberry, Windows Phone
& more.
•
TideSDK - Windows, OSX,
Linux.
•
Icenieum - Windows, Web,
iOS.
•
Chrome Apps.
WOODIWISS.ME

13. Server Side
•
Nodejs
•
Among others…
WOODIWISS.ME

14. Client Side
•
Vanilla JavaScript in a browser.
•
jQuery - simplify client side
scripting.
•
Zepto - Lightweight jQuery
alternative.
•
Three.js - 3D graphics on the
web.
•
AngularJS - SPA framework.
•
jQuery Mobile - Touch
optimised.
WOODIWISS.ME

15. In the Browser
•
Lets look at some Developer tools.
•
Firefox - Firebug.
•
Chrome - Web Developer Tools.
•
Internet Explorer - Developer ToolBar.
•
Opera - Dragonfly.
WOODIWISS.ME

16. Variables
•
Used to store data.
•
Single line style.
•
Multiline.
•
Typically must begin with a
letter ( $ and _ are valid )
•
Case sensitive.
•
Over-writable - dynamic.
WOODIWISS.ME

17. Statements
•
The end of a command.
•
Tells the interpreter (browser)
that your intention is finished.
WOODIWISS.ME

18. Comments
•
Helpful notes.
•
Good for debugging.
•
Working with others.
•
Don’t overuse.
WOODIWISS.ME

19. Data Types
•
Primary
!
•
•
“Hello” - “” - “1984” - “TRUE”
•
Number
•
19 - 19.333
•
•
String
Boolean
•
true - false
•
var car = { myCar: “Saturn", getCar:
CarTypes("Honda"), special: Sales };
•
var coffees = ["French Roast", "Colombian", "Kona"];
•
Object
•
•
!
Composite
Array
Special
•
Special
•
Null
•
null, 0, false.
•
Undefined
•
undefined value.
WOODIWISS.ME

20. Functions
WOODIWISS.ME

21. Calling / Invoking
Line 12
WOODIWISS.ME

22. WOODIWISS.ME

23. WOODIWISS.ME

24. Define with arguments.
WOODIWISS.ME

25. Define with arguments.
WOODIWISS.ME

26. Define with arguments.
Call with arguments.
WOODIWISS.ME

27. Define with arguments.
Call with arguments.
WOODIWISS.ME

28. Define with arguments.
1
Call with arguments.
WOODIWISS.ME

29. Define with arguments.
1
Call with arguments.
WOODIWISS.ME

30. Define with arguments.
1
Call with arguments.
WOODIWISS.ME

31. Define with arguments.
1
1
Call with arguments.
WOODIWISS.ME

32. Define with arguments.
1
1
Call with arguments.
WOODIWISS.ME
1

33. Define with arguments.
1
1
Call with arguments.
WOODIWISS.ME
1

34. Define with arguments.
1
10
1
Call with arguments.
WOODIWISS.ME
1

35. Define with arguments.
1
10
1
Call with arguments.
WOODIWISS.ME
1

36. Define with arguments.
1
10
10
1
Call with arguments.
WOODIWISS.ME
1

37. Scope
WOODIWISS.ME

38. WOODIWISS.ME

39. WOODIWISS.ME

40. WOODIWISS.ME

41. WOODIWISS.ME

42. Links / Research
•
https://developer.mozilla.org/en-US/docs/Web/JavaScript
•
https://developer.mozilla.org/en/learn/javascript
•
http://www.creativebloq.com/web-design/things-you-didnt-know-javascript-could-do-6122835
•
http://tessel.io/
•
http://www.uniduino.com/
•
https://wiki.mozilla.org/GamepadAPI
•
http://www.tidesdk.org/
•
http://www.icenium.com/?
utm_source=html5weekly&utm_medium=banner&utm_campaign=html5weeklynewsletter&utm_content=link1
•
http://developer.chrome.com/apps/about_apps.html
•
http://nodejs.org/
•
http://en.wikipedia.org/wiki/List_of_JavaScript_libraries
•
http://mothereff.in/js-variables
•
https://developer.mozilla.org/en-US/docs/Web/JavaScript/Guide/Values,_variables,_and_literals
WOODIWISS.ME

43. Questions?
WOODIWISS.ME
Freelance Web Developer & Lecturer
in the Winchester, Hampshire area.