4. More about ‘Me’
• I build applications on Drupal
• I am an active contributor of code on
Drupal, jQuery and PHP communities
• One of my projects, a real-time
collaboration suite was showcased at
TechCrunch 50 in SF
Azri
11. In time...
LiveScript
became
JavaScript
became
ECMAScript (Standard*)
Azri
12. Misunderstandings...
The name “Java” Prefix
Lisp in C's clothing
Design errors
Poor implementation
Insufficient literature
Mostly adopted by amateurs
Azri
15. Get, Set and Delete
get
object.name
object[expression]
set
object.name = value;
object[expression] = value;
delete
delete object.name
delete object[expression]
Azri
16. Creating New Objects
Using Object Initializers
var obj = {property_1: value_1,
2: value_2,
"property_n": value_n };
Azri
17. Creating New Objects
Using Constructor Function
function car(make, model, year) {
this.make = make;
this.model = model;
this.year = year;
this.display = function() {return this.make+ “ - “ +
this.model + “ - “ + this.year};
}
var mycar = new car("Eagle", "Talon TSi", 1993);
mycar.display();
Azri
18. Object Reference
Objects can be passed as arguments to
functions, and can be returned by
functions.
Objects are passed by reference.
The === operator compares object
references, not values. It returns true
only if both operands are the same object
Azri
21. Working with Prototype
Make an object that you like.
Create new instances that inherit from that
object.
Customize the new objects.
Taxonomy and classification are not
necessary.
Azri
22. Inheritance
function Manager(id, name) {
function Employee(id) {
this.id = id;
this.id = id;
this.name = name;
}
}
Employee.prototype.toString = Manager.prototype = new
function () { Employee();
return "Employee Id " + Manager.prototype.test =
this.id; function (name) {
}; return this.name === name;
};
Var mark = new Manager(1, 'Foo');
Mark.toString();
mark.test('foo');
Azri
24. Function
Function Expression
Var foo = function foo(arg1, arg2) {}
Var foo = function(arg1, arg2) {}
var ele = document.getElementById('link');
ele.onclick = function(event){}
Function Statement
Function foo(arg1, arg2){}
Azri
25. Scope
• In JavaScript, {blocks} do not have
scope.
• Only functions have scope.
• Variables defined in a function are not
visible outside of the function
Azri
26. Return Statement
return expression;
or
return;
• If there is no expression, then the
return value is undefined.
• Except for constructors, whose default
return value is 'this'.
Azri
28. arguments
• When a function is invoked, in addition to its
parameters, it also gets a special parameter
called arguments.
• It contains all of the arguments from the
invocation.
• It is an array-like object.
• arguments.length is the number of
arguments passed.
Azri
29. this
• The 'this' parameter contains a
reference to the object of invocation.
• 'this' allows a method to know what
object it is concerned with.
• 'this' allows a single function object to
service many functions.
• 'this' is key to inheritance.
Azri
30. invocation
The ( ) suffix operator surrounding zero or more
comma separated arguments.
The arguments will be bound to parameters.
If a function is called with too many arguments,
the extra arguments are ignored.
If a function is called with too few arguments,
the missing values will be undefined.
There is no implicit type checking on the
arguments.
Azri
31. invocation
There are four ways to call a function:
• Function form
• functionObject(arguments)
• Method form
• thisObject.methodName(arguments)
• thisObject["methodName"](arguments)
• Constructor form
• new FunctionObject(arguments)
• Apply form
• functionObject.apply(thisObject,[arguments])
Azri
32. global
var names = ['zero', 'one', 'two',
'three', 'four', 'five', 'six',
'seven', 'eight', 'nine'];
var digit_name = function (n) {
return names[n];
};
alert(digit_name(3)); // 'three'
Azri
33. slow
var digit_name = function (n) {
var names = ['zero', 'one', 'two',
'three', 'four', 'five',
'six',
'seven', 'eight', 'nine'];
return names[n];
};
alert(digit_name(3)); // 'three'
Azri