JSFiddle

  • Array methods

    There are a few.

    var composers = new Array();
    
    // Add new items to the end of the array.
    composers.push("Berlioz", "Couperin");
    composers.push("Durufl ...
  • Sort the array #6 is the latest revision

    Sort them! Do it!

    var composers = new Array("Berlioz", "Albinoni", "Couperin");
    
    for (var i=0; i<composers.length; ++i) {
        $("#string-nosort").append("<li>" + composers[i] + "</li>");
    }
    
    composers.sort();
    
    for (var i=0 ...</composers.length;>
  • Dynamically resize array

    What happens if I dynamically resize an array and then loop through its elements?

    // Make an array and give it some data.
    var composers = new Array(3);
    composers[0] = "Tchaikovsky";
    composers[1] = "Holst";
    composers ...
  • Different ways to iterate

    for, for...if, forEach, and for var of.

    var dogs = ["Bradley","Lucy","Tyler"];
    var dogsLength = dogs.length;
    
    for (var i=0; i<dogsLength; ++i) {
        $("#for-results").append("<li>" + dogs[i] + "</li>");
    }
    
    for (var i=0 ...</dogslength;>
  • Use var or not.

    Create an object or just run a function.

    var pollution = function () {
        document.getElementById("withVar").innerHTML += "This is using <code>var</code>.";
        return "Test value.";
    };
    
    (function () {
        document.getElementById("sansVar").innerHTML += "This ...
  • Pollution

    Don't pollute the global namespace. Or the air.

    var pollution = (function () {
        var Calculate = function (a, b) {
            return a * b;
        };
        $("#btnCalc").click(function() {
            $("#calculation span.results").text(Calculate($("#txtA ...
  • Geolocation and local storage

    It's two demos in one.

    // Get our position.
    GeoLocate();
    
    // Load any data already in storage.
    LoadFromStorage();
    
    // I believe the anonymous function keeps geoPlaceholder out of ...
  • Click and move

    Yeah, it's not that cool.

    document.getElementById("click").onclick = function () {
        // this with plain JavaScript.
        this.innerHTML = "Eat cake!";
        // We can use this in jQuery also ...
  • JavaScript namespaces

    They're actually more useful than this demo lets on.

    var com = {};
    com.fatherofsamwise = {};
    com.fatherofsamwise.person = {
        name: 'Jeremy',
        food: 'pizza'
    };
    
    document.getElementById("click").onclick = function () {
        var personName = com.fatherofsamwise ...
  • Labels and placeholders

    This is actually a bad example because labels and placeholders are not semantically interchangeable.

    $(document).ready(function() {
        if (("placeholder" in document.createElement("input"))) {
            $(".noplaceholder").css("display", "none");
        }
    });