This question already has answers here:
What does the colon mean in Javascript after function?
(2 answers)
Closed 1 year ago.
I am going through source code of Vue.js. In almost all the function declarations I find a new way of defining functions
function isStringStart (chr: number): boolean {
return chr === 0x22 || chr === 0x27
}
Can somebody explain me what is this kind of function declaration called?
That's a type declaration. :boolean means basically, that the isStringStart function must return a boolean value. The same with the argument's type declaration. chr: number means, that the function accepts one argument, which has to be typeof number.
If the requirements are not fulfilled (not proper arguments are passed or wrong value is being returned), the typechecking library you are using will throw an error.
Related
This question already has answers here:
Why parenthesis are ignored in the expression (o.method)()
(2 answers)
How does the "this" keyword work, and when should it be used?
(22 answers)
Closed 25 days ago.
I'm implementing a JavaScript interpreter, and I can't figure out the details of binding functions to objects in JavaScript.
A rudimentary example:
const o = {
x: 1,
getX: function() {
return this.x;
}
};
o.getX(); // returns 1
The tricky part is what happens when you assign getX to a variable:
let gX = o.getX;
gX(); // returns undefined
My question is: how does the runtime know that o.getX() gets bound to o, but gX() should be unbound? I would assume gX and o.getX are pointing to the exact same function!
I first thought that maybe the presence of the . is what makes the difference. So, in the grammar, there's a production like <method-call> ::= <expr> '.' ID '(' <expr>* ')', and this expression is treated differently (the result of evaluating the first <expr> is bound to the function found under ID) than a "regular" call (without a .).
But the following expression seems to disprove this theory, because (o.getX)() also returns 1. However, in some magical way, (gX = o.getX)() returns undefined, even though it's clear to me the assignment expression returns its right-hand size, so o.getX in this case!
Is there a simple explanation of how these semantics are implemented? I can't figure out a way that my runtime is supposed to differentiate that o.getX is bound to o, but gX, even though it's pointing at o.getX, is not bound.
This question already has answers here:
In Typescript, what is the ! (exclamation mark / bang) operator when dereferencing a member?
(5 answers)
Two sets of parentheses after function call
(4 answers)
Closed last month.
In Codemirror 6's documentation, and in the code line 41, ...
while (pending.length) pending.pop()!(data.updates)
What does this syntax mean?
Seems to be typescript specific.
What would be the javascript equivalent?
In TypeScript, the ! operator can also be used to assert that a value is non-nullable. This is called a non-null assertion operator, and it is used to tell the TypeScript compiler that a value is definitely not null or undefined. Check the documentation
The pop() method removes the last element from an array and returns that element. See the documentation.
Since the return value is a function, well you can call it.
This question already has answers here:
Why does any JavaScript code want to "cut the binding"?
(1 answer)
JavaScript syntax (0, fn)(args)
(2 answers)
Closed 2 years ago.
var type = (0, _reactIs.isMemo)(nodeOrComponent) ? nodeOrComponent.type.type : nodeOrComponent.type;
(0, _reactIs.isMemo) really confuse me. What's the meaning of this?
ps: I know (0, _reactIs.isMemo) this expression's value is _reactIs.isMemo
The comma operator there ensures that what's inside the parentheses is evaluated as an expression without a calling context.
To take a shorter example, if the code was:
var type = obj.fn(someArg);
then fn would be called with a calling context of obj. But the original untranspiled code, whatever it is, does not have such a calling context, so in order to be faithful to the original code, the calling context has to be removed, which can be done with the comma operator:
var type = (0, obj.fn)(someArg);
Another way of doing the same thing would be:
var fn = obj.fn;
var type = fn(someArg);
(but that takes more characters, so minifiers prefer the comma operator version)
This is a silly-looking minification trick that's often seen with imported modules. Usually, you'd only be looking at the source code, which won't have this sillyness.
This question already has answers here:
What is the purpose of passing-in undefined?
(3 answers)
Closed 5 years ago.
I have just come across a function which accepts a parameter actually called 'undefined'. It is something like this:
(function($,undefined) {
// Do something
})(jQuery);
Either I'm going crazy, or there is no logical reason for this to be here as, well, undefined is undefined is undefined. Please can someone confirm either way? Thanks.
That is a classic trick to have an undefined variable to check against, typically:
if (someVar === undefined) {}
// instead of:
if (typeof someVar === 'undefined') {}
Notice that the wrapper IIFE does not pass any second argument, making the undefined parameter effectively undefined.
This question already has answers here:
What's the meaning of "=>" (an arrow formed from equals & greater than) in JavaScript?
(14 answers)
Closed 6 years ago.
I have found an example of somebody using the .filter() function without passing it a function as a parameter. I am puzzled as to how this works, here is an example of the code:
var integers = [1,2,3,4,5,6,7,8,9,10];
var even = integers.filter(int => int % 2 === 0);
console.log(even); // [2,4,6,8,10]
I am confused because I thought that filter must take a function as an argument, but instead is comparing "int" against "int % 2 === 0".
How is this happening? why does "int" not have to be declared and why can filter accept something that isn't a function?
Thanks!
The parameter of the example IS a function, arrow function:
https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Functions/Arrow_functions
It's basically a shorthand syntax for declaring a function which returns the first statement;
That's a function defined using the "fat arrow" notation (=>). It's also called a lambda and is new in ES6.