SlideShare uma empresa Scribd logo
1 de 52
Baixar para ler offline
JavaScript



WebDU 2009 · Dmitry Baranovskiy
E very object (including host       objects) must implement the
           e)) and ((Class)) propertie      s and the ((Get)), ((Put)),
((Prototyp
           t)), ((HasProperty)), ((Dele      te)), and ((DefaultValue))
((CanPu
           . (Note, however, that the ((D       efaultValue)) method may,
methods                                                  exception.) The value
 for some objects    , simply throw a TypeError
            Prototype)) property must be      either an object or null, and
 of the ((
            Prototype)) chain must have       finite length (that is, starting
 every ((
             y object, recursively access     ing the ((Prototype)) property
  from an
            entually lead to a null val         ue). Whether or not a native
  must ev
            an have a host object as its       ((Prototype)) depends on the
  object c
  implementation.
       The value      of the ((Class)) property
   is defined by        this specification for every
   kind of built-i   n object. The value of the
    ((Class)) prop    erty of a host object may
    be any value     , even a value used by
E very object (including host       objects) must implement the
           e)) and ((Class)) propertie      s and the ((Get)), ((Put)),
((Prototyp
           t)), ((HasProperty)), ((Dele      te)), and ((DefaultValue))
((CanPu
           . (Note, however, that the ((D       efaultValue)) method may,
methods                                                  exception.) The value
 for some objects    , simply throw a TypeError
            Prototype)) property must be      either an object or null, and
 of the ((
            Prototype)) chain must have       finite length (that is, starting
 every ((
  from an
  must ev
           It is a bit “cryptic”
             y object, recursively access
            entually lead to a null val
                                              ing the ((Prototype)) property
                                                ue). Whether or not a native
            an have a host object as its       ((Prototype)) depends on the
  object c
  implementation.
       The value      of the ((Class)) property
   is defined by        this specification for every
   kind of built-i   n object. The value of the
    ((Class)) prop    erty of a host object may
    be any value     , even a value used by
“ECMAScript does not contain proper
 classes such as those in C++, Smalltalk, or
 Java, but rather, supports constructors
 which create objects by executing code
 that allocates storage for the objects and
 initialises all or part of them by assigning
 initial values to their properties.”

                            ECMAScript Specification
Basic Types
Undefined    Null    Boolean


Number     String   Object
typeof
typeof

Undefined quot;undefinedquot;

    Null quot;objectquot;

 Number quot;numberquot;

 Boolean quot;booleanquot;

   String quot;stringquot;

  Object quot;objectquot;
to Number

Undefined NaN

    Null 0

 Number —

 Boolean false ! 0, true ! 1

   String parsing

  Object .valueOf()
to Boolean

Undefined !quot;#$%

     Null !quot;#$%

 Number &'())(*+*,(-(.+/01(2(3451

 Boolean 6

   String 77(-(.+/01(2(3451

  Object 89:%
to String

Undefined quot;undefinedquot;

    Null quot;nullquot;

 Number quot;5quot;

 Boolean quot;falsequot; || quot;truequot;

   String —

  Object .toString()
to Object

Undefined exception!

    Null exception!

 Number new Number(v)

 Boolean new Boolean(v)

   String new String(v)

  Object Object
On the fly
5 + 4 + quot;pxquot;
quot;$quot; + 1 + 2
quot;4quot; / quot;2quot;
quot;$quot; + 1 - 2
quot;webduquot;.length
typeof 5
typeof quot;5quot;
typeof {property: value}
typeof null
typeof undefined
typeof [1, 2, 3]
typeof (4 - quot;pxquot;)
5 + 4 + quot;pxquot;               quot;9pxquot;
quot;$quot; + 1 + 2                quot;$12quot;
quot;4quot; / quot;2quot;                  2
quot;$quot; + 1 - 2                NaN
quot;webduquot;.length             5
typeof 5                   quot;numberquot;
typeof quot;5quot;                 quot;stringquot;
typeof {property: value}   quot;objectquot;
typeof null                quot;objectquot;
typeof undefined           quot;undefinedquot;
typeof [1, 2, 3]           quot;objectquot;
typeof (4 - quot;pxquot;)          quot;numberquot;
Object Properties
ReadOnly     DontEnum


DontDelete    Internal
for in
var a = {
    x: 12,
    y: 23,
    r: 10,
    draw: function () {/*...*/}
};


for (var property in a) {
    alert(quot;a.quot; + property + quot; = quot; + a[property]);
}
var a = {
    x: 12,
    y: 23,
    r: 10,
    draw: function () {/*...*/}
};


for (var property in a) {
    alert(quot;a.quot; + property + quot; = quot; + a[property]);
}
Function
 Array
  Date
RegExp
Function
var y = 1;
function x() {
    var y = 2;
    return ++y;
}

var z = function () {
    return ++y;
};
function x() {
    var y = 2;
    return function () {
        return ++y;
    };
}

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

add(4, 5); // = 9
add(4, 5, 6, 7, 8, 9) // = 39

function add() {
    var sum = 0;
    for (var i = 0, ii = arguments.length; i < ii; i++) {
        sum +=+ arguments[i];
    }
    return sum;
}
Scope & “this”
function is(it) {
    alert(this + quot; is quot; + it);
}

is(quot;globalquot;);

is.call(5, quot;numberquot;);

is.apply(quot;Aquot;, [quot;stringquot;]);

alert.is = is;

alert.is(quot;functionquot;);
Variable declaration
alert(b);
1   b = 1;

    alert(a);
2   var a = 1;

    (function () {
3       var x = 1;
    })();
    alert(x);

    (function () {
4       y = 1;
    })();
    alert(y);
Function declaration
function x(a) {
1       return a && x(--a);
    }

    var x = function (a) {
2       return a && x(--a);
    };

    setTimeout(function (a) {
3       return a && arguments.callee(--a);
    }, 1000);

    var x = function y(a) {
4       return a && y(--a);
    };

    setTimeout(function y(a) {
5       return a && y(--a);
    }, 1000);
Arrays declaration
var a = new Array();

var a = new Array(3);

var a = [];

var a = [undefined, undefined, undefined];

var a = [1, 2, 3, 4];
Object declaration
     (JSON)
var a = new Object();

var a = {};

var a = {x: 10, y: 15};

var a = {
    x: 10,
    name: quot;objectquot;,
    quot;font-stylequot;: quot;italicquot;,
    getHeight: function () {/*...*/},
    points: [1, 2, 3],
    child: {x: 10, y: 15}
};
OOP
“Object Owns Prototype”
var mouse = {
1       name: quot;Mikequot;,
        voice: function () { alert(quot;Squik!quot;); }
    };

    var o = new Object();
2   o.name = quot;Mikequot;;
    o.voice = function () { alert(quot;Squik!quot;); };

    var O = function () {
3       this.name = quot;Mikequot;;
        this.voice = function () { alert(quot;Squik!quot;); };
    };
    var o = new O();

    var O = function () {};
4   O.prototype.name = quot;Mikequot;;
    O.prototype.voice = function () { alert(quot;Squik!quot;); };
    var o = new O();
Inheritance
Inheritance
Delegation
Classic Model


              Class




                         Object
              Class




Object       Object      Object
Prototypal Model




                    Object




Object     Object   Object
Object   Object
// Sharing
function Parent(value) {
    this.value = value;
}
Parent.prototype.getValue = function () {
    return this.value;
};
function A(value) {
    this.value = value + 1;
}
A.prototype = new Parent();

function B(value) {
    this.value = value * 2;
}
B.prototype = new Parent();

alert((new A(5)).getValue()); // 6
alert((new B(5)).getValue()); // 10
// Sharing
function A(value) {
    this.value = value + 1;
}

function B(value) {
    this.value = value * 2;
}
A.prototype.getValue = B.prototype.getValue = function ()
{
    return this.value;
};

alert((new A(5)).getValue()); // 6
alert((new B(5)).getValue()); // 10
Array
Date
RegExp
Thank You

Mais conteúdo relacionado

Mais procurados

Javascript engine performance
Javascript engine performanceJavascript engine performance
Javascript engine performance
Duoyi Wu
 
Memory Management with Java and C++
Memory Management with Java and C++Memory Management with Java and C++
Memory Management with Java and C++
Mohammad Shaker
 

Mais procurados (20)

Java Generics
Java GenericsJava Generics
Java Generics
 
C++11
C++11C++11
C++11
 
Javascript engine performance
Javascript engine performanceJavascript engine performance
Javascript engine performance
 
Fun with Lambdas: C++14 Style (part 2)
Fun with Lambdas: C++14 Style (part 2)Fun with Lambdas: C++14 Style (part 2)
Fun with Lambdas: C++14 Style (part 2)
 
Lo Mejor Del Pdc2008 El Futrode C#
Lo Mejor Del Pdc2008 El Futrode C#Lo Mejor Del Pdc2008 El Futrode C#
Lo Mejor Del Pdc2008 El Futrode C#
 
Operator overloading
Operator overloadingOperator overloading
Operator overloading
 
Memory Management with Java and C++
Memory Management with Java and C++Memory Management with Java and C++
Memory Management with Java and C++
 
Java Generics
Java GenericsJava Generics
Java Generics
 
Let's go Developer 2011 sendai Let's go Java Developer (Programming Language ...
Let's go Developer 2011 sendai Let's go Java Developer (Programming Language ...Let's go Developer 2011 sendai Let's go Java Developer (Programming Language ...
Let's go Developer 2011 sendai Let's go Java Developer (Programming Language ...
 
Java 5 Features
Java 5 FeaturesJava 5 Features
Java 5 Features
 
Scala is java8.next()
Scala is java8.next()Scala is java8.next()
Scala is java8.next()
 
constructors and destructors in c++
constructors and destructors in c++constructors and destructors in c++
constructors and destructors in c++
 
Functional Programming Patterns for the Pragmatic Programmer
Functional Programming Patterns for the Pragmatic ProgrammerFunctional Programming Patterns for the Pragmatic Programmer
Functional Programming Patterns for the Pragmatic Programmer
 
科特林λ學
科特林λ學科特林λ學
科特林λ學
 
What\'s New in C# 4.0
What\'s New in C# 4.0What\'s New in C# 4.0
What\'s New in C# 4.0
 
Day 1
Day 1Day 1
Day 1
 
Easy Going Groovy 2nd season on DevLOVE
Easy Going Groovy 2nd season on DevLOVEEasy Going Groovy 2nd season on DevLOVE
Easy Going Groovy 2nd season on DevLOVE
 
Memory management in c++
Memory management in c++Memory management in c++
Memory management in c++
 
Java generics final
Java generics finalJava generics final
Java generics final
 
Java Simple Programs
Java Simple ProgramsJava Simple Programs
Java Simple Programs
 

Destaque

Semin. De Postgrado Inform
Semin. De Postgrado InformSemin. De Postgrado Inform
Semin. De Postgrado Inform
Pucca69
 
Actividades de educación_psicomotriz
Actividades de educación_psicomotriz Actividades de educación_psicomotriz
Actividades de educación_psicomotriz
Marta Montoro
 
Antioquia oculto
Antioquia ocultoAntioquia oculto
Antioquia oculto
papayita2
 
Fd inv.conocimiento e_interes_jürgen_habermas
Fd inv.conocimiento e_interes_jürgen_habermasFd inv.conocimiento e_interes_jürgen_habermas
Fd inv.conocimiento e_interes_jürgen_habermas
Nirza Chacón Vargas
 
Sistema operativo computacion
Sistema operativo computacionSistema operativo computacion
Sistema operativo computacion
juliocesar05
 
Sistema operativo computacion
Sistema operativo computacionSistema operativo computacion
Sistema operativo computacion
juliocesar05
 
Ik.2012.5.téma és jelentés oroszlán
Ik.2012.5.téma és jelentés oroszlánIk.2012.5.téma és jelentés oroszlán
Ik.2012.5.téma és jelentés oroszlán
eorsianna
 

Destaque (20)

Inside view crack-the-code-of-sales-and-marketing-alignment-report
Inside view crack-the-code-of-sales-and-marketing-alignment-reportInside view crack-the-code-of-sales-and-marketing-alignment-report
Inside view crack-the-code-of-sales-and-marketing-alignment-report
 
D:\Documents And Settings\Administrador\Mis Documentos\Como Cuidar El Medio A...
D:\Documents And Settings\Administrador\Mis Documentos\Como Cuidar El Medio A...D:\Documents And Settings\Administrador\Mis Documentos\Como Cuidar El Medio A...
D:\Documents And Settings\Administrador\Mis Documentos\Como Cuidar El Medio A...
 
Semin. De Postgrado Inform
Semin. De Postgrado InformSemin. De Postgrado Inform
Semin. De Postgrado Inform
 
Actividades de educación_psicomotriz
Actividades de educación_psicomotriz Actividades de educación_psicomotriz
Actividades de educación_psicomotriz
 
Antioquia oculto
Antioquia ocultoAntioquia oculto
Antioquia oculto
 
Fd inv.conocimiento e_interes_jürgen_habermas
Fd inv.conocimiento e_interes_jürgen_habermasFd inv.conocimiento e_interes_jürgen_habermas
Fd inv.conocimiento e_interes_jürgen_habermas
 
Condiciones Y Politicas
Condiciones Y PoliticasCondiciones Y Politicas
Condiciones Y Politicas
 
Subir...
Subir...Subir...
Subir...
 
Impacto de la nueva ley sobre teletrabajo en el Perú
Impacto de la nueva ley sobre teletrabajo en el Perú Impacto de la nueva ley sobre teletrabajo en el Perú
Impacto de la nueva ley sobre teletrabajo en el Perú
 
Sistema operativo computacion
Sistema operativo computacionSistema operativo computacion
Sistema operativo computacion
 
Mis diez (10) mandamientos del e mail
Mis diez (10) mandamientos del e mailMis diez (10) mandamientos del e mail
Mis diez (10) mandamientos del e mail
 
Atendi turismo
Atendi turismoAtendi turismo
Atendi turismo
 
La primera guerra mundial eve[1]
La primera guerra mundial eve[1]La primera guerra mundial eve[1]
La primera guerra mundial eve[1]
 
Redes sociales
Redes socialesRedes sociales
Redes sociales
 
Sistema operativo computacion
Sistema operativo computacionSistema operativo computacion
Sistema operativo computacion
 
Ik.2012.5.téma és jelentés oroszlán
Ik.2012.5.téma és jelentés oroszlánIk.2012.5.téma és jelentés oroszlán
Ik.2012.5.téma és jelentés oroszlán
 
Thuật ngữ Digital marketing
Thuật ngữ Digital marketingThuật ngữ Digital marketing
Thuật ngữ Digital marketing
 
Educacion especial y adultos grupo 5
Educacion especial y adultos grupo 5Educacion especial y adultos grupo 5
Educacion especial y adultos grupo 5
 
Descripcion Proyecto ELIT Investigando en la Sala de Clases
Descripcion Proyecto ELIT Investigando en la Sala de ClasesDescripcion Proyecto ELIT Investigando en la Sala de Clases
Descripcion Proyecto ELIT Investigando en la Sala de Clases
 
9 c2e~1
9 c2e~19 c2e~1
9 c2e~1
 

Semelhante a Java Script Workshop

JavaScript for PHP developers
JavaScript for PHP developersJavaScript for PHP developers
JavaScript for PHP developers
Stoyan Stefanov
 
OO JS for AS3 Devs
OO JS for AS3 DevsOO JS for AS3 Devs
OO JS for AS3 Devs
Jason Hanson
 
Jsphp 110312161301-phpapp02
Jsphp 110312161301-phpapp02Jsphp 110312161301-phpapp02
Jsphp 110312161301-phpapp02
Seri Moth
 
JAVA OOP project; desperately need help asap im begging.Been stuck.pdf
JAVA OOP project; desperately need help asap im begging.Been stuck.pdfJAVA OOP project; desperately need help asap im begging.Been stuck.pdf
JAVA OOP project; desperately need help asap im begging.Been stuck.pdf
fantasiatheoutofthef
 
Scala in practice
Scala in practiceScala in practice
Scala in practice
patforna
 

Semelhante a Java Script Workshop (20)

JavaScript for PHP developers
JavaScript for PHP developersJavaScript for PHP developers
JavaScript for PHP developers
 
JavaScript and the AST
JavaScript and the ASTJavaScript and the AST
JavaScript and the AST
 
OO JS for AS3 Devs
OO JS for AS3 DevsOO JS for AS3 Devs
OO JS for AS3 Devs
 
Scala in practice
Scala in practiceScala in practice
Scala in practice
 
SDC - Einführung in Scala
SDC - Einführung in ScalaSDC - Einführung in Scala
SDC - Einführung in Scala
 
Advanced JavaScript
Advanced JavaScriptAdvanced JavaScript
Advanced JavaScript
 
Paradigmas de Linguagens de Programacao - Aula #4
Paradigmas de Linguagens de Programacao - Aula #4Paradigmas de Linguagens de Programacao - Aula #4
Paradigmas de Linguagens de Programacao - Aula #4
 
JavaScript: The Language
JavaScript: The LanguageJavaScript: The Language
JavaScript: The Language
 
JSConf: All You Can Leet
JSConf: All You Can LeetJSConf: All You Can Leet
JSConf: All You Can Leet
 
Introduction to web programming for java and c# programmers by @drpicox
Introduction to web programming for java and c# programmers by @drpicoxIntroduction to web programming for java and c# programmers by @drpicox
Introduction to web programming for java and c# programmers by @drpicox
 
Jsphp 110312161301-phpapp02
Jsphp 110312161301-phpapp02Jsphp 110312161301-phpapp02
Jsphp 110312161301-phpapp02
 
JAVA OOP project; desperately need help asap im begging.Been stuck.pdf
JAVA OOP project; desperately need help asap im begging.Been stuck.pdfJAVA OOP project; desperately need help asap im begging.Been stuck.pdf
JAVA OOP project; desperately need help asap im begging.Been stuck.pdf
 
Using Reflections and Automatic Code Generation
Using Reflections and Automatic Code GenerationUsing Reflections and Automatic Code Generation
Using Reflections and Automatic Code Generation
 
Say It With Javascript
Say It With JavascriptSay It With Javascript
Say It With Javascript
 
Object Oriented JavaScript
Object Oriented JavaScriptObject Oriented JavaScript
Object Oriented JavaScript
 
ECMA 入门
ECMA 入门ECMA 入门
ECMA 入门
 
Ast transformations
Ast transformationsAst transformations
Ast transformations
 
JavaScript - i och utanför webbläsaren (2010-03-03)
JavaScript - i och utanför webbläsaren (2010-03-03)JavaScript - i och utanför webbläsaren (2010-03-03)
JavaScript - i och utanför webbläsaren (2010-03-03)
 
OBJECTS IN Object Oriented Programming .ppt
OBJECTS IN Object Oriented Programming .pptOBJECTS IN Object Oriented Programming .ppt
OBJECTS IN Object Oriented Programming .ppt
 
Scala in practice
Scala in practiceScala in practice
Scala in practice
 

Mais de Dmitry Baranovskiy (15)

JavaScript: enter the dragon
JavaScript: enter the dragonJavaScript: enter the dragon
JavaScript: enter the dragon
 
The Origins of Magic
The Origins of MagicThe Origins of Magic
The Origins of Magic
 
Demystifying Prototypes
Demystifying PrototypesDemystifying Prototypes
Demystifying Prototypes
 
Raphaël
RaphaëlRaphaël
Raphaël
 
Type Recognition
Type RecognitionType Recognition
Type Recognition
 
Raphaël JS Conf
Raphaël JS ConfRaphaël JS Conf
Raphaël JS Conf
 
Obvious Secrets of JavaScript
Obvious Secrets of JavaScriptObvious Secrets of JavaScript
Obvious Secrets of JavaScript
 
Your JavaScript Library
Your JavaScript LibraryYour JavaScript Library
Your JavaScript Library
 
Canvas
CanvasCanvas
Canvas
 
SVG
SVGSVG
SVG
 
Raphael
RaphaelRaphael
Raphael
 
Web Vector Graphics
Web Vector GraphicsWeb Vector Graphics
Web Vector Graphics
 
Typography on the Web
Typography on the WebTypography on the Web
Typography on the Web
 
Microformats—the hidden treasure
Microformats—the hidden treasureMicroformats—the hidden treasure
Microformats—the hidden treasure
 
Advanced JavaScript Techniques
Advanced JavaScript TechniquesAdvanced JavaScript Techniques
Advanced JavaScript Techniques
 

Último

Jual Obat Aborsi Hongkong ( Asli No.1 ) 085657271886 Obat Penggugur Kandungan...
Jual Obat Aborsi Hongkong ( Asli No.1 ) 085657271886 Obat Penggugur Kandungan...Jual Obat Aborsi Hongkong ( Asli No.1 ) 085657271886 Obat Penggugur Kandungan...
Jual Obat Aborsi Hongkong ( Asli No.1 ) 085657271886 Obat Penggugur Kandungan...
ZurliaSoop
 
Vishram Singh - Textbook of Anatomy Upper Limb and Thorax.. Volume 1 (1).pdf
Vishram Singh - Textbook of Anatomy  Upper Limb and Thorax.. Volume 1 (1).pdfVishram Singh - Textbook of Anatomy  Upper Limb and Thorax.. Volume 1 (1).pdf
Vishram Singh - Textbook of Anatomy Upper Limb and Thorax.. Volume 1 (1).pdf
ssuserdda66b
 
The basics of sentences session 3pptx.pptx
The basics of sentences session 3pptx.pptxThe basics of sentences session 3pptx.pptx
The basics of sentences session 3pptx.pptx
heathfieldcps1
 

Último (20)

Accessible Digital Futures project (20/03/2024)
Accessible Digital Futures project (20/03/2024)Accessible Digital Futures project (20/03/2024)
Accessible Digital Futures project (20/03/2024)
 
Micro-Scholarship, What it is, How can it help me.pdf
Micro-Scholarship, What it is, How can it help me.pdfMicro-Scholarship, What it is, How can it help me.pdf
Micro-Scholarship, What it is, How can it help me.pdf
 
Unit-IV; Professional Sales Representative (PSR).pptx
Unit-IV; Professional Sales Representative (PSR).pptxUnit-IV; Professional Sales Representative (PSR).pptx
Unit-IV; Professional Sales Representative (PSR).pptx
 
Jual Obat Aborsi Hongkong ( Asli No.1 ) 085657271886 Obat Penggugur Kandungan...
Jual Obat Aborsi Hongkong ( Asli No.1 ) 085657271886 Obat Penggugur Kandungan...Jual Obat Aborsi Hongkong ( Asli No.1 ) 085657271886 Obat Penggugur Kandungan...
Jual Obat Aborsi Hongkong ( Asli No.1 ) 085657271886 Obat Penggugur Kandungan...
 
General Principles of Intellectual Property: Concepts of Intellectual Proper...
General Principles of Intellectual Property: Concepts of Intellectual  Proper...General Principles of Intellectual Property: Concepts of Intellectual  Proper...
General Principles of Intellectual Property: Concepts of Intellectual Proper...
 
Unit-IV- Pharma. Marketing Channels.pptx
Unit-IV- Pharma. Marketing Channels.pptxUnit-IV- Pharma. Marketing Channels.pptx
Unit-IV- Pharma. Marketing Channels.pptx
 
Graduate Outcomes Presentation Slides - English
Graduate Outcomes Presentation Slides - EnglishGraduate Outcomes Presentation Slides - English
Graduate Outcomes Presentation Slides - English
 
Vishram Singh - Textbook of Anatomy Upper Limb and Thorax.. Volume 1 (1).pdf
Vishram Singh - Textbook of Anatomy  Upper Limb and Thorax.. Volume 1 (1).pdfVishram Singh - Textbook of Anatomy  Upper Limb and Thorax.. Volume 1 (1).pdf
Vishram Singh - Textbook of Anatomy Upper Limb and Thorax.. Volume 1 (1).pdf
 
HMCS Max Bernays Pre-Deployment Brief (May 2024).pptx
HMCS Max Bernays Pre-Deployment Brief (May 2024).pptxHMCS Max Bernays Pre-Deployment Brief (May 2024).pptx
HMCS Max Bernays Pre-Deployment Brief (May 2024).pptx
 
Explore beautiful and ugly buildings. Mathematics helps us create beautiful d...
Explore beautiful and ugly buildings. Mathematics helps us create beautiful d...Explore beautiful and ugly buildings. Mathematics helps us create beautiful d...
Explore beautiful and ugly buildings. Mathematics helps us create beautiful d...
 
Basic Civil Engineering first year Notes- Chapter 4 Building.pptx
Basic Civil Engineering first year Notes- Chapter 4 Building.pptxBasic Civil Engineering first year Notes- Chapter 4 Building.pptx
Basic Civil Engineering first year Notes- Chapter 4 Building.pptx
 
The basics of sentences session 3pptx.pptx
The basics of sentences session 3pptx.pptxThe basics of sentences session 3pptx.pptx
The basics of sentences session 3pptx.pptx
 
SKILL OF INTRODUCING THE LESSON MICRO SKILLS.pptx
SKILL OF INTRODUCING THE LESSON MICRO SKILLS.pptxSKILL OF INTRODUCING THE LESSON MICRO SKILLS.pptx
SKILL OF INTRODUCING THE LESSON MICRO SKILLS.pptx
 
Towards a code of practice for AI in AT.pptx
Towards a code of practice for AI in AT.pptxTowards a code of practice for AI in AT.pptx
Towards a code of practice for AI in AT.pptx
 
ICT Role in 21st Century Education & its Challenges.pptx
ICT Role in 21st Century Education & its Challenges.pptxICT Role in 21st Century Education & its Challenges.pptx
ICT Role in 21st Century Education & its Challenges.pptx
 
Unit-V; Pricing (Pharma Marketing Management).pptx
Unit-V; Pricing (Pharma Marketing Management).pptxUnit-V; Pricing (Pharma Marketing Management).pptx
Unit-V; Pricing (Pharma Marketing Management).pptx
 
Single or Multiple melodic lines structure
Single or Multiple melodic lines structureSingle or Multiple melodic lines structure
Single or Multiple melodic lines structure
 
Sociology 101 Demonstration of Learning Exhibit
Sociology 101 Demonstration of Learning ExhibitSociology 101 Demonstration of Learning Exhibit
Sociology 101 Demonstration of Learning Exhibit
 
Making communications land - Are they received and understood as intended? we...
Making communications land - Are they received and understood as intended? we...Making communications land - Are they received and understood as intended? we...
Making communications land - Are they received and understood as intended? we...
 
TỔNG ÔN TẬP THI VÀO LỚP 10 MÔN TIẾNG ANH NĂM HỌC 2023 - 2024 CÓ ĐÁP ÁN (NGỮ Â...
TỔNG ÔN TẬP THI VÀO LỚP 10 MÔN TIẾNG ANH NĂM HỌC 2023 - 2024 CÓ ĐÁP ÁN (NGỮ Â...TỔNG ÔN TẬP THI VÀO LỚP 10 MÔN TIẾNG ANH NĂM HỌC 2023 - 2024 CÓ ĐÁP ÁN (NGỮ Â...
TỔNG ÔN TẬP THI VÀO LỚP 10 MÔN TIẾNG ANH NĂM HỌC 2023 - 2024 CÓ ĐÁP ÁN (NGỮ Â...
 

Java Script Workshop

  • 1. JavaScript WebDU 2009 · Dmitry Baranovskiy
  • 2.
  • 3. E very object (including host objects) must implement the e)) and ((Class)) propertie s and the ((Get)), ((Put)), ((Prototyp t)), ((HasProperty)), ((Dele te)), and ((DefaultValue)) ((CanPu . (Note, however, that the ((D efaultValue)) method may, methods exception.) The value for some objects , simply throw a TypeError Prototype)) property must be either an object or null, and of the (( Prototype)) chain must have finite length (that is, starting every (( y object, recursively access ing the ((Prototype)) property from an entually lead to a null val ue). Whether or not a native must ev an have a host object as its ((Prototype)) depends on the object c implementation. The value of the ((Class)) property is defined by this specification for every kind of built-i n object. The value of the ((Class)) prop erty of a host object may be any value , even a value used by
  • 4. E very object (including host objects) must implement the e)) and ((Class)) propertie s and the ((Get)), ((Put)), ((Prototyp t)), ((HasProperty)), ((Dele te)), and ((DefaultValue)) ((CanPu . (Note, however, that the ((D efaultValue)) method may, methods exception.) The value for some objects , simply throw a TypeError Prototype)) property must be either an object or null, and of the (( Prototype)) chain must have finite length (that is, starting every (( from an must ev It is a bit “cryptic” y object, recursively access entually lead to a null val ing the ((Prototype)) property ue). Whether or not a native an have a host object as its ((Prototype)) depends on the object c implementation. The value of the ((Class)) property is defined by this specification for every kind of built-i n object. The value of the ((Class)) prop erty of a host object may be any value , even a value used by
  • 5. “ECMAScript does not contain proper classes such as those in C++, Smalltalk, or Java, but rather, supports constructors which create objects by executing code that allocates storage for the objects and initialises all or part of them by assigning initial values to their properties.” ECMAScript Specification
  • 7. Undefined Null Boolean Number String Object
  • 9. typeof Undefined quot;undefinedquot; Null quot;objectquot; Number quot;numberquot; Boolean quot;booleanquot; String quot;stringquot; Object quot;objectquot;
  • 10. to Number Undefined NaN Null 0 Number — Boolean false ! 0, true ! 1 String parsing Object .valueOf()
  • 11. to Boolean Undefined !quot;#$% Null !quot;#$% Number &'())(*+*,(-(.+/01(2(3451 Boolean 6 String 77(-(.+/01(2(3451 Object 89:%
  • 12. to String Undefined quot;undefinedquot; Null quot;nullquot; Number quot;5quot; Boolean quot;falsequot; || quot;truequot; String — Object .toString()
  • 13. to Object Undefined exception! Null exception! Number new Number(v) Boolean new Boolean(v) String new String(v) Object Object
  • 15. 5 + 4 + quot;pxquot; quot;$quot; + 1 + 2 quot;4quot; / quot;2quot; quot;$quot; + 1 - 2 quot;webduquot;.length typeof 5 typeof quot;5quot; typeof {property: value} typeof null typeof undefined typeof [1, 2, 3] typeof (4 - quot;pxquot;)
  • 16. 5 + 4 + quot;pxquot; quot;9pxquot; quot;$quot; + 1 + 2 quot;$12quot; quot;4quot; / quot;2quot; 2 quot;$quot; + 1 - 2 NaN quot;webduquot;.length 5 typeof 5 quot;numberquot; typeof quot;5quot; quot;stringquot; typeof {property: value} quot;objectquot; typeof null quot;objectquot; typeof undefined quot;undefinedquot; typeof [1, 2, 3] quot;objectquot; typeof (4 - quot;pxquot;) quot;numberquot;
  • 18. ReadOnly DontEnum DontDelete Internal
  • 20. var a = { x: 12, y: 23, r: 10, draw: function () {/*...*/} }; for (var property in a) { alert(quot;a.quot; + property + quot; = quot; + a[property]); }
  • 21. var a = { x: 12, y: 23, r: 10, draw: function () {/*...*/} }; for (var property in a) { alert(quot;a.quot; + property + quot; = quot; + a[property]); }
  • 22. Function Array Date RegExp
  • 24. var y = 1; function x() { var y = 2; return ++y; } var z = function () { return ++y; };
  • 25. function x() { var y = 2; return function () { return ++y; }; } var a = x(); a(); a();
  • 27. function add(a, b) { return a + b; } add(4, 5); // = 9 add(4, 5, 6, 7, 8, 9) // = 39 function add() { var sum = 0; for (var i = 0, ii = arguments.length; i < ii; i++) { sum +=+ arguments[i]; } return sum; }
  • 29. function is(it) { alert(this + quot; is quot; + it); } is(quot;globalquot;); is.call(5, quot;numberquot;); is.apply(quot;Aquot;, [quot;stringquot;]); alert.is = is; alert.is(quot;functionquot;);
  • 31. alert(b); 1 b = 1; alert(a); 2 var a = 1; (function () { 3 var x = 1; })(); alert(x); (function () { 4 y = 1; })(); alert(y);
  • 33. function x(a) { 1 return a && x(--a); } var x = function (a) { 2 return a && x(--a); }; setTimeout(function (a) { 3 return a && arguments.callee(--a); }, 1000); var x = function y(a) { 4 return a && y(--a); }; setTimeout(function y(a) { 5 return a && y(--a); }, 1000);
  • 35. var a = new Array(); var a = new Array(3); var a = []; var a = [undefined, undefined, undefined]; var a = [1, 2, 3, 4];
  • 37. var a = new Object(); var a = {}; var a = {x: 10, y: 15}; var a = { x: 10, name: quot;objectquot;, quot;font-stylequot;: quot;italicquot;, getHeight: function () {/*...*/}, points: [1, 2, 3], child: {x: 10, y: 15} };
  • 38. OOP
  • 40. var mouse = { 1 name: quot;Mikequot;, voice: function () { alert(quot;Squik!quot;); } }; var o = new Object(); 2 o.name = quot;Mikequot;; o.voice = function () { alert(quot;Squik!quot;); }; var O = function () { 3 this.name = quot;Mikequot;; this.voice = function () { alert(quot;Squik!quot;); }; }; var o = new O(); var O = function () {}; 4 O.prototype.name = quot;Mikequot;; O.prototype.voice = function () { alert(quot;Squik!quot;); }; var o = new O();
  • 44. Classic Model Class Object Class Object Object Object
  • 45. Prototypal Model Object Object Object Object
  • 46. Object Object
  • 47. // Sharing function Parent(value) { this.value = value; } Parent.prototype.getValue = function () { return this.value; }; function A(value) { this.value = value + 1; } A.prototype = new Parent(); function B(value) { this.value = value * 2; } B.prototype = new Parent(); alert((new A(5)).getValue()); // 6 alert((new B(5)).getValue()); // 10
  • 48. // Sharing function A(value) { this.value = value + 1; } function B(value) { this.value = value * 2; } A.prototype.getValue = B.prototype.getValue = function () { return this.value; }; alert((new A(5)).getValue()); // 6 alert((new B(5)).getValue()); // 10
  • 49. Array
  • 50. Date