Giter Club home page Giter Club logo

js-overview's Introduction

!SLIDE

JavaScript

the little language everyone loves to hate

!SLIDE

moi

!SLIDE

The Highlights

  • interpreted, scripting language
  • weakly (bad-duck) typed
  • single-threaded
  • first-class functions
  • prototypal inheritance

!SLIDE

The History

  • designed in a week by Brendan Eich for Netscape
  • inspired by Self and Scheme, not Java
  • server-side since 1994, popularized by Node.js
  • "JavaScript" trademark owned by Sun, so formal name is "ECMAScript"

!SLIDE

The Browser Wars

  • started in late 90's as IE replaced Netscape
  • huge leaps in JS VM speed

!SLIDE

speed chart

iq12.com/old_blog/as3-benchmark/

!SLIDE

Types

  • primitives (pass by value)
    • string
    • boolean
    • number
  • objects (pass by reference)
    • objects
    • arrays
    • functions

!SLIDE

Numbers

  • the only numeric datatype
  • floating point! (not "hardcore")

!SLIDE

Functions

First-class!

@@@javascript
var myFun = function(){
  return 'foo';
};
myFun(); // 'foo'

var otherRef = myFun;
otherRef(); // 'foo'

!SLIDE

Evented

@@@javascript
var elements = $('.submit');
elements.on('click', function(){
  alert('Thanks for buying!');
});

!SLIDE

Scope

Functional, not block-level (C-style)

@@@javascript
if (true) {
  var foo = 6;
}

foo; // 6

!SLIDE

Scope (cont.)

@@@javascript
var outer = function(){
  var foo = 6;
  var inner = function(){
    return foo;
  };

  inner(); // 6
};

!SLIDE

Closures

@@@javascript
var wrapper = function(){
  var foo = 6;
  var inner = function(){
    return foo;
  };
  return inner;
};

var wrapped = wrapper();
wrapped(); // 6

.notes show binding of context?

!SLIDE

Context

@@@javascript
var myVariable = "I'm global!";

function printMyVariable(){
  return this.myVariable;
}

printMyVariable(); // "I'm global!"

printMyVariable.apply({ myVariable: "I'm local!" }); // "I'm local!"

.notes too detailed?

!SLIDE

Fake OOP

@@@javascript
var Person = function(first, last){
  this.first = first;
  this.last = last;
};

var bob = new Person('Bob', 'Hope');
var sally = new Person('Sally', 'Field');

bob.first; // 'Bob'

!SLIDE

Namespacing

!SLIDE

Namespacing

nope.

!SLIDE

Namespacing

@@@javascript
var app = {}; // global
app.views = {};
app.views.sidebar = {};

!SLIDE

Transpiling

  • CoffeeScript
  • TypeScript

!SLIDE

Coming Up

!SLIDE

Coming Up

ES6

  • Object.observe
  • modules
  • getters and setters
  • generators

!SLIDE

Coming Up

asm.js

demo

!SLIDE

Frameworks

!SLIDE

Frameworks

Utilities

  • jQuery
  • Underscore

!SLIDE

Frameworks

Basic MVC

  • Backbone
  • Spine

!SLIDE

Frameworks

Data Binding

!SLIDE

Frameworks

UI

  • Sproutcore
  • jQuery UI
  • jQuery Mobile
  • Bootstrap

!SLIDE

See Also

!SLIDE

Fin.

Aidan Feldman

@aidanfeldman

api.afeld.me

js-overview's People

Contributors

afeld avatar

Watchers

 avatar Mike Selender avatar James Cloos avatar  avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.