Tips & Tricks of JavaScript

learnThemByHeart.js

/* Collection by Marcin Kumorek © 2013 */

/* falsy values */
/*
null
undefined
''
0
NaN
false
*/

/* GOTCHAS! */
var foo = null;
typeof foo; // "object"
var bar = NaN;
typeof bar; // "number"
var NaN = "string";
typeof NaN; // "string"
/* getting NaN */
foo = "string" * 2;
foo = "string" / 2;
foo = +"string";
foo = +[0,1,2];
foo = undefined++;

/* function declaration vs. function expression */
foo(); // 'foo'
function foo() {
  console.log('console.log inside foo function()');
  return 'foo';
}

bar(); // TypeError: Property 'bar' of object [object Object] is not a function
var bar = function() {
  console.log('console.log inside bar function()');
  return 'bar';
};

/* +, ++, +=, -= */
var foo = '1';
// foo++; // return 1 but foo == 2
// ++foo; // return 2 and foo == 2
//
// but ++ !== +=
//
// foo += 1; // '11'
// +foo // 1
// -foo // -1

// !! -= does not behave like += !!
// foo -= 1 // 0
// foo-- // 0

/* multiple assignments */
var foo = 1;
var bar = 2;
foo += bar += 3; // foo == 6, bar ==5

var foo = '1';
var bar = '2';
foo += bar += 3; // foo == '123', bar == '23'

/* !!! WARNING !!! */
var foo = '1';
var bar = '2';
foo += bar++; // foo == '12', bar == 3

var foo = 3;
var bar = 2;
foo -= bar -= 1; // foo == 2, bar == 1

var foo = '1';
var bar = '2';
foo -= bar -= '1'; // foo == NaN, bar == NaN

/* !!! WARNING !!! */
var foo = '1';
var bar = '2';
foo -= bar -= 1; // foo == 0, bar == 1

/* && */
var foo = 1;
var bar = function() { return 'bar'; };
var foobar = foo && bar;
foobar(); // 'bar'

/* !!! WARNING !!! */
var foo = false;
var bar = function() { return 'bar'; };
var foobar = foo && bar;
foobar(); // TypeError: boolean is not a function

var foobar = function() {};
foobar.toString() == "" + foobar // true

/*
to get a timestamp in miliseconds you create new Date Object
or simply convert Date to number by preceding with +
*/
new Date().getTime() == +new Date();
// divide by 1000 to get seconds
Math.round(+new Date() / 1000);

/* Array */
var arr = [];
arr.length; // 0
typeof arr; // 'object'
var foo = [,,,];
foo.length; // IE 3, FF 4
typeof foo[2]; // undefined

/* exercise */
var x = [typeof 5, typeof null][1];
typeof typeof x; // 'string'

/* functions */
var i = 5;
var foo = function() {
    return i++;
};
foo(); // 5

var fn = function() {};
typeof fn(); // undefined

/* simple check with instanceof is not always working ie. when array was created in other iframe */
var arr = []; console.log(arr instanceof Array) // true
/* in ECMAScript 1.8.5 you can check if something is an array using isArray method on Array */
Array.isArray(arr); // true
/* in case the method is not avaiable use polyfill */
if (!Array.isArray) {
  Array.isArray = function (vArg) {
    return Object.prototype.toString.call(vArg) === "[object Array]";
  };
}

/* jQuery */
/* to find if element is available on page */
if ($(selector).length) {
  // if greater than 0 it is truthy so we can do something here
}