use of "that" keyword in javascript [duplicate] - javascript

This question already has answers here:
What does 'var that = this;' mean in JavaScript?
(6 answers)
Closed 10 years ago.
I have few javascript that has used the keyword "that" extensively.
I see a lot of posts talking about the javascript keyword "this".
I wanted to understand the meaning of this key word in javascript context and it's visibility/scope.
Something like
that.someFunctionaName(someParameter)
What does it mean?
I understand the keyword "this" always points to the owner of the current object.

that is not a keyword in JavaScript. I suspect the code that you have is using something in the class to define an instance of itself. For example:
function myClass()
{
var that = this;
}
By doing this, you can ensure you're referencing the object, and not another element. For example, consider the following sample:
function myClass()
{
var that = this;
$('.myele').click(function() {
// 'this' refers to the element that was clicked.
// 'that' still refers to the myClass() object.
});
}

Related

Can anyone tell me the difference between function defined in function and adding function using prototype [duplicate]

This question already has answers here:
Use of 'prototype' vs. 'this' in JavaScript?
(15 answers)
Closed 4 years ago.
I am trying to differentiate between first block and second block of code.
//first block
function xyz(){
this.callXyz=function(){
console.log('callXyz inner');
}
}
// second block
xyz.prototype.callXyz=function(){
console.log('prototype function');
}
I'm going to guess that your first code block was meant to look like this:
function xyz(){
this.callXyz = function(){
console.log('callXyz inner');
}
}
And I'm going to assume you do new xyz at some point to create an instance.
If so, the difference is that in that first example, a new function is created each time xyz is called (presumably via new) and assigned as an own property on the new object. In the second example, the function is only created once, and then the new object created by new xyz gets that property as an inherited property from its prototype; all of the instances created via new xyz share the same function.

Where is a function's this value stored? [duplicate]

This question already has an answer here:
How to inspect a JavaScript Bound Function
(1 answer)
Closed 6 years ago.
I know that you can bind the this value of a function using
function.bind(new_this_value, arguments)
But is there a way to access the bound value? ie something like this:
console.log(my_function.boundValue)
In other words, suppose a module provides the following function:
function getACoolFunction () {
var someFarAwayFunction = function() {console.log(this.name)}
var bound_this_value = {name: "bound this value"}
someFarAwayFunction.bind(bound_this_value)
return someFarAwayFunction;
}
and I have this in my code:
import {getACoolFunction} from coolModule
var coolFunction = getACoolFunction();
// coolFunction.bound_value
How do I get the bound value of coolFunction from my code without changing the module?
Nothing prevents you from doing this:
let my_function = function.bind(new_this_value, arguments);
my_function.boundValue = new_this_value;
As from the standard, a bound function is:
an exotic object that wraps another function object.
It has internal properties containing original function, provided this and arguments.
As they are explicitly mentioned as internal, I would say that they are not directly exposed and accessible.
Probably this Q/A contains details that can help you to work around this limitation.

What does F= or F=a=> mean in Javascript? [duplicate]

This question already has answers here:
What's the meaning of "=>" (an arrow formed from equals & greater than) in JavaScript?
(14 answers)
Closed 8 years ago.
I've been pursuing the codegolf site lately with a focus on Javascript. I keep seeing something that I don't understand and can't find an answer to. Check out this answer. The first line starts with F=a=>. I assume that this is a shorthand function declaration, but I can't find any reference to it elsewhere on the web. Can someone explain, or point me to a good document about this syntax?
Feel free to tag this question. Hard to tag when I don't know what I'm looking at.
If you look at the ES6 definition document this is the Arrow function symbol
Looking at MDN's documentation this is just shorthand for declaring an anonymous function
An interesting difference is that the arrow function syntax provides a closure so (quoting from MDN)
In ECMAScript 3/5, this issue was fixed by assigning the value in this
to a variable that could be closed over.
function Person() {
var self = this; // Some choose `that` instead of `self`.
// Choose one and be consistent.
self.age = 0;
setInterval(function growUp() {
// The callback refers to the `self` variable of which
// the value is the expected object.
self.age++;
}, 1000);
}
Alternatively, a bound function could be created so that the proper
this value would be passed to the growUp function.
Arrow functions capture the this value of the enclosing context, so
the following code works as expected.
function Person(){
this.age = 0;
setInterval(() => {
this.age++; // |this| properly refers to the person object
}, 1000);
}
var p = new Person();
In those two examples you can see the difference very clearly
function() {
console.writeline('es5');
}
versus
() => {
console.writeline('es6');
}
Yea, that is a shorthand for a function declaration.
https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Functions/Arrow_functions

Javascript: this.varName = "" vs var varName = "" [duplicate]

This question already has answers here:
Difference between this and var in a function
(5 answers)
What is the scope of variables in JavaScript?
(27 answers)
Closed 9 years ago.
I'm new to JS so noob question:
I see functions which define vars inside them:
function functionName(){
this.something = "";
};
If I understand correctly, something is a local variable? Why is it being defined as this.something = '' as opposed to var something = ''?
Is there any difference, and if so what is it?
It sets the attribute something of this. What this refers to depends on how functionName is invoked, but typically it's an object created with new:
var foo = new functionName();
console.log(foo.something);
If you'd use var something inside the function, the variable would be inaccessible from outside, so you couldn't do foo.something in the above example.
var someThing
is a local variable - meaning it exists within the scope of the current block
this.someThing
is an instance variable - meaning it belongs to the object and is visible in all methods of that object.

What is the reasoning behind declaring var that = this; in javascript? [duplicate]

This question already has answers here:
What does 'var that = this;' mean in JavaScript?
(6 answers)
Closed 9 years ago.
I came across this many times in a new code base that I'm looking at and was wondering is there is any proper reasoning behind it?
You can use var that = this; is order to keep a reference to current this object, when later this will be pointing to something else.
Example (taken from here):
$('#element').click(function(){
// this is a reference to the element clicked on
var that = this;
$('.elements').each(function(){
// this is a reference to the current element in the loop
// that is still a reference to the element clicked on
});
});
Sometimes the meaning of this in JavaScript changes based on the scope. this inside of a constructor means something different than this inside of a function. Here's a good article about it.
If you want access to "this" outside/inside of the scope of a specific function call where what "this" is may have changed. Just one example I can think of.

Categories

Resources