I have something like this:
var yourNamespace = {
foo: function() {
.....
},
bar: function() {
function foobar() {....
}
}
};
Is there a possibility to call inside of foo, the foobar function inside of bar?
With your exact structure you cannot however you can do something like that :
var yourNamespace = {
foo: function() {
.....
yourNamespace.foobar()
},
bar: function() {
function foobar() {....}
yourNamespace.foobar = foobar;
}
};
Or nicer, (IMO) :
var yourNamespace = {
foo: function() {
.....
yourNamespace.bar.foobar()
},
bar: function() {
yourNamespace.bar.foobar = function() {....}
}
};
Please note: in both case, bar() must run before foo() otherwise foobar is undefined
This is just a simple Module pattern. What you should do is make bar it's own module, and return foobar from that module. Example:
var yourNamespace = {
foo: function() {
this.bar.foobar();
},
bar: {
abc: '',
foobar: function() {
console.log('do something');
}
}
};
Or you could do something more like this:
var yourNamespace = {
foo: function() {
var bar = this.bar();
},
bar: function() {
var abc = '';
function foobar() {
console.log('return abc or do something else');
return abc;
}
return {
foobar: foobar
}
}
};
Related
Method:
a = {
foo: 1,
bar() {
return this.foo + 1
},
lol: {
baz() {
return this.foo
}
}
}
a.bar() this which refers to a which is what I want. I'm looking for a way for the child method inside a.lol.baz to also have this refer to a. Is there anyway to do it?
You can't refer to it directly. But you can bind the function to the object explicitly, then this will be available.
a = {
foo: 1,
bar() {
return this.foo + 1
},
lol: {}
}
a.lol.baz = (function() {
return this.foo
}).bind(a);
console.log(a.lol.baz());
you can use a.lol.baz.call(a) function
a = {
foo: 1,
bar() {
return this.foo + 1
},
lol: {
baz() {
return this.foo
}
}
}
var res=a.lol.baz.call(a)
alert(res)
How can I extend the scope of this so that the below works? I've tried using the .bind() function but I can't seem to get anything to work.
var myObj = {
test: "Hello",
test2: " World",
run: {
all: function() {
return this.test + this.test2;
},
part: function() {
return this.test2;
}
}
}
console.log(myObj.run.all())
// => "Hello World"
console.log(myObj.run.part())
// => " World"
The functions all and part are members of the object run and run does not have the values test and test2. They're member objects of myObj.
You can replace the this keyword with myObj.
var myObj = {
test: "Hello",
test2: " World",
run: {
all: function() {
return myObj.test + myObj.test2;
},
part: function() {
return myObj.test2;
}
}
}
console.log(myObj.run.all())
console.log(myObj.run.part())
I came across the same issue recently.
I solved by using a function
var myObj = function(){
var self = this;
this.test = "Hello";
this.test2 = " World";
this.run = {
all: function() {
return self.test + self.test2;
},
part: function() {
return self.test2;
}
}
}
console.log(myObj.run.all())
// => "Hello World"
console.log(myObj.run.part())
// => " World"
I also found out the bind does the job!
var myObj = {
test: "Hello",
test2: " World",
run: {
all: function() {
return this.test + this.test2;
},
part: function() {
return this.test2;
}
}
};
console.log( myObj.run.all.bind(myObj)() );
// => "Hello World"
console.log( myObj.run.part.bind(myObj)() );
// => "World"
Working fiddle ==> https://jsfiddle.net/sn5w7872/
Use apply
The apply() method calls a function with a given this value, and arguments provided as an array
var myObj = {
test: "Hello",
test2: " World",
run: {
all: function() {
return this.test + this.test2;
},
part: function() {
return this.test2;
}
}
}
console.log(myObj.run.all.apply(myObj,[]));
// => "Hello World"
console.log(myObj.run.part.apply(myObj,[]));
Use ES6 classes and arrow functions.
class myObj {
constructor() {
this.test = "Hello";
this.test2 = " World";
this.run = {
all: () => this.test + this.test2,
part: () => this.test2
}
}
}
var obj = new myObj();
console.log(obj.run.all())
// => "Hello World"
console.log(obj.run.part())
// => " World"
Here is the working fiddle - https://jsfiddle.net/sgsvenkatesh/vn9b1f95/
Mouthful. Ok so this is the sample.
I need to pass bar1 from bar2 inside a function.
var foo = {
bar1 : function () {
},
bar2 : function () {
return function () {
// bar1(); pass bar1 through here ... this.bar1 ?
}
}
You can save this in variable like this:
var foo = {
bar1 : function () {
},
bar2 : function () {
var self = this;
return function () {
self.bar1();
}
}
};
or use bind:
var foo = {
bar1 : function () {
},
bar2 : function () {
return function () {
this.bar1();
}.bind(this);
}
};
I define a script with no dependencies with require:
define([], function () {
var obj = {
doSomething: function() {}
}
return : {
obj : obj
}
});
However when I have to use doSomething like this:
require(['obj'], function (obj) {
obj.obj.doSomething();
});
What am I doing wrong, so I can't just use
obj.doSomething();
Try:
define([], function () {
var obj = {
doSomething: function() {}
}
return obj;
});
I'm whondering how to access a specific method in a widget, which I've created.
var foo = {
init : function() {
$.bar.addEventListener('click', this.handleClick);
},
handleClick : function(e) {
console.log(this); // TiUIButton { widgetId="Ti.UI.Button:0" ...
// I want to call baz() here....How to do that?
},
baz: function() {
}
};
foo.init()
Greetings from germany and thanks for your help,
--marc
Pretty straightforward:
var foo = {
init : function() {
$.bar.addEventListener('click', this.handleClick);
},
handleClick : function(e) {
console.log(this); // TiUIButton { widgetId="Ti.UI.Button:0" ...
// I want to call baz() here....How to do that?
// Like this
foo.baz();
},
baz: function() {
}
};
foo.init()