JavaScript

Scripting language
Dynamic
Weakly typed
Prototype based
First class functions
(OO, imperative, functional)
Asyncronous

Hello World

 console.log('hello world!');

Variables

var variable;var integer = 1;var float = 1.3;var bool = truevar string = 'monkey';

Operators

var a = 1 + 1; // 2var b = 4 - 2; // 2var c = 2 * 2; // 4var d = 8 / 4; // 2var e = true || false; // truevar f = true && false; // falsevar g = !true; // falsevar h = (1 + 2) * 3; // 9var i = 1 == 1; // truevar j = 2 != 3; // true

Functions

function add(a, b) {  return a + b;}var add = function (a, b) {  return a + b;};

var displayClosure = function() {
  var count = 0;  return function () {    return ++count;  };};
var inc = displayClosure();inc(); // returns 1inc(); // returns 2
inc(); // returns 3

arrays

var arr = [1, 2, 3, 4];
arr[2]; // 3
var mixedArr = [1, 1.3, 'monkey'];
arr.push(5); // [1, 2, 3, 4, 5]

Object

var obj = {  key: 'value',  otherKey: ['some', 'other', 'values'],  method: function() {    return this.key + ' it is';  }};
obj.key; // 'value'obj['otherKey']; // ['some', 'other', 'values']obj.method(); // 'value it is'

Control flow statements

var a = 1;if (a == 1) {  console.log('a is one')}
if (a == 2) {  console.log('wow such two :(');} else {  console.log('wow so not two :(');}

var i = 10;if (i < 5) {
  console.log('smaller than 5');} else if (i < 7) {  console.log('bigger than 4 and smaller than 7');} else {  console.log('bigger than 6');}

var a = 0;
while (a < 5) {  a += 1;  console.log(a);}

for (var i = 0; i < 7; i++) {  console.log(i);}

var arr = ['wow', 'so', 'very', 'such', 'array', 'wow'];
for (var i = 0; i < arr.length; i++) {  console.log(i);}

Learn a new language

use it!

its just an other programming language

1.

Create a function (called bizzer),

which takes a number and returns it,

if it's not dividable by 7 and 'bizz' if it is.

2.

Make it return 'bizz' if the number contains 7 as a digit

3.

Make it return 'bizz',

if the sum of the digits is dividable with 7

4.

Make it general!

Should take the "modulo" number,

and the returned message as argument.

Should throw error if "modulo" is bigger than 9

5.

Create a function which take a number and it start to play,

the bizz game with 3 on the numbers from 1 till the taken number. Returns a string like:

"1 2 bizz 4 5 bizz 7" ...

6.

Should play it with 2 numbers at the same time:

3 -> bizz,

5 -> fizz

so:

"1 2 bizz 4 fizz bizz 7 8 bizz fizz 11 bizz bizz 14 bizzfizz"

7.

Make it generic should take an array of objects like:

{modulo: 3, message: 'bizz'}

5 hard things in javascript

Scope

Function scope

for (var i = 0; i < 7; ++i) {  var a = i + 3;}console.log(a); // 10

function some() {  var a = 4;  return a;}console.log(a); // undefined

for (var i = 0; i < 7; ++i) {  (function (index) {    var a = index + 3;  })(i)}console.log(a);

function addHandlers(nodes) {  for (var i = 0; i < nodes.length; i += 1) {    nodes[i].onclick = function (e) {      alert(i);    };  }}

function addHandlers(nodes) {  for (var i = 0; i < nodes.length; i += 1) {    nodes[i].onclick = (function(i) {      return function (e) {        alert(i);      }    })(i);  }}

ARGUMENT PAssing

function three(a, b, c) {  console.log(a, b, c);}three(1); // 1 undefined undefinedthree(1, 2, 3, 4); // 1 2 3

function increment(a) {
  a++;  console.log(a);}var b = 1;increment(b) // 2console.log(b);

function incrementArr(arr) {  arr[0]++;}var a = [1, 2];incrementArr(a);console.log(a); // [2, 2]

function incrementObj(obj) {  obj['monkey']++;}var o = {monkey: 1};incrementArr(o);console.log(o); // {monkey: 2}

function sum() {  var i, sum = 0;  for (i = 0; i < arguments.length; ++i) {    sum += arguments[i];  }  return sum;};
console.log(sum(4, 8, 15, 16, 23, 42)); // 108

THIS

var obj = {  property: 1,  getProperty: function() {    return this.property;  }}

function test(a, b) {  console.log(this, a, b);}test(1, 2); // window 1 2test.call(obj, 1, 2); // obj 1 2test.apply(obj, [1, 2]); // obj 1 2

Object creation

var obj1 = {};var obj2 = new Object();

var obj = {apple: 1};
function Constructor(p) {  this.apple = 1;  this.pear = p;}
function factory(p) {  self = {};  self.apple = 1;  self.pear = p;
  return self;}
var newObj1 = new Constructor(2);var newObj2 = Object.create(obj, {pear: {value: 2}});var newObj3 = factory(2);

Prototype

function Constructor(a) {  this.apple = a;}
Constructor.prototype = {pear: 2};
var obj = new Constructor(1);
console.log(obj.apple); // 1console.log(obj.pear); // 2

obj.pear = 3;
console.log(obj.pear); // 3

function Point(x, y) {  this.x = x;  this.y = y;}
Point.prototype.getSize = function() {  return Math.sqrt(this.x * this.x + this.y * this.y);}
var point = new Point(3, 4);point.getSize(); // 5

JavaScript for Beginners

By eggdice