odykyi/JS.MD

Created September 6, 2018 07:41

Star () You must be signed in to star a gist
Fork () You must be signed in to fork a gist

Learn more about clone URLs
Clone this repository at <script src="https://gist.github.com/odykyi/270c4d546f63cb0bd682d4bf302a7f2f.js"></script>
Save odykyi/270c4d546f63cb0bd682d4bf302a7f2f to your computer and use it in GitHub Desktop.

Download ZIP

JavaScript idiosyncrasies https://odykyi.github.io/javascript-idiosyncrasies/ javascript js brainfuck es6 es7 ecmascript ecmascript6 ecmascript2015 ecmascript2016 ecmascript2017 ecmascript5 react reactjs vue vuejs vuejs2 angular angularjs

Raw

JS.MD

JavaScript idiosyncrasies

https://odykyi.github.io/javascript-idiosyncrasies/

This is a collection of things in JavaScript that may not be well recognized, espcially to beginners.

Disclaimer: Some of these snippets are simply to demonstrate the quirky parts of JavaScript and by no means encourage best practices and should never be seen in production code.

Q. What's the result?

(function() {
  var obj = {
     valueOf: function(){
        return 3;
     },
     toString: function(){
        return 2;
     },
  }
  return obj + 4;
})();

A.

JSBin | JSBin explained

Q. What's the result?

(function() {
    var foo = new Object();
    var bar = new Object();
    var map = new Object();

    map[foo] = 'foo';
    map[bar] = 'bar';

    return map[foo];
})();

A.

"bar"

JSBin | JSBin explained

Q. What's the result?

(function() {
    return NaN === NaN;
})();

A.

false

JSBin | JSBin explained

Q. What's the result?

(function() {
    function foo() {
        return 'a';
    }

    return foo();

    function foo() {
        return 'b';
    }
})();

A.

"b"

JSBin | JSBin explained

Q. What's the result?

(function(limit) {
  for (var i = 0; i < limit; i++) {
    setTimeout(function() {
      console.log(i);
    }, 0);
  }
})(3);

A.

3
3
3

JSBin | JSBin explained

Q. What's the result?

(function(a, b) {
  arguments[1] = 3;
  return b;
})(1, 2);

A.

JSBin | JSBin explained

Q. What's the result?

(function(a, b, c) {
  delete arguments[0];

  return arguments.length;
})(1, 2, 3);

A.

JSBin | JSBin explained

Q. What's the result?

(function() {
    return (function (a, b) {}).length;
})();

A.

JSBin | JSBin explained

Q. What's the result?

(function(a, b) {
   var foo, bar;

   foo = (bar = a, b);

   return foo;
})(1, 2);

A.

JSBin | JSBin explained

Q. What's the result?

(function(undefined) {
  var foo;
  return foo === undefined;
})(true);

A.

false

Q. What's the result?

(function(n) {
    return ~(n);
})(-3);

A.

JSBin | JSBin explained

Q. What's the result?

(function(n) {
    return ~~n;
})(-1.5);

A.

-1

JSBin | JSBin explained

Q. What's the result?

(function(x) {
    return !!x;
})('a');

A.

true

JSBin | JSBin explained

Q. What's the result?

(function() {
    return typeof null === 'null';
})();

A.

false

JSBin | JSBin explained

Q. What's the result?

(function() {
    return +(new Date())
})();

A.

1393812837139

JSBin | JSBin explained

Q. What's the result?

(function() {
    return (new Date()).valueOf();
})();

A.

1393812845834

JSBin | JSBin explained

Q. What's the result?

(function() {
    return ''+(new Date());
})();

A.

"Sun Mar 02 2014 18:14:01 GMT-0800 (PST)"

JSBin | JSBin explained

Q. What's the result?

(function() {
    var foo = 'a';
    (function(foo) {
        foo = 'b';
    })(foo);
    return foo;
})();

A.

"a"

JSBin | JSBin explained

Q. What's the result?

(function() {
    return arguments.toString();
})();

A.

"[object Arguments]"

JSBin | JSBin explained

Q. What's the result?

(function() {
    return (function(){}) === (function(){});
})();

A.

false

JSBin | JSBin explained

Q. What's the result?

(function(n) {
    return n === new Number(n);
})(10);

A.

false

JSBin | JSBin explained

Q. What's the result?

(function(x) {
    return new String(x) === x;
})('a');

A.

false

JSBin | JSBin explained

Q. What's the result?

(function() {
    return [1+1] === [2];
})()

A.

false

JSbin | JSBin explained

Q. What's the result?

(function() {
    return {foo: 'bar'} === {foo: 'bar'};
})();

A.

false

JSBin| JSBin explained

Q. What's the result?

(function() {
    for(;;);
    return 1;
})();

A.

*Infinite loop*

JSBin | JSBin explained

Q. What's the result?

(function() {
    return ['10','10','10','10'].map(parseInt);
})();

A.

[10, NaN, 2, 3]

JSBin | JSBin explained

Q. What's the result?

(function() {
    var o = {
        toString: function() {
            return 'a';
        },
        valueOf: function () {
            return 1;
        }
    };

    return o + o;
})();

A.

JSBin | JSBin explained

Q. What's the result?

(function() {

  var f = function g() {
    return 1;
  };

  return g();

})();

A.

ReferenceError: g is not defined

JSBin | JSBin explained

Q. What's the result?

(function() {
  return void (1+1);
})();

A.

undefined

JSBin | JSBin explained

Q. What's the result?

(function() {

  var a = [1,2];
  var b = a;

  a = [1,2];

  return a === b;

})();

A.

false

JSBin | JSBin explained

Q. What's the result?

(function() {
    var x = 1;

    return (function () {
        return x;

        var x = 2;
    })();
})();

