the javascript programming language
TRANSCRIPT
![Page 1: The JavaScript Programming Language](https://reader030.vdocuments.mx/reader030/viewer/2022032616/55a607221a28ab06258b47b1/html5/thumbnails/1.jpg)
Mohammed Irfan
![Page 2: The JavaScript Programming Language](https://reader030.vdocuments.mx/reader030/viewer/2022032616/55a607221a28ab06258b47b1/html5/thumbnails/2.jpg)
JavaScript is a stripped down version of Java
JavaScript does not exist outside browsers
JavaScript is inconsistent and buggy
JavaScript is not object-orientated
![Page 3: The JavaScript Programming Language](https://reader030.vdocuments.mx/reader030/viewer/2022032616/55a607221a28ab06258b47b1/html5/thumbnails/3.jpg)
Birth of Mocha, then rename to LiveScript
Netscape and Sun collaboration for Java in browsers;
LiveScript gets renamed to JavaScript
IE team reverse engineers JavaScript to JScript
Browser war begins
Standardization of JavaScript at ECMA; ECMAScript becomes the official name
Rise of Ajax
JavaScript libraries emerge
ECMAScript 5
![Page 4: The JavaScript Programming Language](https://reader030.vdocuments.mx/reader030/viewer/2022032616/55a607221a28ab06258b47b1/html5/thumbnails/4.jpg)
Semicolon insertion
typeof and instanceof
with and eval
== and !=
new
![Page 5: The JavaScript Programming Language](https://reader030.vdocuments.mx/reader030/viewer/2022032616/55a607221a28ab06258b47b1/html5/thumbnails/5.jpg)
Loose Typing
Dynamic Objects
Object / Array Literals
Functions / Lambdas
![Page 6: The JavaScript Programming Language](https://reader030.vdocuments.mx/reader030/viewer/2022032616/55a607221a28ab06258b47b1/html5/thumbnails/6.jpg)
Self
prototypal inheritance
dynamic objects
Scheme
lambda
loose typing
Java
syntax
conventions
Perl
regular expressions
![Page 7: The JavaScript Programming Language](https://reader030.vdocuments.mx/reader030/viewer/2022032616/55a607221a28ab06258b47b1/html5/thumbnails/7.jpg)
Numbers
Strings
Booleans
Objects
Functions
![Page 8: The JavaScript Programming Language](https://reader030.vdocuments.mx/reader030/viewer/2022032616/55a607221a28ab06258b47b1/html5/thumbnails/8.jpg)
Number
String
Boolean
Object Function
Array
Date
RegExp
Null
Undefined
![Page 9: The JavaScript Programming Language](https://reader030.vdocuments.mx/reader030/viewer/2022032616/55a607221a28ab06258b47b1/html5/thumbnails/9.jpg)
Only one number type
No integers
64-bit floating point IEEE-754 (aka “Double”)
Numbers are Objects
![Page 10: The JavaScript Programming Language](https://reader030.vdocuments.mx/reader030/viewer/2022032616/55a607221a28ab06258b47b1/html5/thumbnails/10.jpg)
(a + b) + c === a + (b + c)
Produces false for some values of a, b, c.
Integers under 9007199254740992 (9
quadrillion) are ok.
9007199254740992 === 9007199254740992 + 1
![Page 11: The JavaScript Programming Language](https://reader030.vdocuments.mx/reader030/viewer/2022032616/55a607221a28ab06258b47b1/html5/thumbnails/11.jpg)
a = 0.1;
b = 0.2;
c = 0.3;
(a + b) + c === a + (b + c)
> false
![Page 12: The JavaScript Programming Language](https://reader030.vdocuments.mx/reader030/viewer/2022032616/55a607221a28ab06258b47b1/html5/thumbnails/12.jpg)
Special number: Not a Number
Result of undefined or erroneous operations
Toxic: any arithmetic operation with NaN as an
input will have NaN as a result
NaN is not equal to anything, including NaN
NaN === NaN is false
NaN !== NaN is true
![Page 13: The JavaScript Programming Language](https://reader030.vdocuments.mx/reader030/viewer/2022032616/55a607221a28ab06258b47b1/html5/thumbnails/13.jpg)
A sequence of 0 or more 16-bit Unicode
characters
No separate character type
Characters are represented as strings with length
of 1
Strings are immutable
Similar strings are equal ( === )
String literals can use single or double quotes with
\ escapement.
Strings are Objects
![Page 14: The JavaScript Programming Language](https://reader030.vdocuments.mx/reader030/viewer/2022032616/55a607221a28ab06258b47b1/html5/thumbnails/14.jpg)
> "hello".charAt(0)
h
> "hello, world".replace("hello", "goodbye")
goodbye, world
> "hello".toUpperCase()
HELLO
![Page 15: The JavaScript Programming Language](https://reader030.vdocuments.mx/reader030/viewer/2022032616/55a607221a28ab06258b47b1/html5/thumbnails/15.jpg)
null = deliberately no value
undefined = no value assigned yet
Variables declared but not initialized
Object/array members that don't exist
![Page 16: The JavaScript Programming Language](https://reader030.vdocuments.mx/reader030/viewer/2022032616/55a607221a28ab06258b47b1/html5/thumbnails/16.jpg)
Boolean type: true or false
Everything else is “truthy” or “falsy”
0, "", NaN, null and undefined are falsy
Everything else is truthy
Boolean operations: &&, || and !
![Page 17: The JavaScript Programming Language](https://reader030.vdocuments.mx/reader030/viewer/2022032616/55a607221a28ab06258b47b1/html5/thumbnails/17.jpg)
Simple key-value pairs, like:
HashMaps in Java
Associative arrays in PHP
Key is a string; value can be anything
Key is unique within an object
![Page 18: The JavaScript Programming Language](https://reader030.vdocuments.mx/reader030/viewer/2022032616/55a607221a28ab06258b47b1/html5/thumbnails/18.jpg)
var obj = new Object();
Or
var obj = {};
These are semantically equivalent; the second is
called object literal syntax and is more
convenient.
![Page 19: The JavaScript Programming Language](https://reader030.vdocuments.mx/reader030/viewer/2022032616/55a607221a28ab06258b47b1/html5/thumbnails/19.jpg)
obj.name = "My Name"
var name = obj.name;
Or
obj["name"] = "My Name";
var name = obj["name"];
Semantically equivalent; the second uses strings
so can be decided at run-time (and can be
used for reserved words)
![Page 20: The JavaScript Programming Language](https://reader030.vdocuments.mx/reader030/viewer/2022032616/55a607221a28ab06258b47b1/html5/thumbnails/20.jpg)
var obj = {
name: "Carrot",
"for": "Max",
details: {
color: "orange",
size: 12
}
}
> obj.details.color
Orange
> obj["details"]["size"]
12
![Page 21: The JavaScript Programming Language](https://reader030.vdocuments.mx/reader030/viewer/2022032616/55a607221a28ab06258b47b1/html5/thumbnails/21.jpg)
Iterate over the keys of an object:
var obj = { 'name': 'Simon', 'age': 25 };
for (var attr in obj) {
alert (attr + ' = ' + obj[attr]);
}
Not to be used with Arrays
![Page 22: The JavaScript Programming Language](https://reader030.vdocuments.mx/reader030/viewer/2022032616/55a607221a28ab06258b47b1/html5/thumbnails/22.jpg)
A special type of object: Keys are whole numbers, not strings.
Use [] syntax, just like objects
> var a = new Array();> a[0] = "dog";> a[1] = "cat";> a[2] = "hen“;> a.length3 No such thing as “Associative Arrays”
![Page 23: The JavaScript Programming Language](https://reader030.vdocuments.mx/reader030/viewer/2022032616/55a607221a28ab06258b47b1/html5/thumbnails/23.jpg)
More convenient notation:
> var a = ["dog", "cat", "hen"];
> a.length
3
var a = [10, "dog", false, "elephant"];
(you can have mixed content in arrays)
![Page 24: The JavaScript Programming Language](https://reader030.vdocuments.mx/reader030/viewer/2022032616/55a607221a28ab06258b47b1/html5/thumbnails/24.jpg)
> var a = ["dog", "cat", "hen"];
> a[100] = "fox";
> a.length
101
typeof a[90] == 'undefined'
array.length is always one more than the highest index
The safest way to append new items is:
a[a.length] = item;
![Page 25: The JavaScript Programming Language](https://reader030.vdocuments.mx/reader030/viewer/2022032616/55a607221a28ab06258b47b1/html5/thumbnails/25.jpg)
New variables are declared using the varkeyword:
var a;
var name = "my name";
If you declare a variable without assigning it to
anything, its value is undefined.
If you forget the var, you get a global variable.
Never, ever do this – not even if you mean it.
![Page 26: The JavaScript Programming Language](https://reader030.vdocuments.mx/reader030/viewer/2022032616/55a607221a28ab06258b47b1/html5/thumbnails/26.jpg)
Global variables are visible everywhere
Blocks do not have scope
Variables defined inside blocks are hoisted to
the top and are visible outside the block
Functions have scope
Variables defined inside function are visible
throughout the function and its inner functions
![Page 27: The JavaScript Programming Language](https://reader030.vdocuments.mx/reader030/viewer/2022032616/55a607221a28ab06258b47b1/html5/thumbnails/27.jpg)
var a;
//...
function F() {
var b;
//...
function N() {
var c;
//...
};
}
![Page 28: The JavaScript Programming Language](https://reader030.vdocuments.mx/reader030/viewer/2022032616/55a607221a28ab06258b47b1/html5/thumbnails/28.jpg)
Three different purposes of functions: as sub-routine / procedure
as lambda (a block of executable code)
as object constructor
Functions are first-class: can be assigned to a variable
can be passed as argument to any function
can be returned from any function
can be a member of any object
can be created at run time
Functions can be created inside another function
![Page 29: The JavaScript Programming Language](https://reader030.vdocuments.mx/reader030/viewer/2022032616/55a607221a28ab06258b47b1/html5/thumbnails/29.jpg)
function add(x, y) {
var total = x + y;
return total;
}
var add = function(x, y) {
var total = x + y;
return total;
};
var add = function some_func(x, y) {
var total = x + y;
return total;
};
If nothing is explicitly returned, return value is undefined
![Page 30: The JavaScript Programming Language](https://reader030.vdocuments.mx/reader030/viewer/2022032616/55a607221a28ab06258b47b1/html5/thumbnails/30.jpg)
Parameters: “They’re more like... Guidelines”
Missing parameters are treated as undefined:
> add()
NaN // addition on undefined
You can pass in more arguments than
expected:
> add(2, 3, 4)
5 // added the first two; 4 was ignored
![Page 31: The JavaScript Programming Language](https://reader030.vdocuments.mx/reader030/viewer/2022032616/55a607221a28ab06258b47b1/html5/thumbnails/31.jpg)
The arguments special variable provides access to arguments as an array-like object
function add() {
var sum = 0;
for (var i = 0, j = arguments.length; i < j; i++) {
sum += arguments[i];
}
return sum;
}
> add(2, 3, 4, 5)
14
![Page 32: The JavaScript Programming Language](https://reader030.vdocuments.mx/reader030/viewer/2022032616/55a607221a28ab06258b47b1/html5/thumbnails/32.jpg)
$('#some-id').click(function(evt) {
// do something on click event
};
![Page 33: The JavaScript Programming Language](https://reader030.vdocuments.mx/reader030/viewer/2022032616/55a607221a28ab06258b47b1/html5/thumbnails/33.jpg)
var add = function(x) {
return function(y) {
return x + y;
};
};
![Page 34: The JavaScript Programming Language](https://reader030.vdocuments.mx/reader030/viewer/2022032616/55a607221a28ab06258b47b1/html5/thumbnails/34.jpg)
function Person(name) {
this.name = name;
this.getName = function() {
return this.name;
};
}
var person = new Person("some one");
person.getName();
> some one