akshaye

40

akshaye

Keane

Silenced by the night
Disconnected
Sovereign Light Cafe

[Strangeland] (https://www.youtube.com/watch?v=Ehr9PCFpyA0)

The Killers

akshaye

When, in special circumstances, we want to prevent a function from being called too often:
Throttling - additional calls to the function are ignored for next n ms.
Debouncing - any call to the function is delayed till n ms have passed since the last call.

Both of these are easy to implement by creating meta-functions that return a wrapped version of original function:

function throttle(func, delay) {
  var lastHitDate = 0;
 return function() {

akshaye

Functions run in global scope ie. this points to global scope. Methods are functions in an object's directory and we invoke them using object reference ie. this points to the object on which the function is invoked.

It's important to understand that methods are still functions and can be invoked without object reference.

var x = 0;

var obj = { 
  a : function() { 
 console.log('hello ' + this.x); 

akshaye

A promise represents an ongoing task that may either succeed or fail.

Promises and Deferreds

A promise exposes methods to attach handlers but not ones that change the state. Deferred is a superset of Promise - with methods to change its state. Idea is to create a Deferred and then pass its Promise around the app, which is available by calling Deferred.Promise() method. This prevents other pieces from interfering with its state while enabling them to perform any action in response to change in deferred. All Ajax functions in jQuery return Promises, starting from v1.5.

resolve -> done
reject -> fail
notify -> progress

akshaye

Distributed events - where a single incident can trigger reactions throughout your application.

PubSub

It works like an aggregator; publishing one event to anyone who wants to subscribe. For example, Node's EventEmitter, jQuery's bind-like functions etc.

" Though PubSub deals with async events, there's nothing inherently async about it. Understand: When user clicks a button, that's an async event, which gets pushed to event queue and is subsequently fired by the runtime. But everything that happens as a result of that event is synchronous. All the handlers attached to that event fire in sequence, one after the other. This is important to understand because if too many handlers fire in resposne to an event, you risk blocking the thread and making the browser unresponsive. "

akshaye

1 Async output

JavaScript output is almost always async. For instance, you can make multiple updates to DOM, but user won't see any changes until control returns to event queue. implicitly, any change you make queues a 'redraw' event.

2 Not all async behavior is obvious

For example, in webkit based browsers, console.log is async:

(function(){

akshaye

#JavaScript by nature is synchronuous.

If you call a function, your program can't continue till that function returns. An async function in JavaScript is simply a function that takes a callback which will not be executed till it returns, i.e. till we reach the event queue. Non-blocking functions is perhaps a better term for their behavior.

For foo to be async, it needs to pass the following test:

var a = false;
foo(function() { console.assert(a, 'a should be true'); })
a = true

akshaye

JavaScript events are blocked until the thread is free.

Whenever an event fires, it gets queued. And this queue is processed only when (single) thread is free.

JavaScript runtime works as an event loop:

RunScript();
while(atleastOneEventIsQueued)
  fireNextQueuedEvent();

akshaye

##Elegant

In Javascript, following code

function(x) { return foo(x); }

is equivalent to just writing foo.