• Share
  • Email
  • Embed
  • Like
  • Save
  • Private Content
Core concepts-javascript

Core concepts-javascript






Total Views
Views on SlideShare
Embed Views



3 Embeds 84

http://pflame.co.in 79
http://www.linkedin.com 4
http://www.pflame.co.in 1



Upload Details

Uploaded via as Adobe PDF

Usage Rights

© All Rights Reserved

Report content

Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.


11 of 1 previous next

  • Full Name Full Name Comment goes here.
    Are you sure you want to
    Your message goes here
Post Comment
Edit your comment

    Core concepts-javascript Core concepts-javascript Presentation Transcript

    • JavaScript – Core Concepts prajwala@azrisolutions.com Azri
    • AGENDA Me and my company JavaScript history Misunderstandings about JavaScript Core Concepts Questions ????? Azri
    • ‘Me’ My village HUZURABADAzri
    • 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
    • Once upon a time......there was... Azri
    • Jim was inspired by the UI of... Azri
    • So, Jim met Brendan...So in 1995, Brendan Eich built a language called Livescript Azri
    • Livescript?Java + Scheme + Self Azri
    • In time... LiveScript became JavaScript becameECMAScript (Standard*) Azri
    • Misunderstandings... The name “Java” Prefix Lisp in Cs clothing Design errors Poor implementation Insufficient literatureMostly adopted by amateurs Azri
    • Is JavaScript Object Oriented? Azri
    • Think about this...JavaScript is all about objects, more object oriented than Java. Azri
    • Get, Set and Delete get object.name object[expression] set object.name = value;object[expression] = value; delete delete object.name delete object[expression] Azri
    • Creating New Objects Using Object Initializersvar obj = {property_1: value_1, 2: value_2, "property_n": value_n }; Azri
    • Creating New Objects Using Constructor Functionfunction 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
    • Object ReferenceObjects 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 trueonly if both operands are the same object Azri
    • Predefined Core Objects Array Boolean Date Function Math Number RegExp String Azri
    • Classes versus Prototype Azri
    • 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
    • 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
    • Function Azri
    • 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
    • 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
    • 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
    • Two Pseudo Parameters arguments this Azri
    • 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
    • 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
    • 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
    • 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
    • globalvar 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
    • slowvar 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
    • closurevar digit_name = (function () { var names = [zero, one, two, three, four, five, six, seven, eight, nine]; return function (n) { return names[n]; };}());alert(digit_name(3)); // three Azri
    • closurefunction fade(id) { var dom = document.getElementById(id), level = 1; function step() { var h = level.toString(16); dom.style.backgroundColor = #FFFF + h + h; if (level < 15) { level += 1; setTimeout(step, 100); } } setTimeout(step, 100);} Azri
    • Referenceshttps://developer.mozilla.org/en/JavaScript http://msdn.microsoft.com/en- us/library/hbxc2t98.aspx http://javascript.crockford.com/http://www.amazon.com/exec/obidos/ASIN/0 596101996/wrrrldwideweb Azri
    • Questions? :) Azri