• Stars
    star
    137
  • Rank 266,121 (Top 6 %)
  • Language
  • License
    MIT License
  • Created almost 9 years ago
  • Updated over 5 years ago

Reviews

There are no reviews yet. Be the first to send feedback to the community and the maintainers!

Repository Details

Examples of not obvious behaviors for javascript beginner programmers

Javascript Anomaly Page

This page created for javascript beginner programmers to show not obvious behaviors, let's call all of them "anomalies"

Assignment Anomaly

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

console.log(typeof a);
// output: undefined

console.log(typeof b);
// output: number


var a={},
    b={key:'b'},
    c={key:'c'};

a[b]=123;
a[c]=456;

console.log(a[b]);
// output: 456

Reference Anomaly

var a = { value: 1 };
var b = a;
b.value = 2;

console.log(a.value);
// output: 2

New Anomaly

var myClass = function() {
  this.a = 1;
  this.b = 2;
};

var myClass2 = function() {
  this.a = 1;
  this.b = 2;

  return {
    a: 2
  };
};

var myObject = new myClass();
var myObject2 = new myClass2();

console.log(typeof myObject.b);
// output: number
console.log(typeof myObject2.b);
// output: undefined

Closure Anomaly

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

// output: 3
// output: 3
// output: 3

Context Anomaly

var message = {
  content: 'Hello world!',
  send: function () {
    console.log(this.content)
  }
};

setTimeout(message.send);

// output: undefined

Delete Anomaly

var x = 1;
var output = (function(){
  delete x;
  return x;
})();

console.log(output);
// output: 1

Type Anomaly

console.log(typeof null);
// output: object


console.log(null instanceof Object);
// output: false

console.log(typeof NaN);
// output: number

console.log(typeof function () {});
// output: function
// but there's no function type http://ecma-international.org/ecma-262/5.1/#sec-8

Compare Anomaly

console.log('' == '0');
// output: false

console.log(0 == '');
// output: true

console.log(0 == '0');
// output: true

console.log(false == 'false');
// output: false

console.log(false == '0');
// output: true

console.log(false == undefined);
// output: false

console.log(false == null);
// output: false

console.log(null == undefined);
// output: true

console.log(' \t\r\n ' == 0);
// output: true

console.log("abc" == new String("abc"));
// output: true

console.log("abc" === new String("abc"));
// output: false

console.log(0.1 + 0.2 == 0.3);
// output: false
// sum of float values is not equals obvious float value

console.log(NaN != NaN);
// output: true

console.log(NaN == NaN);
// output: false

console.log(NaN === NaN);
// output: false

console.log(!!undefined);
// output: false

console.log(!!NaN);
// output: false

console.log(!!null);
// output: false

console.log([1, 2, 3] == [1, 2, 3]);
// output: false
// How to detect array equality in JavaScript?

console.log(new Array(3) == ",,");
// output: true

console.log(new Array(3) === ",,");
// output: false

console.log("a" > "b");
// output: false

console.log("abcd" < "abcd");
// output: false

console.log("abcd" < "abdc");
// output: true

console.log("123" > "13");
// output: false

Math Anomaly

console.log("2" * "3");
// output: 6

console.log("2" * "3" + "4");
// output: "64"

console.log("2" * "3" + "4" * "5")
// output: 26

console.log("test " + 1);
// output: test 1

console.log("test " + 1 + 1);
// output: test 11

console.log("days" * 2);
// output: NaN

console.log(null + null);
// output: 0

console.log({} + {});
// output: [object Object][object Object]

console.log({} + []);
// output: [object Object]

console.log({} + 5);
// output: [object Object]5

console.log([] + {});
// output: [object Object]

console.log([] + []);
// output:
// will output empty string ''

console.log([] + 5);
// output: 5

console.log(++[[]][+[]]+[+[]]);
// output: "10"

Logic Anomaly

console.log(0 || 'a');
// output: a

console.log(0 || undefined);
// output: undefined

console.log({} && 'a');
// output: a

console.log(0 && 'a');
// output: 0

Variable scope Anomaly

function Foo(value) {
    this.bar = value;
}
var test = new Foo('test');
console.log(test.bar);
// output: test

Foo('test');
console.log(bar);
// output: test

Function Arguments Anomaly

(function (foo, bar) {
    console.log(typeof arguments);
    // output: object

    arguments[0] = 999;
    console.log(foo);
    // output: 999
})(1, 2);

toString Anomaly

try {
    eval("2.toString()")
} catch (err) {
    console.log(err.message)
    // output: Unexpected token ILLEGAL
}

console.log(2..toString());
// output: 2

console.log(2 .toString());
// output 2

console.log((2).toString());
// output: 2

console.log([1, 2, 3].toString())
// output: 1,2,3

var a = {b: 2, c: 3};
console.log(a.toString())
// output: [object Object]

New line Anomaly

function foo() {
  return "Yeah";
}
 
function bar() {
  return 
    "Yeah";
}

console.log(foo());
// output: Yeah

console.log(bar());
// output:

Variable hoisting Anomaly

var a = 1; 
function bar() { 
    if (!a) { 
        var a = 10; 
    } 
    console.log(a); 
} 
bar();
// output: 10
var a = 1;
function b() {
    a = 10;
    return;
    function a() {}
} 
b(); 
console.log(a);
// output: 1

Note that anomaly word has only literary turnover, it's not a technical term.

More Repositories

1

redux-universal-boilerplate

Boilerplate for react universal (isomorphic) application based on flux architecture (redux implementation)
JavaScript
72
star
2

javascript.interview

This documents contains the most actual and important questions for Javascript Developer position
56
star
3

fps

Browser first-person 2.5D shooter
TypeScript
54
star
4

browser-rendering-performance

A collection of browser rendering performance resources
48
star
5

minesweeper

Minesweeper game on React with Windows 95 style
TypeScript
30
star
6

javascript.memory-leaks

Example and resources with fixes and explanations about Javascript memory leaks
18
star
7

ufostation.tech

Ufostation: tech notes and podcast
Astro
17
star
8

yii2-SyncSocial

Extension synchronizes your Active Record model with social networks.
PHP
15
star
9

sokoban

Sokoban game implementation on elm language
Elm
13
star
10

sortable-list

TypeScript
12
star
11

py-GithubArt

Github Contributions table Writer. Just for fun
Python
10
star
12

wtfts

Tricky TypeScript Examples
9
star
13

ufostation.podcast

8
star
14

vanilla-javascript

JavaScript
4
star
15

yii2-SyncSocial-demo

There's a demo yii2 application for yii2-SyncSocial extension.
PHP
4
star
16

russian-blad-webpack-plugin

JavaScript
3
star
17

fctf-ui

JavaScript
3
star
18

aot-2023

TypeScript
3
star
19

event-loop-machine

Example of Event Loop working for presentation "Event Loop in the Browser Javascript"
JavaScript
3
star
20

WebsocketUI

Tool for connecting and sending data to public WebSocket. Build on Flux architecture
JavaScript
3
star
21

my-javascript-code

Набор простых и очевидных рекомендация по написанию JavaScript кода
3
star
22

javascript.quiz

Not daily javascript issues that can be used for quiz
2
star
23

matrix-ui

TypeScript
1
star
24

image-to-ascii-transformer

TypeScript
1
star
25

YiiNode

Simple yiiframework based CMS with tree structure
PHP
1
star
26

ssr-no-deps

JavaScript
1
star