I have a function HelloWorld where no promises is returned to the caller. I wonder if it is possible to have this function to adjust to return a promise.
For example:
function HelloWorld() {
// Do something here
return;
}
And in another function of my application I would like to do:
...
return HelloWorld()
.then( ... do something else here ... );
How to proceed to have this function return a promise?
function HelloWorld() {
var deferred = $.Deferred();
// demo
setTimeout(deferred.resolve, 1000);
// this is what you return:
return deferred.promise();
}
In HelloWorld :
var dfr = $.Deferred();
//some work with it
return dfr.promise();
Related
I am chaining multiple asynchronous function calls using promises and the Q js library. My current code looks like this:
function user() {
getID()
.then(getName);
}
function getID() {
var deferred = Q.defer();
asyncCall(arg, function(data) {
deferred.resolve(data);
});
return deffered.promise;
}
function getName(ID) {
var deferred = Q.defer();
asyncCall2(arg, function(data) {
deferred.resolve(data);
});
return deffered.promise;
}
I am trying to call user() from a different location and have it return the result of getName but am not sure how to do this.
just return the value (which is a promise itself):
function user() {
return getID().then(getName);
}
and later you can use it as the rest of your code:
user().then(function(result) {});
1 the value can not change in promise
for example
var t = function(s) {
var wait = function(dtd) {
var dtd = $.Deferred();
//new a Deferred object in function
var tasks = function() {
alert("complete!");
s = s + "hhh";
dtd.resolve(s); // change the state of deferred object
};
setTimeout(tasks, 5000);
// return promise object
return dtd.promise(s);
};
}
var s = "hhh";
$.when(t(s))
.then(function() {
alert(s);
}).then(function() {
alert(s);
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.0.0/jquery.min.js"></script>
I can only got "hhh" instead of "hhhhhh"...
2
How to invoke promise chain with different values?like a.then(b(c)).then(f(d))
I put all values in a object and then pass it on chain...
The alert in your $.when is alerting the global variable not the resolve in tasks
Also , you never call wait() and tasks() doesn't return anything.
The return of the promise only returns to wait() which never gets called. Returning to the inner function does not return to the outer function
Also you have no arguments in then() to receive the resolved data.
In order to get data to the second then, you need to return something from the first one
var t = function (s) {
var wait = function () {
var dtd = $.Deferred();
//new a Deferred object in function
var tasks = function () {
alert("complete!");
s = s + "hhh";
dtd.resolve(s); // change the state of deferred object
};
setTimeout(tasks, 2000);
// return promise object
return dtd.promise();
};
// return the promise inside `wait`
return wait()
}
var s = "hhh";
$.when(t(s)).then(function (resolvedData) {
// return to the next then...just because we can
return resolvedData; // must return something if want to access it in next then
}).then(function(previousThenData) {
alert(previousThenData);// alert argument
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.0.0/jquery.min.js"></script>
I need to do this: browser have to make N requests to the server, requests mustn't be async, next requests are starting after previous requests will stop.
I can write some function A with for i < N i++ and calling this function A again recursively to do this, but it is not beautifull at all. Also, this called callback hell. I want some more beautifull solution.
I found deffered objects. Some says, it can help me to escape callback hell. I want something like this. setTimeout there is imitate one async request:
function foo1(some) {
debugger;
setTimeout(function foo1async() {
debugger;
deffered.resolve();
}, 500);
return deffered.promise;
}
function foo2(some) {
debugger;
setTimeout(function foo2async() {
debugger;
deffered.reject();
}, 500);
return deffered.promise;
}
function foo3() {
debugger;
setTimeout(function foo3async() {
debugger;
deffered.resolve();
}, 500);
return deffered.promise;
}
var deffered;
function doChain() {
debugger;
deffered = $q.defer();
var promise = deffered.promise;
promise.then(foo1);
promise.then(foo2);
promise.then(foo3);
promise["finally"](function () {
debugger;
});
deffered.resolve();
}
I expect foo1 to be called, then foo1async will be called and resolve deffered object.
foo2 must be called, then foo2async is called.
3.Now I expect, that foo3 wouldn't start, because deffered is rejected in foo2async. After that I expect foo in finally section called.
Actually, I have this:
foo1, foo2 and foo3 are called. Then foo in finally section called. Then foo1async, foo2async and foo3async funtions are called.
How I can get what I am expecting?
Actually, I will have something like this:
for(var i = 0; i < N; i++) {
(function (iter) {
promise.then(function () {
foo(iter);
});
})(i);
}
You got a few things wrong here.
First, you use a deferred to convert a callback-based async function into a promise-based - but each one needs its own deferred.promise and thus its own deferred. Actually, I prefer to use the $q constructor instead:
function fooN(input){
return $q(function(resolve, reject){
setTimeout(function(){
resolve(input + "; some more data");
}, 500);
});
}
(you could use var deferred = $q.defer() as well)
fooN now returns a promise, so you don't need to use $q.defer() anymore.
In fact, if the async function already was promise-based, like $timeout or $http, then you wouldn't have needed a deferred at all, for ex:
function fooN(input){
return $timeout(function(){
return input + "; some more data";
}, 500);
})
So, let's assume that foo1, foo2 and foo3 are implemented like fooN - all returning promises.
To make the calls sequential, you would need to chain promises - not to attach multiple handlers to the some root promise.
I'll break it down for you:
function doChain(){
var foo1Promise = foo1();
var foo2AfterFoo1Promise = foo1Promise.then(foo2);
var foo3AfterFoo2Promise = foo2AfterFoo1Promise.then(foo3);
var promise = foo3AfterFoo2Promise.then(function(finalData){
return doSomeProcessing(finalData); // if needed
});
promise.catch(function(error){
// "rethrow", if can't handle
return $q.reject({msg: "Some error occurred"});
})
return promise;
}
Or, the same, more concise:
function doChain(p){
return foo1(p)
.then(foo2)
.then(foo3)
.then(function(finalData){
return doSomeProcessing(finalData);
})
.catch(function(error){
return $q.reject({msg: "Some error occurred"});
});
}
A "promised" return value of each function is an input to the next chained function.
You can use $q.all method. For instance:
var promises = [promise1, promise2, ...];
$q.all(promises).then(function () {
// do something
});
What happens now is that all foo* promises depend on the single promise; when it gets resolved all are triggered. In ASCII art the dependencies are:
┎ foo1
promise ╁ foo2
┖ foo3
What you want is:
function doChain() {
foo1()
.then(foo2)
.then(foo3)
;
}
No need for the extra promise. No callback hell either!
How do i get deferre.resolve from a function?
my Controller calls this:
service.getData().then(function(response){ //myFunc deferred response});
in Service:
var _getData = function (){
$http.get(url).success(function(response){
deferred.resolve(_myFunc(response.Message)); // or just myFunc doesnt matter
});
return deferred.promise; //it returns in the end of the function
}
and myFunc has also:
$http.get(url).success(function(response){
deferred.resolve(response);
});
return deferred.promise; // also my Func is returning
so i need the deferred resolve of myFunc, which is called in another func which is called in my controller.. and display it there
EDIT
I have return deferred.promise BUT it returns ONLY the first promise of the SERVICE function not myFunc, and i need the promise of myFunc
EDIT 2
Look also at Carson Drake's answer, it isn't anti-pattern!
You can actually reduce the two into one chained call if you want to simplify if.
var _getData = function(){
return $http.get(url).then(function(response1){
return $http.get(response1.data);
}).then(function(response2){
return response2;
});
UPDATE
Plunkr
You need to return defer.promise from the service of factory(whatever you are using)
var _getData = function (){
var deferred = $q.defer();
$http.get(url).success(function(response){
deferred.resolve(_myFunc(response.Message)); // or just myFunc doesnt matter
});
return deferred.promise;
}
Lets say I want to process some tasks in the synchronous manner, so I have this function:
function executePromiseQueueSync(queue){
var seed = $.Deferred(),
finalPromise;
finalPromise = _.reduce(queue, function(memo, promise){
return memo.then(function(){
return promise.funct.apply(null, promise.argmnt);
});
}, seed.promise());
seed.resolve();
return finalPromise;
}
Now I can use it to process some files:
_.each(fileList, function(element, index, list){
_.each(element, function(el, idx, lst){
promisesQueue.push({funct: processFile, argmnt:[el, index + (len - fileList.length) ,len]});
});
});
Execute it and indicate a progress:
executePromiseQueueSync(promisesQueue).then(function(){
....
}, function(){
....
}).progress(function(msg, progress, name, index, status, desc){
console.log('progress');
});
Process function itself looks like this:
function processFile(file, index, size)
{
var dfd = new jQuery.Deferred();
if (file.name.match('(.*)\\.jpg'))
...
else if
...
else
$.when(processWrongFileType(file)).then(function(){
dfd.notify(...);
dfd.resolve();
});
return dfd.promise();
}
as you see there is nothing much to do when the file has a wrong type:
So sometimes I would like to execute synchronous code just like a promise:
function processWrongFileType(){
var dfd = new jQuery.Deferred();
dfd.resolve();
console.log("blah");
return dfd.promise();
}
The problem is if processWrongFileType will be executed, notify will not work.
If I change processWrongFileType to look like this:
function processWrongFileType()
{
var dfd = new jQuery.Deferred();
setTimeout(function(){dfd.resolve();},1);
return dfd.promise();
}
notify() will work. Is there any way to avoid setTimeout and still have notify() working with progress event?
You dont need to do anything special in order to use sync code as promise.
Just return value that is ==true
$.when((function() {
return prompt('really?')
})()).then((function() {
return alert('yeah')
})()).done((function () {
alert('done')
})())