Pradeep Pradeep - 4 months ago 13
AngularJS Question

using memoize function with underscore.js

I am trying to cache the result from an ajax call using

memoize
function from
Underscore.js
. I am not sure of my implementation. Also how to retrieve back the cached result data using the key. Below is my implementation:

Javascript code:

var cdata=$http.get(HOST_URL+"/v1/report/states").
success(function (data){
//put the result in the angularJs scope object.
$scope.states=data;
});
//store the result in the cache.
var cachedResult=_.memoize(
function(){
return cdata;
}, "states");


Is my usage of memoize to store the result of ajax is correct. Also once it is put in cache, how to retrieve based on the key. i.e 'states'.

Answer

Let us understand how _.memoize works, it takes a function which needs to be memoized as first argument and caches the result of the function return for given parameter. Next time if the memoized function is invoked with same argument it will use cached result and the execution time for the function can be avoided. So it is very important to reduce the computation time.

As mentioned, the above fibonaci function it memoized works perfectly fine as the argument has a primitive type.

The problem occurs when you have to memoize a function which accepts an object. So _.memoized can accepts an optional argument hashFunction which will be used to hash the input. The default implementation is it returns the first argument as it is.

So for e.g.

var fn = function (obj){ some computation here..}
var memoizedFn = _.memoize(fn);

memoizedFn({"id":"1"}) // we will get result, and result is cahced now

memoizedFn({"id":"2"}) // we will get cached result which is wrong

why default has function in _.memoize is function(x) {return x}

the problem can be avoided by passing a hash function

_.memoize(fn, function(input){return JSON.stringify(input)});

This was a real help for me when I was using _.memoize for a function that was working on arrays arguments.

Hope this helps many people in their work.