I have a function that return a promise. (foo in this example)
I try to call this function inside their resolve function that was declared as anonymous.
I have tried with this but this not work.
my code looks like this
var foo = function(boo) {
/* .... */
return deferred.promise;
};
var bar = 42;
foo(bar).then(function() {
foo(bar--).then(this); //"this" don't work
});
What am I doing wrong?
Thanks
The simplest way is to name the anonymous function
foo(bar).then(function fn() {
foo(bar--).then(fn);
});
You can also declare the function separately
function fn() {
foo(bar--).then(fn);
}
foo(bar).then(fn);
Related
Purpose: I need to call sub function within main one;
Function declaration:
var MainFunction = function () {
function NestedFunc1(){
console.warn("NestedFunc1");
};
function NestedFunc2(){
console.warn("NestedFunc2");
};
}
Functions call:
MainFunction.NestedFunc1();
MainFunction.NestedFunc2();
What am I doing wrong?
10x;
you can make it public via a property then
function MainFunction () {
this.nestedFunc1 = function(){
console.warn("NestedFunc1");
};
this.nestedFunc2 = function(){
console.warn("NestedFunc2");
};
}
now you can invoke this function outside by doing
var malObj = new MainFunction();
malObj.nestedFunc1();
However, if you want to still invoke it like MainFunction.NestedFunc1() then make it
var MainFunction = {
NestedFunc1:function (){
console.warn("NestedFunc1");
},
NestedFunc2:function (){
console.warn("NestedFunc2");
}
}
The issue is that both of those functions are isolated within a function scope. Think of them as private functions.
One (of many) solutions could be to define MainFunction as a plain ol' object that has some functions as attributes:
var MainFunction = {
NestedFunction1: function () { .. },
NestedFunction2: function () { .. }
};
Notice that a comma is needed to separate the functions because of the way we are defining them. You then just call
MainFunction.NestedFunction1();
Also note that this pattern is fine as long as you don't wish to have other "private" functions inside that object.
I'm trying to use the Revealing Module Pattern to scope the JavaScript on my page so that I don't pollute the global namespace.
<script type="text/javascript">
var myModule = (function(){
function windowLoad() {
// window onLoad things
return;
}
function otherFunc(){
// otherFunc things
}
window.onload = windowLoad;
return { otherFunc: otherFunc };
})();
myModule.otherFunc(); // myModule is undefined here
</script>
For some reason, as shown in the comment above, myModule is undefined when I go to use it. Why?
myModule is not undefined. It is the object you returned from within your immediately invoked function; What is undefined is the result of calling myModule.otherFunc because that function doesn't return anything.
See the following snippet for an explanation.
var myModule = (function() {
function windowLoad() {
// window onLoad things
return;
}
function otherFunc() {
return 1;
}
window.onload = windowLoad;
return {
otherFunc: otherFunc
};
})();
console.log(myModule); // object {otherFunc: function otherFunc(){...}}
console.log(myModule.otherFunc()); // 1
As others have mentioned, your code works as written. As you've written it, otherFunc returns undefined since it doesn't have a return statement to explicitly return a value.
When you're debugging something like this, it's best to examine both the object and function you're calling separately:
console.log(myModule); // should print [Object object]
console.log(myModule.otherFunc); // should print a function definition
You could also try adding a return to otherFunc:
function otherFunc() {
return "This is otherFunc's return."
}
Please have a look at the following JavaScript snippet of code. This has to do with function scoping and hoisting in javascript. I can't call window.innermost() as it is undefined as it's not in scope.
Anyone know another way besides attaching it to the windows object. Windows Object still doesn't work in this case.
function outer(){
function callback() {
window.innermost = function() {
alert("hello from inner most")
}
}
}
(function caller() {
window.innermost(); // this is undefined
}());
You would have to call both the outer and the callback:
function outer(){
var callback = function() {
window.innermost = function() {
alert("hello from inner most")
}
}
callback(); // Call Callback
}
outer(); // Call outer
(function caller() {
window.innermost(); // should work
}());
If both of these functions are not called before you run the anonymous function, then the window.innermost won't be defined (or undefined if you will).
Also, notice that I set callback as a variable, which is an alternative way of defining a function within a function.
The problem is the following.
Theres is a function custom jquery function with another function inside, f.e.:
$.fn.slides = function(args){
function foo(args){
}
}
My question is now: How can I call the method foo.
foo is not a method. It is a local function. There is no way to access it from outside the function in which it is defined unless you modify that function to expose it.
For example (and I do not recommend creating globals, you should probably attach the function to some other object):
$.fn.slides = function(args){
function foo(args){ }
window.foo = foo;
}
You can't call it from outside the function, unless you return an object which has foo attached to it, something like this:
$.fn.slides = function(args){
this.foo = function (args){
}
return this;
}
$('blah').slides(args).foo(args);
Inside the function you can use it as a regular function:
$.fn.slides = function(args) {
function foo(args) {
}
foo(args);
}
I'm trying to understand when to use anonymous JavaScript functions.
State differences between the functions? Explain when you would use each.
var test1 = function(){
$("<div />").html("test1").appendTo(body)
};
function test2() {
$("<div />").html("test2").appendTo(body)
}
I think the answer is that one uses anonymous function and the other doesn't to replace an empty div element. Does that seem right?
In your example it really doesn't make a huge difference. The only difference is that functions declared using function foo() { } are accessible anywhere within the same scope at any time, while functions declared using var foo = function () { } are only accessible after the code that does the assignment has run.
foo(); // ok
function foo() { ... };
bar(); // error, bar is not a function
var bar = function () { ... };
bar(); // ok
You usually use anonymous functions in cases where you don't need a named function, or where you're constructing objects:
arr.sort(function (a, b) { return a - b; }); // anonymous callback function
function MyObject() {
this.foo = function () { ... } // object constructor
}
You would use a function like the following (which is another type of anonymous function) when you do not want to pollute the global namespace:
(function() {
var pollution = 'blablabla';
function stinky() {
// Some code
}
})();
You may check John Resig's Secrets of JavaScript Libraries, especially page 47 for JavaScript function. Quite lengthy, but you'll learn more about JavaScript