A.

undefined

JSBin | JSBin explained

Q. What's the result?

(function(n) {
    var even = function (num) {
        return (num === 0) || !(even(num - 1))
    };

    var _even = even;

    even = void 0;

    return _even(n);
})(2);

A.

TypeError: undefined is not a function

JSBin | JSBin explained

Q. What's the result?

(function() {
    var n;

    function name() {
        return this.name
    };

    n = name.bind({name: 'foo'});
    n = n.bind({name: 'bar'})

    return n();
})();

A.

"foo"

JSBin | JSBin explained

Q. What's the result?

(function() {
    return ('3' > '12') === ('03' > '12');
})();

A.

false

JSBin | JSBin explained

Q. What's the result?

(function() {
    return Math.pow(2,53) === (Math.pow(2,53) + 1);
}();

A.

true

JSBin | JSBin explained

Q. What's the result?

(function() {
    return Math.pow(2,1024) === Infinity;
})();

A.

true

JSBin | JSBin explained

Q. What's the result?

(function() {
    return (Infinity - 100) === Infinity;
}();

A.

true

JSBin | JSBin explained

Q. What's the result?

(function() {
    return (0.1 + 0.2 === 0.3);
})();

A.

false

JSBin | JSBin explained

Q. What's the result?

(function() {
    return (0.1).toFixed(20);
})();

A.

"0.10000000000000000555"

JSBin | JSBin explained

Q. What's the result?

(function() {
    return parseFloat('3.3.4');
})();

A.

3.3

JSBin | JSBin explained

Q. What's the result?

(function() {
    return 010;
})();

A.

JSBin | JSBin explained

Q. What's the result?

(function() {
    return (parseInt('10000000000000000', 10) ===
            parseInt('10000000000000001', 10)
    );
})();

A.

true

JSBin | JSBin explained

Q. What's the result?

(function(n) {
    return (Function)('var n = n || 2; return n;')(n);
})(1);

A.

JSBin | JSBin explained

Q. What's the result? (assuming window scope)

var a = 1;
b = 1;

(function() {
  return (delete window.a) === (delete window.b);
})();

A.

false

JSBin | JSBin explained

(function(x) {
  var isMatch,
      regex = /[\w]/gi;

  return (regex.test(x) === regex.test(x));
})('a');

A.

false

JSBin | JSBin explained

Q. What's the result?

(function() {
    return ![];
})();

A.

false

JSBin | JSBin explained

Q. What's the result?

(function() {
    return +[];
})();

A.

JSBin | JSBin explained

Q. What's the result?

(function() {
    return [][[]];
})();

A.

undefined

JSBin | JSBin explained

Q. What's the result?

(function() {
    return +!+[];
})();

A.

JSBin | JSBin explained

Q. What's the result?

(function() {
    return []+[];
})();

A.

""

JSBin | JSBin explained

Q. What's the result?

(function() {
    return true + 1;
})();

A.

JSBin | JSBin explained

Q. What's the result?

(function() {
    return 1 / '';
})();

A.

Infinity

JSBin | JSBin explained

Q. What's the result?

(function() {
    return 1 * null;
})();

A.

JSBin | JSBin explained

Q. What's the result?

(function() {
    return new Array() == false;
})();

A.

true

JSBin | JSBin explained

Q. What's the result?

(function() {
  if ([]) {
    return [] == false;
  }
})();

A.

true

JSBin | JSBin explained

Q. What's the result?

(function() {
  return ''.concat(null);
})();

A.

"null"

JSBin | JSBin explained

Q. What's the result?

(function(a, b) {
  return a + + b;
})('a','b');

A.

"aNaN"

JSBin | JSBin explained

Q. What's the result?

(function() {
  Object.prototype.foo = 'foo';

  return foo;
})();

A.

"foo"

JSBin | JSBin explained

Q. What's the result?

(function() {
  return 1000 === 1e3;
})();

A.

true

JSBin | JSBin explained

Q. What's the result?

(function() {
  return 9999999999999999;
})();

A.

10000000000000000

JSBin | JSBin explained

Q. What's the result?

(function() {
  (function() {
    var a = b = 1;
  })();

  return typeof a === typeof b;
})();

A.

false

JSBin | JSBin explained

Q. What's the result?

(function() {
  return Array(3).map(function(o) { return 'a'; });
})();

A.

[undefined, undefined, undefined]

JSBin | JSBin explained

Q. What's the result?

(function() {
  var foo = [0,1,2];
  foo[10] = 10;
  return foo.filter(function(n) { return n === undefined; });
})();

A.

[]

JSBin | JSBin explained

Q. What's the result?

(function(x) {
  var ret = null;

  switch(x) {
    case 'A':
        ret = 'A';
        break;
    default:
        ret = 'unknown';
        break;
  }

  return ret;
})(new String('A'));

A.

"unknown"

JSBin | [JSBin explained](http://jsbin.com/leyaqamuru/1/edit?html,js,consol:w jke)

Q. What's the result?

(function() {
  var x = {};

  return x.prototype === Object.getPrototypeOf(x);
})();

A.

false

JSBin | JSBin explained

Q. What's the result?

(function() {
  function foo() {}
  foo.name = 'bar';

  return foo.name;
})();

A.

"foo"

JSBin | JSBin explained

Q. What's the result?

(function() {
  return Array(5).join(',').length;
})();

A.

JSBin | JSBin explained

Q. What's the result?

(function(x) {
  return x++ + ++x;
})(2);

A.

JSBin | JSBin explained

Q. What's the result?

(function() {
  'use strict';

  let type = typeof foo;
  let foo = 1;

  return type;
})();

A.

ReferenceError: foo is not defined

License

Released under the MIT License.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment