The document provides 11 powerful JavaScript tips and best practices for programmers, including using short-circuit evaluation to set default values, immediately invoked function expressions to avoid polluting the global namespace, and splice instead of delete to remove array items without leaving undefined holes.
Why Teams call analytics are critical to your entire business
Powerful JavaScript Tips and Best Practices
1. Powerful JavaScript TipsPowerful JavaScript Tips
Techniques that all JavaScript programmers can use now
you needn’t be an advanced JavaScript developer to benefit from these tips
2. Powerful JavaScript TipsPowerful JavaScript Tips
1. “short circuting” method
To set default values, instead of this:
function fileName(name)
if (!name) {
name = "unknown_name";
}
return name;
}
Use this:
function fileName(name)
name = name || "unknown_name";
return name;
}
3. Powerful JavaScript TipsPowerful JavaScript Tips
2. “short circuting” with && (AND)
Instead of this:
function isAdult(age) {
if (age && age > 17) {
return true;
}
else {
return false;
}
}
Use this:
function isAdult(age) {
return age && age > 17 ;
}
4. Powerful JavaScript TipsPowerful JavaScript Tips
3. It gets more exciting!
Instead of this:
if (userName) {
logIn(userName);
}
else {
signUp();
}
Use this:
userName && logIn (userName) || signUp ();
5. Powerful JavaScript TipsPowerful JavaScript Tips
4. powerful uses of immediately invoked function expressions
Immediately and after invoke
(showName = function (name) {
console.log(name || "No Name")
}) (); // No Name
showName ("Mike"); // Mike
6. Powerful JavaScript TipsPowerful JavaScript Tips
5. when to use immediately invoked function expressions?
All the code is wrapped in the IIFE
(function () {
var firstName = “Dragos”, concatenated = undefined;
function init () {
doStuff (firstName);
// code to start the application
}
function doStuff (firstName) {
concatenated = firstName + 'Developer';
doMoreStuff();
}
function doMoreStuff () {
console.log('Concatenated = ', concatenated;
}
// Start the application
init ();
}) ();
9. JavaScript Best Practices
1 – Don’t forget var keyword when assigning a variable’s value for the first time.
2 – use === instead of ==
10. JavaScript Best Practices
1 – Don’t forget var keyword when assigning a variable’s value for the first time.
2 – use === instead of ==
3 – undefined, null, 0, false, NaN, '' (empty string) are all falsy.
11. JavaScript Best Practices
1 – Don’t forget var keyword when assigning a variable’s value for the first time.
2 – use === instead of ==
3 – undefined, null, 0, false, NaN, '' (empty string) are all falsy.
4 – Be careful when using typeof, instanceof and constructor.
typeof : a JavaScript unary operator used to return a string that represents the primitive
type of a variable, don’t forget that typeof null will return “object”,
and for the majority of object types (Array, Date, and others) will return also “object”.
constructor : is a property of the internal prototype property, which
could be overridden by code.
instanceof : is another JavaScript operator that check in all the prototypes chain the
constructor it returns true if it’s found and false if not.
12. JavaScript Best Practices
1 – Don’t forget var keyword when assigning a variable’s value for the first time.
2 – use === instead of ==
3 – undefined, null, 0, false, NaN, '' (empty string) are all falsy.
4 – Be careful when using typeof, instanceof and constructor.
typeof : a JavaScript unary operator used to return a string that represents the primitive
type of a variable, don’t forget that typeof null will return “object”,
and for the majority of object types (Array, Date, and others) will return also “object”.
constructor : is a property of the internal prototype property, which
could be overridden by code.
instanceof : is another JavaScript operator that check in all the prototypes chain the
constructor it returns true if it’s found and false if not.
5 – Get a random item from an array
3 – undefined, null, 0, false, NaN, '' (empty string) are all falsy.
var items = [12, 548 , 'a' , 2 , 5478 , 'foo' , 8852, , 'Doe' , 2145 , 119];
var randomItem = items[Math.floor(Math.random() * items.length)];
13. JavaScript Best Practices
1 – Don’t forget var keyword when assigning a variable’s value for the first time.
2 – use === instead of ==
3 – undefined, null, 0, false, NaN, '' (empty string) are all falsy.
4 – Be careful when using typeof, instanceof and constructor.
typeof : a JavaScript unary operator used to return a string that represents the primitive
type of a variable, don’t forget that typeof null will return “object”,
and for the majority of object types (Array, Date, and others) will return also “object”.
constructor : is a property of the internal prototype property, which
could be overridden by code.
instanceof : is another JavaScript operator that check in all the prototypes chain the
constructor it returns true if it’s found and false if not.
5 – Get a random item from an array
3 – undefined, null, 0, false, NaN, '' (empty string) are all falsy.
var items = [12, 548 , 'a' , 2 , 5478 , 'foo' , 8852, , 'Doe' , 2145 , 119];
var randomItem = items[Math.floor(Math.random() * items.length)];
6 – Generate an array of numbers with numbers from 0 to max
var numbersArray = [] , max = 100;
for( var i=1; numbersArray.push(i++) < max;); // numbers = [1,2,3 ... 100]
14. JavaScript Best Practices
7 – Append an array to another array
var array1 = [12 , "foo" , {name "Joe"} , -2458];
var array2 = ["Doe" , 555 , 100];
Array.prototype.push.apply(array1, array2);
/* array1 will be equal to [12 , "foo" , {name "Joe"} , -2458 , "Doe" , 555 , 100] */
15. JavaScript Best Practices
7 – Append an array to another array`
var array1 = [12 , "foo" , {name "Joe"} , -2458];
var array2 = ["Doe" , 555 , 100];
Array.prototype.push.apply(array1, array2);
/* array1 will be equal to [12 , "foo" , {name "Joe"} , -2458 , "Doe" , 555 , 100] */
8 – Transform the arguments object into an array
var argArray = Array.prototype.slice.call(arguments);
16. JavaScript Best Practices
7 – Append an array to another array`
var array1 = [12 , "foo" , {name "Joe"} , -2458];
var array2 = ["Doe" , 555 , 100];
Array.prototype.push.apply(array1, array2);
/* array1 will be equal to [12 , "foo" , {name "Joe"} , -2458 , "Doe" , 555 , 100] */
8 – Transform the arguments object into an array
var argArray = Array.prototype.slice.call(arguments);
9 – Verify that a given argument is a number
function isNumber(n){
return !isNaN(parseFloat(n)) && isFinite(n);
}
17. JavaScript Best Practices
7 – Append an array to another array`
var array1 = [12 , "foo" , {name "Joe"} , -2458];
var array2 = ["Doe" , 555 , 100];
Array.prototype.push.apply(array1, array2);
/* array1 will be equal to [12 , "foo" , {name "Joe"} , -2458 , "Doe" , 555 , 100] */
8 – Transform the arguments object into an array
var argArray = Array.prototype.slice.call(arguments);
9 – Verify that a given argument is a number
function isNumber(n){
return !isNaN(parseFloat(n)) && isFinite(n);
}
10 – Verify that a given argument is an array
function isArray(obj){
return Object.prototype.toString.call(obj) === '[object Array]' ;
}
18. JavaScript Best Practices
7 – Append an array to another array
var array1 = [12 , "foo" , {name "Joe"} , -2458];
var array2 = ["Doe" , 555 , 100];
Array.prototype.push.apply(array1, array2);
/* array1 will be equal to [12 , "foo" , {name "Joe"} , -2458 , "Doe" , 555 , 100] */
8 – Transform the arguments object into an array
var argArray = Array.prototype.slice.call(arguments);
9 – Verify that a given argument is a number
function isNumber(n){
return !isNaN(parseFloat(n)) && isFinite(n);
}
10 – Verify that a given argument is an array
function isArray(obj){
return Object.prototype.toString.call(obj) === '[object Array]' ;
}
11 – Don’t use delete to remove an item from array
Use splice instead of using delete to delete an item from an array. Using delete replaces
the item with undefined instead of the removing it from the array.