Why use _this vs. this in Javascript interaction?
Copy link to clipboard
Copied
I've seen Javascript used in Animate that defines _this instead of this.
For example: _this()stop; or _this.parent.gotoAndPlay
vs.
this()stop; or this.parent.gotoAndPlay
The Adobe Press Animate book actually shows screenshots with both used. And, I understand Javascript requires determining scope. Why use one or other and why not just have a standard?
Copy link to clipboard
Copied
'this' is a reserved word that means the object in which that line of code is. With JavaScript you sometimes need to convery which 'this' you mean. There are generally two ways to do that, either Bind or use a variable.
For example:
alert(this);
testfunction();
on testfunction{
alert(this);
}
The two alerts will show different values. Using Bind:
alert(this);
testfunction.bind(this);
on testfunction{
alert(this);
}
will show the same value. But, using bind everywhere to keep the level being the same may not always be what you want, and so the other way of using a variable would do:
var _this = this;
alert(_this);
on testfunction{
alert(_this);
}
would show the same value. As 'this' is a reserved word it can't be used as a variable, and a common variable to use is _this. I sometimes use 'self' too, like:
var self = this;
Then I can refer to self when I'm trying to do something on the main timeline.
Another approach that is useful is to stash your variables in the browser window level. You could say:
window.tl = this;
and then everywhere in your entire hierarchy you could get back to the main timeline by addressing window.tl.
Copy link to clipboard
Copied
Polluting the global scope with variables is not great practice, BTW. At the very least I'd recommend stashing any Animate globals in exportRoot instead, which acts as the defacto Animate namespace.
Copy link to clipboard
Copied
Hey Team,
I am teaching kids coding (I know right?) so I need this in a simpler way! Why? Even when you use the coding wizard to put simple play command onto a button the first thing it does is create var _this = this
So I am saying something like... this is a special word, its reserved for talking to objects on the main timeline.......... so what difference does it make if we make _this = this?? Doesnt this still mean we are referring to this special word? Is there a super simple to explain why this is so?
Thanks team
Copy link to clipboard
Copied
Hi.
It's because the this keyword value changes according to the context. So depending from where you use it, you may get different results. For example:
class AnotherTest
{
doSomething()
{
console.log("doSomething: ", this);
}
static doSomethingStatic()
{
console.log("doSomethingStatic: ", this);
}
}
new AnotherTest().doSomething();
AnotherTest.doSomethingStatic();
function test()
{
console.log("test: ", this);
}
test();
stage.on("drawend", function(){ console.log("drawend: ", this); }, null, true);
stage.on("drawend", () => console.log("drawend arrow: ", this), null, true);
console.log("root: ", this);
// doSomething: AnotherTest
// doSomethingStatic: class AnotherTest { ... }
// test: Window
// root: lib.Untitled1
// drawend: lib.Stage
// drawend arrow: lib.Untitled1
So this is why it is a good idea to save a reference to a more predictable context in a variable (eg.: var _this = this).
I hope this helps.
Regards,
JC
Copy link to clipboard
Copied
Thanks JC, I think that helps
Copy link to clipboard
Copied
Just to check if I understand, does that mean that if we make var _this = this - does that mean that the _this variable will refer to the timeline the object is on, even if it is called in another timeline? e.g. If I make _this a var that equals this on the main timeline - can I use _this to refer to things from inside a MC (a separate timeline) and it will still refer to the main timeline?
Copy link to clipboard
Copied
no.
you would need to use the correct path to the _this variable (just like every other variable). ie, using
var _this = this;
is only useful in the frame and timeline wheee it's defined..
Copy link to clipboard
Copied
ok thanks
Copy link to clipboard
Copied
you're welcome.
Copy link to clipboard
Copied
and when "this" is used on a timeline, it refers to that timeline. ie, on the main timeline, it references the main timeline. on a movieclip timeline, it references that movieclip.
Copy link to clipboard
Copied
Ok Kglad I will use what you have said here for sure, sounds good 🙂

