How To Obfuscate Your JavaScript Code



JavaScript code is easily deobfuscated and reverse-engineered. That’s why it’s important to obfuscate your code as much as possible. 

There are several obfuscation techniques that can be used to make your code harder to understand. 

This article will cover the most common ways of obfuscating your code.



Wrap your variables

You can limit the scope of a variable by wrapping it in an anonymous function. Variables declared like this are only accessible to the function they were declared within.

(function(){

  var x = ..., ... ...;

  // do stuff

})();

This will make it harder for someone to get the values for those variables.

Most of the time when you try to obfuscate your code, you start wrapping your variables. That’s a good start.  


Use String Interpolation

string interpolation is the process of finding and replacing placeholders with values in a string literal.

JavaScript string interpolation is done using `template literals` (strings wrapped in backticks) and ${expression} as a placeholder. 


let a = 5;

let b = 10;

console.log('Fifteen is ' + (a + b) + ' and\nnot ' + (2 * a + b) + '.');

// "Fifteen is 15 and

// not 20."

This is one of the most used techniques for obfuscation. It allows you to use variables and manipulate their values inside the string. The variables can be declared anywhere in the string. 


The only thing that has to be inside the string is the part that is going to be assigned a value.  It’s possible to create an infinite amount of different expressions with this technique. 

<script>

  

// String Concatenation

function myInfo(fname, lname, country) {

    return "My name is " + fname + " " + lname + ". " 

              + country + " is my favorite country."; 

}

console.log(myInfo("john", "doe", "India"));

</script>

The variables declared in the string will be expanded when they are evaluated. This is one of the reasons why it’s so popular.

mixed-case lettering in JS function variables

The mixing of your case can be used to obfuscate your code. It works by mixing two different case sensitivity levels. 

function titleCase(sentence) {

  let sentence = string.toLowerCase().split(" ");

  for (let i = 0; i < sentence.length; i++) {

    sentence[i] = sentence[i][0].toUpperCase() + sentence[i].slice(1);

  }

  

  return sentence.join(" ");

}


Concatenate your code

 You can also obfuscate your code by concatenating it. This means that you can add a new line character between all your code fragments.

This should make your code look like one giant unreadable block of text. This is one of the most effective methods of obfuscation out there.

You can concatenate two strings with the + operator, just like you would add two numbers. 

const str = 'Hello' + ' ' + 'World';

console.log(str );// Hello World


Wrap your functions

Wrapping your JavaScript functions is a way of adding common logic to functions that are out of your control. 

You can declare your functions in an anonymous block, as shown in the example below. 

(function () {

   //...

});

Anonymous functions are not accessible after their creation, so you often need to assign them to a variable. 

let show = function() {

    console.log('Anonymous function');

};

show();


Anonymous functions can also be passed to other functions as arguments. 

 

setTimeout(function() {

    console.log('Execute later after 1 second')

}, 1000);

This technique is easier to apply when your functions are small and doesn’t make a huge impact on the code. 

This is one of the most popular obfuscation techniques. It allows you to wrap your functions and make them harder to understand. 


Avoid Regular Expressions

This is one of the techniques that you should definitely avoid. Regular expressions are used to match patterns in strings. 


That’s why they are so popular for obfuscation. However, they can be easily reverse-engineered. 


The best way to deal with this problem is to use the techniques described above. That will make your code much harder to understand.


Wrap Functions With Functions

This is another common technique when you want to obfuscate your code. You can wrap any function with a function that manipulates the code in some way. The first function is the one that you want to obfuscate. 


The second one is going to be easier to understand.  You can use this technique with any kind of code. That includes your functions, variables, and even your object declaration. 


You can use this technique to make your code harder to understand or to hide some values.

Wrap Calls With Jumps

Jumps are the perfect way to obfuscate your function calls. You can use them to move your call from one place to another. 


That way, it’s going to be much harder to understand what you are doing. That’s especially true when your call is into a very long function. 


Using jumps can make it almost impossible to understand what you are doing.

Pre-Processing

One of the most useful features in JavaScript is bytecode caching. This means that when you apply an item's steps again, the cache will be reused and any changes made to it earlier won't affect it. 

Preprocessing JavaScript is done by invoking a function with one parameter, 'value', and the user-provided function body. 

function (value)

{

   return (value - 32) * 5 / 9

}

This means that you should run scripts on your code before you send it to the browser. Pre-processing scripts can make it harder for an attacker to reverse engineer your code

Mix-and-match

This is one of the most interesting techniques to discuss. It’s really hard to describe in one article, but it can be used in many ways. 


The best way to describe this technique is by mixing different techniques together. This means that you can use one technique for one function, and another technique for another function. 

It will make it even harder for anyone to reverse engineer your code. It’s important to note that you should use all these techniques together. 

This will make it nearly impossible for anyone to reverse engineer your code.

Conclusion

This article covered the most popular ways to obfuscate your JavaScript code. Have in mind that these techniques are used for good reason and make your code harder to reverse engineer. 


In fact, these techniques can make your code completely unreadable. So, use them carefully and only when you really need them.  


Now, you can start applying these techniques in your code and make it harder to read. The best way to do that is to add comments to your code. 


That way, you can add explanations on how you are implementing the code or why you wrote it that way.

Comments