joshblack

<div class="foo"></div>

<script>
  document.querySelectorAll('.foo').addEventListener('click', function() {
    console.log('You clicked me!');
  });

  // Or in jQuery
  $('.foo').on('click', function() {
    console.log('You clicked me!');

joshblack

<ul>
  <li>1</li>
  <li>2</li>
  <li>3</li>
  <li>4</li>
  <li>5</li>
  <!-- ... -->
</ul>

<script>

joshblack

<ul>
  <li>1</li>
  <li>2</li>
  <li>3</li>
  <li>4</li>
  <li>5</li>
  <!-- ... -->
</ul>

<script>

joshblack

function addSecretSalt() {
  var secret = "JS Rules!";

  return function(salt) {
    return secret + salt;
  }
};

// Usage
var secretAndSalt = addSecretSalt('salted'); // "JS Rules!salted"

joshblack

var fs = require('fs');

fs.readFileAsync('foo.txt', function(buffer) {
  var fileContents = buffer.toString();
  // do stuff!
});

joshblack

// Using jQuery...
$('.foo').on('click', function() {
  // do stuff!
});

joshblack

var MODULE = {};

MODULE.submodule = (function() {
  function init() {
    console.log('initiated!');
  };

  return {
    init: init
  };

joshblack

// Composition

function add(x) {
  return function(y) {
    return x + y;
  };
};

// Usage
add(1)(2); // 3

joshblack

function foo() {};

foo.call(thisArg, arg1, arg2, arg3, /* ... */);
foo.apply(thisArg, [arg1, arg2, arg2, /* ... */]);

joshblack

function foo() {
  console.log(x); // undefined
  var x = 1;
  console.log(x); // 1
};

// What actually happens under the hood

function foo() {
  var x;