ydkjs-summary.md

Scope

• It's where to look for things.
• Javascript has function scope only.
• There are 2 predominant modules:
  • Lexical scope: building example - goes up one level looking for there. The top of the building is the global scope
  • Dynamic scope: this example. Moves to any level of the building as if it were looking for an address.
• Cheating scope: eval and with (bad mechanisms, avoid it).

IIFE Pattern

var foo = "foo";
(function(){
  var foo = "foo2";
  console.log(foo); // "foo2"
})();
console.log(foo);  // "foo"

var foo = "foo";
(function(bar){
  var foo = bar
  console.log(foo); // "foo"
})(foo);
console.log(foo);  // "foo"

This

Every function while executing, has a reference to its current execution context, called this.

What determines which object a function's this points to? What's the default?

There are 4 rules for how the this keyword gets bound and they all depend on the call side (place in code where a function gets executed ()) in order of precedence from higher they are:

• new keyword
• Explicit binding (call, apply or bind)
• Implicit binding (owning or containing object o2.foo())
• Default rule (foo())

What happens when the new keyword is written?

• Brand new object gets created
• Object gets linked
• The context it set to the this
• It returns this

How can you seal a specific this to a function? Why do that? Why not?

• The .bind utility
• Why do that? hard binding, if you want to be predictable, you always want your methods to go to a particular object
• Tradeoff is the flexibility
• If you find yourself using bind all the time think about why you're even using this.

How do you create a new this?

• Using the new keyword.

Closures

What is a closure and how is it created?

• Is when a function remembers and accesses its lexical scope even when that function is executed ouside of its lexical scope
• It's created when an inner function is transported outside of the outer function.

How do you use a closure to create an encapsulated module? What's the benefits of that approach?

• Has to be an outer functions, return one or more inner functions that are closure of the scope.
• Benefitial for hiding stuff, not exposing inner details.

Examples

function foo(){
  var bar = "bar";
  return function() {
    console.log(bar);
  };
}

function bam(){
  foo()(); // "bar"
}

bam();

function foo(){
  var bar = "bar";
  setTimeout(function() {
    console.log(bar);
  }, 1000);
}

foo();

function foo(){
  var bar = "bar";
  
  $("#btn").click(function(evt){
      console.log(bar);
  });
}

foo();

Module pattern

Classic module pattern

var foo = (function(){
  var o = { bar : "bar" };
  return {
    bar: function(){
      console.log(o.bar);
    }
  };
})();
foo.bar();

Modified module pattern

var foo = (function(){
  var publicAPI = { 
    bar: function(){
      publicAPI.baz();
    }, 
    baz: function(){
      console.log("baz");
    }
  };
  return publicAPI;
})();
foo.bar();

Modern module pattern

define("foo", function(){
  var o = { bar: "bar" };
  return {
    bar: function(){
      console.log(o.bar);
    }
  };
});

Object orienting

Prototype

• Every single "object" is built by a contructor function
• A constructor makes an object linked to its own prototype