Javascript Cheatsheet:

Javascript Strings

String Access:

• Accessing characters .chartAt(), 'dog'.chartAt(1) returns 0.

• .chartAt(index); takes an index which starts at 0 and returns the character at that index.

• .chartAt(start, finish) will returns character at start to finish position.

  String Search:

• .indexOf(searchValue[fromIndex]) will help you search for for sub string within a string.

• this function takes string to be searched and optional parameter for the starting index for the search & -1 if nothing is found.

• the function .startsWith(?) will help you find out what the string starts with.

• the function .endsWith(?) will returns true if the string ends with the parameter string.

• to replace a string we use the function ' .replace('str1','str2')'

• To check the occurance of a search string simply check if -1 was returned from .indexOf(?).

    var str = 'hey there Batch';
    var count = 0;
    var pos = str.indexOf('a');
    while(pos != -1){
        count++;
        pos = str.indexOf('a', pos + 1)
    }

Regular Expressions:

Basic Regex:

• ^ start of a string
• \d: finds any digit
• [abc] finds an character between the brackets
• [^abc] finds character not in the bracket
• [0 - 9] finds digit between the bracket
• [^0 - 9] finds digit not between the bracket
• (x|y) finds any of the alternatives specified

RegExp functions:

• search(?) test for matches in a string and returns the index of the match.
• match(?) test for matches in a string and returns all the matches.
• exec(?) returns the first match.
• test(?) returns true of false.

    var str = 'hey there Batch';
    var cn = str.search(/here/);
    console.log(cn);

Objects:

Base64 Encoding:

• The btoa(?) function creates a base64 encoded ASCII string from the string.
• The atob(?) function will decode the base64 encoded string.

String Shortening:

var Dictionary = "sjhlksafhjksdhfjkdsflsdjlifhisdoncmx.nvmcx,grdj".split("");

    function encoded(num) {
        var base = DICTIONARY.length
        var encoded="";

        if(num == 0){
            return DICTIONARY[0];
        }else{
            while(num > 0){
                encoded += DICTIONARY[(num % base)];
                num = Math.floor(num /base);
            }
        }

        return reverseWord(encoded);
    }

    function reverseWord(str){
        var reversed ="";
        for ( var i= str.length - 1; i >=0; i-- ){
            reversed +=str.charAt(i);
        }

        return reversed;
    }

    function decodeId(){
        var base = DICTIONARY.length;
        var decoded = 0;
        for (var index =0; index < id.split('').length; index++ ){
            decoded = decoded*base + DICTIONARY;
            indexOf(id.chartAt(index));
        }

        return decoded;
    }

Javascript Arrays:

var arr = [1, 2, 3 . 4].

• To access array elements we use its index arr[?]

• To insert an array element arr.push(?)

• To remove an element at the end arr.pop(?) another option to remove is arr.shift(?)

Iteration:

• this method of iteration will call indices individually, and you will access the data inside it.

    var arr = [1,2,3];

    for(var index in arr){
        console.log(arr[index]);
    }

• this method will allow you to access and use the objects of the array individually each time you get one, you can do your checks this way.

    var arr = [1,2,3];

    for(var element of arr){
        console.log(element);
    }

forEach():

• this method is better than the other iteration methods because it can break out of the iteration or skip certain elements of the array.

    var arr = [1,2,3];

    arr.forEach((el, in) => {
        console.log(el);
    }
    )

Array Helper Functions:

• .slice(begin,end) will return us a portion of a given array taking the begining and end index of what you selecting.

    var arr = [1, 2, 3, 4, 5];
    arr.slice(1, 2); // returns [2] 
    arr.slice(2, 4); // returns [3, 4]

• .from() function will help us to create a new array from an existing one.

    var arr = [1, 2, 3, 4, 5];
    var arr2 = Array.from(arr);

• .splice() takes three params: begining & end index with number of things in the middle.After aplying the method the added other items will change the array.

    var arr = [1, 2, 3, 4, 5];
    arr.splice(); // returns [] 
    arr.splice(1, 2); // returns [2, 3], modifying arr = [1,4]
    arr.splice(1,2,5,6,7) // returns [2, 3], arr = [1, 5, 6, 7, 4]

• .concat(?) will be used to add another array into an existing one. The method will return a modified array but stull the original one remains untouched.

    var arr = [1, 2, 3, 4, 5];
    arr.concat([1, 2]); // returns [1, 2, 3, 4, 5, 1, 2] and arr still remains the same

Spread Operator:

• this operator will allow use to access all elements individually.

    var arr = [1, 2, 3, 4, 5];

    function printNumz(a, b, c, d){
        return a + b + c + d;
    }
    console.log(printNumz(...arr))

Array functional methods:

• The .filter() method is used for filtering elements or checking a condition like the following example:

    var arr = [1, 2, 3, 4, 5];
    arr.filter(function (item) {
        return item > 2;
    }); // returns [3,4,5]

• This method can allow you to perform other operations to the elements as you reach them in the erray.

• We also have the .reduce() function that will combine all the elements in the erray into one value, using the passed function.

    var sum = [1, 2, 3, 4, 5].reduce(function(prevVal, currVal, index, array){
        return prevVal + currVal;
    });

Cookies:

• to check if cookies are enabled we use the pattern with corresponding code to set the cookie, note that it might not work for older browsers.

    if(navigation.cookieEnabled === False) {
        // Do something...
    }

    var COOKIE_NAME = 'Example cookie'; // naming the cookie.
    var COOKIE_VALUE = 'Something '; // the value of the cookie.
    var COOKIE_PATH = '/foo/bar'; // GIVE THE COOKIE A PATH.
    var COOKIE_EXPIRES;

    COOKIE_EXPIRES = (new Date(Date.new() + 6000 )). toUTCString();

    document.cookie += COOKIE_NAME + "=" + COOKIE_VALUE + "; expires=" + COOKIE_EXPIRES + "; path=" + COOKIE_PATH;

• Reading the cookie:

    var name = name + "=" + cookie_array = document.cookie.split(';'),
    cookie_value;
    for (var i = 0; i<cookie_array[i].length; i++){
        var cookie = cookie_array[i];
        while(cookie.charAt(0) == ''){
            cookie = cookie.substring(1, cookie.length);
        }
        if(cookie.indexOf(name) == 0){
            cookie_value = cookie.substring(name.length, cookie.length);
        }
    }

• LocalStorage, sessionStorage are like js objects, so we can use them like they are:

   localStorage.greet = 'hey there'; // window.localStorage.setItem('')

   localStorage.greet; // window.localStorage.getItem('')

   delete localStorage.greet; // Same as: window.localStorage.removeItem('')

• sessionStorage uses the same storage as the localStorage but it will only be avaliable per session or for that window.

Web Workers:

• a web worker is a way to run scripts in background threads var webworker = new Worker("./path/to/webworker.js");

• you can also inject a script as a worker in a string the string is used in URL.createObjectURL():

    var workerData = "function someFunction() {}; console.log('More code');";
    var blobURL = URL.createObjectURL(new Blob(["(" + workerData + ")"], { type: "text/javascript" }));
    var webworker = new Worker(blobURL);

• service worker is a event-driven worker bound to the original site, it can control the site, and use its resources.

• ITS A PROGRAMMABLE NETWORK PROXY,

• IT WILL BE TERMINATED WHEN NOT IN USE.
• IT HAS A LIFE CYCLE UNBOUND TO THE WEB PAGE.
• IT NEEDS HTTPS.