Difference between `function` and `() =>` with respect to `.call()`? [duplicate] - javascript

This question already has answers here:
Are 'Arrow Functions' and 'Functions' equivalent / interchangeable?
(4 answers)
Using arrow functions with .call()? "This" varies based on if in devtools or iojs locally? Should one avoid using arrows with .call?
(1 answer)
Can you bind 'this' in an arrow function?
(14 answers)
Closed 5 years ago.
I know about using .call() and .apply() to set the this for a function call, but can I use it for a lambda?
Consider this example from the MDN webdoc for Function.prototype.call:
function greet1() {
var reply = [this.person, 'Is An Awesome', this.role].join(' ');
console.log(reply);
}
let greet2 = () => {
var reply = [this.person, 'Is An Awesome', this.role].join(' ');
console.log(reply);
}
var i = {
person: 'Douglas Crockford', role: 'Javascript Developer'
};
greet1.call(i); // Douglas Crockford Is An Awesome Javascript Developer
greet2.call(i); // Is An Awesome Javascript Developer
Why doesn't the greet2 call work the same was as greet1 and is there a way to set this in the case of greet2?

Related

Difference in ES6 syntax to declare methods [duplicate]

This question already has answers here:
ES6 concise methods and non-concise methods in object literals
(1 answer)
Are 'Arrow Functions' and 'Functions' equivalent / interchangeable?
(4 answers)
Methods in ES6 objects: using arrow functions
(6 answers)
Closed 2 years ago.
I'm still not very familiar with all the ES6 syntax, and I'm starting to learn Vue.js, which makes extensive use of it. So, I find something that puzzles me a bit:
What's the difference between these two methods?
const actions = {
foo1(num) {
console.log(num);
},
foo2: (num) => {
console.log(num);
}
}
actions.foo1(2);
actions.foo2(3);
// output: 2
// output: 3
I guess they are not the same, although they both output their passed value.

If-statement does not work inside Arrow-function [duplicate]

This question already has answers here:
Are 'Arrow Functions' and 'Functions' equivalent / interchangeable?
(4 answers)
Closed 2 years ago.
$('#title').keyup( () => {
const title_val = $(this).val();
console.log('before');
if (title_val.length >= 20){
console.log(title_val);
}
console.log('after');
});
console.log('before') and console.log('after') works. If-statement only works if I use function() instead of () => {...}, even if the condition is satisfied. Why does it behave like this?
There is no this operator in arrow functions, only in function functions..
when using this in an arrow function, it doesn't refer to the function scope; rather, to the parent scope (usually window)

Jquery validator change `this` ES6 code [duplicate]

This question already has answers here:
What's the meaning of "=>" (an arrow formed from equals & greater than) in JavaScript?
(14 answers)
Are 'Arrow Functions' and 'Functions' equivalent / interchangeable?
(4 answers)
Closed 4 years ago.
I have es6 class with constructor and validation method.
class Popups {
constructor(selector) {
this.app = selector;
}
validate() {
$.validator.addMethod('atLeastOneLowercaseLetter', (value, element) => {
return this.optional(element) || /[a-z]+/.test(value);
// how to replace `this` ??
},
'Must have at least one lowercase letter'
);
}
}
My this refers to my Class, but I need get $.validator with my validate form. How i can replace this?
If i write $.validator.optional(element) || /[a-z]+/.test(value) I get error $.validator.optional is not a function
In that case don't use an arrow function as it does not have it's own this. Use a normal function expression as the callback instead.

arrow function inside an object literal [duplicate]

This question already has answers here:
Methods in ES6 objects: using arrow functions
(6 answers)
Are 'Arrow Functions' and 'Functions' equivalent / interchangeable?
(4 answers)
Closed 4 years ago.
i have this object literal
let p = {
name : 'Amir',
say: () => {
console.log(this.name)
console.log(this)
}
}
and I want the say function works using this
p.say();
but the arrow function obviously gets the window object as 'this'. I know I could use a regular function for 'say' instead of arrow and it will work fine.
BUT
I would like to ONLY change the call to say function to make it work, but the binding won't work.
I mean something like p.say.bind(p)() or p.say.call(p) aint gonna work as desired.
Is it possible to change the call to function ONLY and not the say function?

What is the difference between these two object methods in Javascript? [duplicate]

This question already has answers here:
Use of 'prototype' vs. 'this' in JavaScript?
(15 answers)
Prototyped and a non-prototyped method? [duplicate]
(1 answer)
Closed 8 years ago.
Consider the following code:
function someObj() {
this.someFunction = function() {
console.log('someFunction');
}
}
someObj.prototype.foo = function() {
console.log('foo');
}
I can call both like so:
var test = new someObj();
test.someFunction(); // Logs 'someFunction'
test.foo(); // Logs 'foo'
How would variable scope be affected here? Is there an advantage / disadvantage to each approach?

Categories