• Home
  • PHP
  • MySQL
  • Demos
  • HTML
  • CSS
  • jQuery
  • Framework
  • Social
  • Request Tutorial
PHP Lift
  • Home
  • Demos
  • Advertisement
PHP Lift
  • Home
  • PHP
  • MySQL
  • Demos
  • HTML
  • CSS
  • jQuery
  • Framework
  • Social
  • Request Tutorial
  • Follow
    • Facebook
    • Twitter
    • Google+
    • Pinterest
    • Youtube
    • Instagram
    • RSS
JavaScript tips and tricks, Part 2
Home
JavaScript

JavaScript tips and tricks, Part 2

March 15th, 2017 Huzoor Bux JavaScript, Tips 0 comments

  1. Minify your code

Minifying your code makes it smaller in size which increases the website’s loading speed, which increases the ranking of the website in search engine and so on. There are many tools, even online ones, which allow you to minify JavaScript. Minification itself refers to modifying the code from a human-friendly version to a version that works but takes the least amount of physical space (such as reducing all newlines, extra whitespaces and so on).

A tool that you can try out to see minification in action is: https://jscompress.com/

  1. Obfuscate your code

If you are worried that someone will take advantage of your JavaScript logic or try to copy,paste and enhance it you can obfuscate your JavaScript logic. This will make it a little bit harder for someone to understand the logic  behind your application. Obfuscation typically makes the logic harder to understand by renaming variables to random characters, performing different types of encodings and decodings to mask the source and so on.

  1. Avoid polluting the global scope by anonymous functions

In the previous part of the article, we have talked about how you may prevent polluting the global scope by using objects or classes. You can also wrap your logic within anonymous functions which are immediately called to leave the entire global scope intact. Here is a simple example of how you may achieve that:

// An anonymous function
(function () {
   var myVariable= 1;

// myVariable is defined within a local scope and does not pollute the window object
   console.log(window.myVariable);
   // undefined
   console.log(myVariable);
   // 1
})();
// Called immediately

You can use such immediately invoked functions in all kinds of cases when you want to create a new scope. You will still be able to use the variables defined in the parent scope but would create an entirely new scope to define new variables in the anonymous immediately invoked function. You can also use immediately invoked functions with the ternary operator. For example, you may want to execute some particular piece of logic if a condition is true and another piece of logic if it is not and also keep a separate scope for those pieces of logic. Below is an example of that usage:

divsShineRed ? (function() {
            jQuery("div").css("background-color", "crimson");
})() :  (function() {
            jQuery("div").css("background-color", "darkgreen");
})();

  1. Converting to numbers using the + sign

You can convert variables and properties to numeric by prepending them with the + sign. Examples follow below of how this is achieved:

new Date()

Tue Feb 14 2017 09:25:06 GMT+0200 (FLE Standard Time)

+new Date()

1487057110424

+"42dqdq"

NaN

+"42"

42
  1. Caching loop elements

When looping, you may be doing something like this:

for (var i = 0; i < someArray.length;i++) {

//logic
}

It is actually better to store the length of the array in a variable and pass that variable to the loop in terms of speed as if you use the method above, the length has to retrieved anew for each iteration of the loop. Therefore, you should be striving for something like this:

var arrLength = someArray.length;

for (var i = 0; i < arrLength;i++) {

//logic

}

Please subscribe for more tips and tricks.

Share this:

  • Click to share on Twitter (Opens in new window)
  • Click to share on Facebook (Opens in new window)

Related

Facebook Twitter Google+ LinkedIn Pinterest
Next article Validation of HTML5 documents
Previous article JavaScript tips and tricks

Huzoor Bux

I am a PHP Developer

Related Posts

3 reasons why you SHOULD write tests Guide
May 15th, 2022

3 reasons why you SHOULD write tests

How to create a screen recorder in JavaScript JavaScript
May 8th, 2022

How to create a screen recorder in JavaScript

Best 10 Programming Languages that will rule in 2022 Guide
May 1st, 2022

Best 10 Programming Languages that will rule in 2022

Leave a Reply Cancel reply

This site uses Akismet to reduce spam. Learn how your comment data is processed.

    Advertisement
    Like us
    Recent Posts
    • How to Extract Text from PDF using PHP
    • 3 reasons why you SHOULD write tests
    • How to create a screen recorder in JavaScript
    • Best 10 Programming Languages that will rule in 2022
    • Top 7 Websites To Get Your First Paid Internship
    Categories
    • API
    • Bootstrap
    • Bot
    • CSS
    • CSS 3
    • Database
    • Designing
    • Framework
    • Guide
    • HTML
    • HTML 5
    • JavaScript
    • jQuery
    • MySQL
    • Node.js
    • oAuth
    • Payment
    • PHP
    • Python
    • Social
    • Tips
    • WordPress
    Weekly Tags
    • PHP
    • How to
    • javascript
    • api
    • MYSQL
    • jQuery
    • PHP Basics
    • Programming Habits
    • HTML5
    • PHP framework
    • About
    • Privacy Policy
    • Back to top
    © PHPLift 2021. All rights reserved.