• Save
JavaScript Intro
Upcoming SlideShare
Loading in...5
×

Like this? Share it with your network

Share

JavaScript Intro

  • 1,419 views
Uploaded on

Introduction to JavaScript, an ubiquitous, modern computer language.

Introduction to JavaScript, an ubiquitous, modern computer language.

More in: Technology
  • Full Name Full Name Comment goes here.
    Are you sure you want to
    Your message goes here
    Be the first to comment
No Downloads

Views

Total Views
1,419
On Slideshare
1,417
From Embeds
2
Number of Embeds
2

Actions

Shares
Downloads
0
Comments
0
Likes
1

Embeds 2

http://www.linkedin.com 1
https://www.linkedin.com 1

Report content

Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
    No notes for slide

Transcript

  • 1. JavaScript The Ubiquitous LanguageFriday, June 24, 2011
  • 2. What Is It? How Can I Use It? JavaScript Why Should I Care? How Does It Work?Friday, June 24, 2011
  • 3. What Is JavaScript? A quick survey of what it is and isnt.Friday, June 24, 2011
  • 4. Influences • Invented by Brendan Eich in 1995 • Initially no one took it seriously • Resembles the earlier NewtonScript in many ways • Designed to work well within a constrained environment • "Feels" a little like Python, but different, too • C inspired syntaxFriday, June 24, 2011
  • 5. Whats In A Name? • Mocha, LiveScript, & EcmaScript YES • JScript & ActiveScript SORT OF • JQuery NOT REALLY • Java NO • The "J" in both AJaX and JSONFriday, June 24, 2011
  • 6. Present Realities • Not just for browsers. • Its a full-featured, general-purpose language. • Its a modern interpreted language. • Good support for object-oriented paradigms. • Also good support for functional programming. • And even aspect-oriented or genetic programming.Friday, June 24, 2011
  • 7. Why JavaScript? Why should I learn this thing anyway?Friday, June 24, 2011
  • 8. Its Ubiquitous • Its rough start kept it from being a target, and it had time to spread everywhere. • Historically it is unmatched. • Its on every mainstream browser. • There are many stand-alone engines. • There are a handful of server-side systems. • Its even embedded in things like PDF and Flash.Friday, June 24, 2011
  • 9. The Browser Situation • Fighting for the top spot: • Chrome • Safari • Firefox • Also quite good: • Opera • It exists: • Microsoft Internet ExplorerFriday, June 24, 2011
  • 10. The Open Engine Situation • Also driven by competition. • Three contenders for top spot: • V8 • JavaScriptCore • SpiderMonkey • Other options are available: • Rhino • K7Friday, June 24, 2011
  • 11. The Server Situation • Less competitive than browsers and engines. • All rely on the open engines. • One big player: • Node • Others of note: • Narwhal • FlusspferdFriday, June 24, 2011
  • 12. The Toolkit Situation • Many frameworks and toolkits are built on top of JavaScript: • Dojo • JQuery • Prototype • MooTools • YUI • ExtJSFriday, June 24, 2011
  • 13. The Overall Situation • Initially seen as a toy, it was left alone and it matured. • Many modern implementations do JIT compilation. • Its already quite fast and efficient. • Several big companies have stakes in it. • Its driven by competition and getting better & better. • Its poised to become the most popular computer language the world has yet seen.Friday, June 24, 2011
  • 14. What’s the Syntax Like? What are the technical details of the language?Friday, June 24, 2011
  • 15. The Basics • Operators, loops, and conditionals similar to C • But, variables are dynamically typed • "Optional" semicolons (never omit them) • "Optional" var keyword (never omit it)Friday, June 24, 2011
  • 16. Simple Variable Types • Booleans • Numbers • Predefined constants: • true • false • undefined • Infinity •NaNFriday, June 24, 2011
  • 17. Arrays • Used for holding ordered items. • Items need not be of the same type or even scalar. • Indexing syntax works as expected and is zero-based: a[1]=1 for [0,1,true] • A length property is maintained: a.length is 3. • Not for associative arrays.Friday, June 24, 2011
  • 18. Text • Strings • Similar to arrays • Many built-in methods • Literals: val and "val" • Regular Expressions • Support most popular expressions • Literals: /pattern/flagsFriday, June 24, 2011
  • 19. Objects • Used for holding named items. • Items need not be of the same type or even scalar. • Item keys dont need quotes. • Support array indexing. • Use for associative arrays. • Predefined sentinel null is distinct from {}.Friday, June 24, 2011
  • 20. Dates • JavaScript provides a pre- defined Date object. • It holds a full timestamp, not just a date. • It supports a few different constructor signatures. • It features lots of methods to work with individual parts.Friday, June 24, 2011
  • 21. Math • The global Math object provides many basic mathematical functions and constants. • Math.abs, Math.ceil, Math.floor, Math.round, Math.log, Math.exp, Math.max, Math.min, Math.sin, Math.cos, Math.tan, Math.sqrt, Math.random, etc. • Math.PI, Math.E, Math.SQRT2, Math.LN2, Math.LN10, etc.Friday, June 24, 2011
  • 22. Functions • Functions are full-class citizens in JavaScript. • Functions can be passed into other functions. • Functions can return functions. • Partials, curries, closures, etc. are all good. • Anonymous functions are fine. • Functional programming, à la LISP, but without all the parentheses.Friday, June 24, 2011
  • 23. Friday, June 24, 2011
  • 24. Scope • Scope is defined only by function blocks. • Closures can sometimes be surprising to those not used to them. • Anonymous functions are often used to control scope. • Enclosing scopes are also searched.Friday, June 24, 2011
  • 25. Objects Revisited • The combination of first-class functions and associative arrays leads to "real" objects. • Members may be public or private. • All JavaScript objects inherit from a base Object. • Object inheritance is a little different from what may be familiar...Friday, June 24, 2011
  • 26. Inheritance • JavaScript uses differential inheritance (a variation of prototypal inheritance) • There are no classes. • No "protected" equivalent. • Objects inherit from similar objects and declare differences. • Links to prototypes are preserved.Friday, June 24, 2011
  • 27. How Does One Use JavaScript? What about debuggers and environments?Friday, June 24, 2011
  • 28. Different Environments, Different Debuggers • All the command-line examples in this presentation were entered live into node. • It can also be used for running scripts. • Most modern browsers also have their own environments for inspecting JavaScript and even trying code live. • These environments vary greatly in quality; in particular, dont expect too much in the mobile world.Friday, June 24, 2011
  • 29. Firefox (Firebug) The first really good offering.Friday, June 24, 2011
  • 30. Safari & Chrome (Web Inspector) Keeps pressure on Firefox & Firebug.Friday, June 24, 2011
  • 31. Opera (Dragonfly)Friday, June 24, 2011
  • 32. MSIE (Developer Tools) First packaged with version 8. The Developer Toolbar is available for prior versions.Friday, June 24, 2011
  • 33. Where Can I Learn More? A short list of selected references.Friday, June 24, 2011
  • 34. A Few Sites of Interest • shouldilearnjavascript.com • developer.mozilla.org/en/JavaScript • dojotoolkit.org • nodejs.org • npmjs.org • getfirebug.com • trac.webkit.org/wiki/WebInspector • opera.com/dragonfly/ • msdn.microsoft.com/library/dd565622Friday, June 24, 2011