The fact that JavaScript is such a flexible language makes it maybe the easiest language to start with and the hardest to master. I’ve been working with JavaScript for more than 10 years now and I still stumble upon some hidden syntax or tricks that I never knew existed.
So let's see some JS mysteries that I've recently discovered.
1. There is a function constructor. You will give it the parameters and the body of the function and it will return back the actual function :
const diff = new Function('a', 'b', 'return a - b');
diff(20,13) // 7
2. We have a with statement in Javascript. It takes as a parameter an object and binds the properties of that object to the scope of the contained code block.
const book = {
author: 'Ernest Hemingway',
title: 'The Sun Also Rises'
}
with(book) {
console.log(author); // Ernest Hemingway
console.log(title); // The Sun Also Rises
}
3. we can use the + operator to convert a string to a number. No more the need to use functions like parseInt()
or parseFloat()
, unless you want to parse to that specific numerical type.
const nr = +'1.5';
nr + 1; // 2.5
4. we can assign properties to functions. We can make configurable functions by assigning specific properties to that function.
function sayHello() {
if (sayHello.country = 'US') {
return alert('Hi there!');
}
if (sayHello.country = 'FR') {
return alert('Bonjour !');
}
if (sayHello.country = 'GR') {
return alert('Guten Tag !');
}
return alert('Hi');
}
sayHello.country = 'FR';
sayHello(); // alert('Bonjour !');
Also, we can use these function properties as counters or "static variables".
5. we can use the arguments.callee.caller to see what function invoked the current function. The arguments
var is a default of any js function. But we have the arguments.callee.caller
that will tell us who called that function. Something like a console.trace() but just one level deep.
function sayHello() {
alert(arguments.callee.caller); //start
}
function start() {
sayHello();
}()
Also the arguments.callee
refers to the currently running function.
6. we have a void operator. You give it anything and it returns back undefined
.
void(1); // undefined
void(true); // undefined
void(false); // undefined
void({}); // undefined
You may ask yourself why you would want an operator like this one? Well because before ES5 you could actually assign a new value to the original undefined:
undefined = "abc";
x = undefined;
alert(x); // "abc"
// this will not work anymore
// but it explains why we have the void operator
So ... Javascript the language where surprises never end!
📖 50 Javascript, React and NextJs Projects
Learn by doing with this FREE ebook! Not sure what to build? Dive in with 50 projects with project briefs and wireframes! Choose from 8 project categories and get started right away.
📖 50 Javascript, React and NextJs Projects
Learn by doing with this FREE ebook! Not sure what to build? Dive in with 50 projects with project briefs and wireframes! Choose from 8 project categories and get started right away.