3. Intro
Functions
Arrays
Asyncrounus Javascript
Awful and bad parts
References
Brief History
Facts about JS
Outline
1 Intro
2 Functions
3 Arrays
4 Asyncrounus Javascript
5 Awful and bad parts
6 References
Moamen Mokhtar, Usama Elnily JavaScript
4. Intro
Functions
Arrays
Asyncrounus Javascript
Awful and bad parts
References
Brief History
Facts about JS
What is Javascript
The world most missunderstood programming language
(Neither Java nor Script!)
Lots of design errors.
Moamen Mokhtar, Usama Elnily JavaScript
5. Intro
Functions
Arrays
Asyncrounus Javascript
Awful and bad parts
References
Brief History
Facts about JS
History
In 1992, James Gosling and java.
Netscape (Berndan Eich) and LiveScript.
Sun, Netscape and JavaScript.
Moamen Mokhtar, Usama Elnily JavaScript
6. Intro
Functions
Arrays
Asyncrounus Javascript
Awful and bad parts
References
Brief History
Facts about JS
Javascript the language
Load and go delivery.
Loose typing.
Objects as general containers.
Prototypal inheritance.
Lambda.
Linkage through global variables.
Moamen Mokhtar, Usama Elnily JavaScript
7. Intro
Functions
Arrays
Asyncrounus Javascript
Awful and bad parts
References
Brief History
Facts about JS
Facts about JS
NaN
NaN === NaN
==
’1’ == 1
” == false
typeof
typeof ”help”.toString;
for .. in
obj.
obj[’ ’]
Moamen Mokhtar, Usama Elnily JavaScript
8. Intro
Functions
Arrays
Asyncrounus Javascript
Awful and bad parts
References
Function definition
Augmenting
Scope
Arguments
Apply vs. Call
Closure
Curry
Memoization
Outline
1 Intro
2 Functions
3 Arrays
4 Asyncrounus Javascript
5 Awful and bad parts
6 References
Moamen Mokhtar, Usama Elnily JavaScript
9. Intro
Functions
Arrays
Asyncrounus Javascript
Awful and bad parts
References
Function definition
Augmenting
Scope
Arguments
Apply vs. Call
Closure
Curry
Memoization
Function definition
var foo = function();
function foo ();
Moamen Mokhtar, Usama Elnily JavaScript
10. Intro
Functions
Arrays
Asyncrounus Javascript
Awful and bad parts
References
Function definition
Augmenting
Scope
Arguments
Apply vs. Call
Closure
Curry
Memoization
Augmenting
Function.prototype.method = function(name , func)
{
this.prototype[name] = func;
return this;
};
Moamen Mokhtar, Usama Elnily JavaScript
11. Intro
Functions
Arrays
Asyncrounus Javascript
Awful and bad parts
References
Function definition
Augmenting
Scope
Arguments
Apply vs. Call
Closure
Curry
Memoization
Scope I
No block Scope.
Hoisting.
foo (); // not visible
bar (); // visible
var foo = function (){
...
};
function bar (){
...
};
Moamen Mokhtar, Usama Elnily JavaScript
12. Intro
Functions
Arrays
Asyncrounus Javascript
Awful and bad parts
References
Function definition
Augmenting
Scope
Arguments
Apply vs. Call
Closure
Curry
Memoization
Scope II
function foo (){
function bar() {
return 3;
}
return bar ();
function bar() {
return 8;
}
}
alert(foo ());
Moamen Mokhtar, Usama Elnily JavaScript
13. Intro
Functions
Arrays
Asyncrounus Javascript
Awful and bad parts
References
Function definition
Augmenting
Scope
Arguments
Apply vs. Call
Closure
Curry
Memoization
Scope III
function foo (){
var bar = function () {
return 3;
};
return bar ();
var bar = function () {
return 8;
};
}
alert(foo ());
Moamen Mokhtar, Usama Elnily JavaScript
14. Intro
Functions
Arrays
Asyncrounus Javascript
Awful and bad parts
References
Function definition
Augmenting
Scope
Arguments
Apply vs. Call
Closure
Curry
Memoization
Scope IV
alert(foo ());
function foo (){
var bar = function () {
return 3;
};
return bar ();
var bar = function () {
return 8;
};
}
Moamen Mokhtar, Usama Elnily JavaScript
15. Intro
Functions
Arrays
Asyncrounus Javascript
Awful and bad parts
References
Function definition
Augmenting
Scope
Arguments
Apply vs. Call
Closure
Curry
Memoization
Scope V
function foo (){
return bar ();
var bar = function () {
return 3;
};
var bar = function () {
return 8;
};
}
alert(foo ());
Moamen Mokhtar, Usama Elnily JavaScript
16. Intro
Functions
Arrays
Asyncrounus Javascript
Awful and bad parts
References
Function definition
Augmenting
Scope
Arguments
Apply vs. Call
Closure
Curry
Memoization
Scope VI
var foo = 1;
function bar() {
if (!foo) {
var foo = 10;
}
alert(foo);
}
bar ();
Moamen Mokhtar, Usama Elnily JavaScript
17. Intro
Functions
Arrays
Asyncrounus Javascript
Awful and bad parts
References
Function definition
Augmenting
Scope
Arguments
Apply vs. Call
Closure
Curry
Memoization
Arguments
An array-like variable.
Contains all of the arguments of the functions.
Doesn’t have all the functions of arrays except length().
Moamen Mokhtar, Usama Elnily JavaScript
18. Intro
Functions
Arrays
Asyncrounus Javascript
Awful and bad parts
References
Function definition
Augmenting
Scope
Arguments
Apply vs. Call
Closure
Curry
Memoization
Apply and Call function invocation
Difference between apply and call.
theFunction.apply(valueForThis , arrayOfArgs)
theFunction.call(valueForThis , arg1 , arg2 , ...)
Moamen Mokhtar, Usama Elnily JavaScript
19. Intro
Functions
Arrays
Asyncrounus Javascript
Awful and bad parts
References
Function definition
Augmenting
Scope
Arguments
Apply vs. Call
Closure
Curry
Memoization
Closure
var myObject = function ( ) {
var value = 0;
return {
increment: function (inc) {
value += typeof inc === ’number ’ ? inc : 1;
},
getValue: function ( ) {
return value;
}
}
}( );
Moamen Mokhtar, Usama Elnily JavaScript
20. Intro
Functions
Arrays
Asyncrounus Javascript
Awful and bad parts
References
Function definition
Augmenting
Scope
Arguments
Apply vs. Call
Closure
Curry
Memoization
Curry
Function.method(’curry ’, function ( ) {
var slice = Array.prototype.slice ,
args = slice.apply(arguments),
that = this;
return function ( ) {
return that.apply(null ,
args.concat(slice.apply(arguments )));
};
});
Creates closure to hold arguments of the outer function to be
used in the inner function.
Moamen Mokhtar, Usama Elnily JavaScript
21. Intro
Functions
Arrays
Asyncrounus Javascript
Awful and bad parts
References
Function definition
Augmenting
Scope
Arguments
Apply vs. Call
Closure
Curry
Memoization
Memoization I
var memoizer = function (memo , fundamental) {
var shell = function (n) {
var result = memo[n];
if (typeof result !== ’number ’) {
result = fundamental(shell , n);
memo[n] = result;
}
return result;
};
return shell;
};
Moamen Mokhtar, Usama Elnily JavaScript
22. Intro
Functions
Arrays
Asyncrounus Javascript
Awful and bad parts
References
Function definition
Augmenting
Scope
Arguments
Apply vs. Call
Closure
Curry
Memoization
Memoization II
var fibonacci = memoizer ([0, 1],
function (shell , n) {
return shell(n - 1) + shell(n - 2);
});
var factorial = memoizer ([1, 1],
function (shell , n) {
return n * shell(n - 1);
});
Moamen Mokhtar, Usama Elnily JavaScript
23. Intro
Functions
Arrays
Asyncrounus Javascript
Awful and bad parts
References
Important methods
Outline
1 Intro
2 Functions
3 Arrays
4 Asyncrounus Javascript
5 Awful and bad parts
6 References
Moamen Mokhtar, Usama Elnily JavaScript
24. Intro
Functions
Arrays
Asyncrounus Javascript
Awful and bad parts
References
Important methods
Important methods
array.slice(start, end )
It makes a copy of a portion of the array starting from start to
end.
array.splice(start, deleteCount, item...)
The splice method removes elements from an array, replacing
them with new items.
It is different than delete as delete will replace the deleted
value with undefined
array.sort(comparefn )
The default sort function converts the array entries into strings
and sort lexicographically!.
It is provided with the sorting function (like comparable
objects in java).
Moamen Mokhtar, Usama Elnily JavaScript
25. Intro
Functions
Arrays
Asyncrounus Javascript
Awful and bad parts
References
Why using async. functions
Sometimes-async functions
Throwing errors from callbacks
Outline
1 Intro
2 Functions
3 Arrays
4 Asyncrounus Javascript
5 Awful and bad parts
6 References
Moamen Mokhtar, Usama Elnily JavaScript
26. Intro
Functions
Arrays
Asyncrounus Javascript
Awful and bad parts
References
Why using async. functions
Sometimes-async functions
Throwing errors from callbacks
Using async. functions
Prefered with discontinous events to prevent frozen clients.
What is a callback?
Moamen Mokhtar, Usama Elnily JavaScript
27. Intro
Functions
Arrays
Asyncrounus Javascript
Awful and bad parts
References
Why using async. functions
Sometimes-async functions
Throwing errors from callbacks
for(vari =1;i <=3;i++){
setTimeout(function (){ console.log(i);} ,0);
};
Moamen Mokhtar, Usama Elnily JavaScript
28. Intro
Functions
Arrays
Asyncrounus Javascript
Awful and bad parts
References
Why using async. functions
Sometimes-async functions
Throwing errors from callbacks
The devil is in the details
Javascript is single threaded.
Meet the queue.
Moamen Mokhtar, Usama Elnily JavaScript
29. Intro
Functions
Arrays
Asyncrounus Javascript
Awful and bad parts
References
Why using async. functions
Sometimes-async functions
Throwing errors from callbacks
Sometimes-async functions I
Functions that are async sometimes, but not at other times.
Example: Async functions with caching.
var socketsCache ={};
function openWebSocket(serverAddress ,callback ){
var socket;
if(serverAddress in webSocketCache ){
socket=webSocketCache [serverAddress ];
if(socket.readyState === WebSocket.OPEN ){
callback ();
}
....
Moamen Mokhtar, Usama Elnily JavaScript
30. Intro
Functions
Arrays
Asyncrounus Javascript
Awful and bad parts
References
Why using async. functions
Sometimes-async functions
Throwing errors from callbacks
Sometimes-async functions II
}else{
socket=newWebSocket(serverAddress );
webSocketCache [serverAddress ]= socket;
....
};
return socket;
};
var socket=openWebSocket(url ,function (){
....
});
....
Moamen Mokhtar, Usama Elnily JavaScript
31. Intro
Functions
Arrays
Asyncrounus Javascript
Awful and bad parts
References
Why using async. functions
Sometimes-async functions
Throwing errors from callbacks
Throwing errors from callbacks
Can we catch error thrown from a callabck ?
try{
setTimeout(function (){
throw new Error(’Catch_me_if_you_can !’);
},0);
}catch(e){
console.error(e);
}
Moamen Mokhtar, Usama Elnily JavaScript
33. Intro
Functions
Arrays
Asyncrounus Javascript
Awful and bad parts
References
Awful and bad parts I
global variables
A non-declared variable is considered global.
Semicolon insertion
return
{
status: true
};
Moamen Mokhtar, Usama Elnily JavaScript
34. Intro
Functions
Arrays
Asyncrounus Javascript
Awful and bad parts
References
Awful and bad parts II
Reserved Words
Use them within quotes.
Access with subscript
object = {case: value }; // illegal
object = {’case ’: value }; // ok
object.case = value; // illegal
object[’case ’] = value; // ok
Bitwise Operators
Very slow!
Moamen Mokhtar, Usama Elnily JavaScript
35. Intro
Functions
Arrays
Asyncrounus Javascript
Awful and bad parts
References
References
Outline
1 Intro
2 Functions
3 Arrays
4 Asyncrounus Javascript
5 Awful and bad parts
6 References
Moamen Mokhtar, Usama Elnily JavaScript
36. Intro
Functions
Arrays
Asyncrounus Javascript
Awful and bad parts
References
References
References
Douglas Crockford.
JavaScript: The Good Parts.
O’Reilly, 2008.
Trevor Burnham.
Async JavaScript.
The Pragmatic Programmers, 2012.
Moamen Mokhtar, Usama Elnily JavaScript
