Javascript - Some Useful Tips & Tricks

Use window.name for simple session handling

window object has its own property 'name'. The name of the window is used primarily for setting targets for hyperlinks and forms. Windows do not need to have names. With this property we can achieve simple session storage. Browser preserves the property value (window.name) until the window/tab is closed. 


Labels

You can use a label to identify a loop, and then use the break or continue statements to indicate whether a program should interrupt the loop or continue its execution.
var i, j;

loop1:
for (i = 0; i < 3; i++) {      //The first for statement is labeled "loop1"
   loop2:
   for (j = 0; j < 3; j++) {   //The second for statement is labeled "loop2"
      if (i === 1 && j === 1) {
         continue loop1;
      }
      console.log('i = ' + i + ', j = ' + j);
   }
}

// Output is:
//   "i = 0, j = 0"
//   "i = 0, j = 1"
//   "i = 0, j = 2"
//   "i = 1, j = 0"
//   "i = 2, j = 0"
//   "i = 2, j = 1"
//   "i = 2, j = 2"
// Notice how it skips both "i = 1, j = 1" and "i = 1, j = 2"

Know more about typeof, instanceof and constructor:

typeof: An operator – returns a string indicating the type of the unevaluated operand.

Note: typeof null will return "object", and for most of the object types (Array, Date, Number, Function, String …) will return "object". On IE 6, 7, and 8 a lot of host objects are objects and not functions. For example: typeof alert === 'object'


Type
Result
Undefined
"undefined"
Null
"object"
Boolean
"boolean"
Number
"number"
String
"string"
Host object (provided by the JS environment)
Implementation-dependent
Function object (implements [[Call]] in ECMA-262 terms)
"function"
Any other object
"object"

 Ref: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/typeof

constructor: A reference to the function that created an object. All objects inherit a constructor property from their prototype and it can be changed programmatically 

instanceof: An operator -  which tests presence of constructor.prototype in object prototype chain. 
//EXAMPLE
var obj = {},
arr= [],
d = new Date(),
f1 = new Function(),
f2 = function(){},
s1 ="a string",
s2 = new String(),
n1 = new Number(5),
n2 = 5,
n3 = 3.14;
typeof obj //return "object"
typeof arr //return "object"
typeof d //return "object"
typeof f1 //return "function"
typeof f2 //return "function"
typeof s1 //return "string"
typeof s2 //return "object"
typeof n1 //return "object"
typeof n2 //return "number"
typeof n3 //return "number"
obj instanceof Object //return true
arr instanceof Array //return true
arr instanceof Object //return true
d instanceof Object //return true
d instanceof Date //return true
f1 instanceof Object //return true
f1 instanceof Function //return true
f2 instanceof Function //return true
f2 instanceof Object //return true
s1 instanceof Object //return false
s1 instanceof String //return false
s2 instanceof Object //return true
s2 instanceof String //return true
n1 instanceof Object //return true
n1 instanceof Number //return true
n2 instanceof Object //return false
n2 instanceof Number //return false
n3 instanceof Object //return false
n3 instanceof Number //return false
obj.constructor()//return Object {}
arr.constructor()//return []
d.constructor()//return "(current date)"
f1.constructor()//return function anonymous() { }
f2.constructor()//return function anonymous() { }

s1.constructor()//return ""
s2.constructor()//return ""

n1.constructor()//return 0
n2.constructor()//return 0
n3.constructor()//return 0


Shuffle an array

var arr = [“a”, “b”, 1, 100, 5, 10, 200, 458, 98];
arr = arr.sort(function(){ return Math.random() - 0.5});


Get a random item from an array

var arr = [1,5,6,7,4,3,9,”a”,”xyz”];
var  randomItem = arr[Math.floor(Math.random() * arr.length)];

Max and Min values in an array of numbers

var arr = [1, 100, 5, 10, 200, 458, 98];
var max = Math.max.apply(Math, arr); 
var min = Math.min.apply(Math, arr); 

Variable conversion shortcuts

var x = "1.592",
//to string
str = ""+ x,

//to integer
int = ~~x,  

//to float
float = 1*x,

//to boolean
bool = !!x,

//to array
array = [x]; 

‘yield’ Keyword:

JavaScript 1.7+ supports yield keyword, which is used to suspend execution of a function. Only firefox supports this option for now.

function currentLoop(){
  var i = 0;
  while(true){
    i++;
    yield i;
  }
}

var g= currentLoop();

g.next(); //return 1
g.next(); //return 2
g.next(); //return 3
g.next(); //return 4 

Popular posts from this blog

Simple Animation Using C

Personal Diary - A Mini Project Written in Turbo C With Graphical Interface

Random Bouncing Ball Animation