SlideShare una empresa de Scribd logo
1 de 63
Descargar para leer sin conexión
JavaScript
JavaScript
Enter the Dragon
JavaScript: enter the dragon
Most misunderstood language
You have no choice
…but you have plenty of options
JavaScript
JavaScript   human body
“If you have a body, you are an athlete”
           Bill Bowerman, co-founder of Nike.
If you code for the Web,
you are a JavaScript Developer
Control
JavaScript: enter the dragon
Why you “unfit”?
Why your JavaScript sucks?
JavaScript: enter the dragon
JavaScript: enter the dragon
“This is not important”
“I don’t need it any more, it’s XXI century”
           “I am good enough!”
       “It’s way too complicated”
        “I don’t have time for this”
Kyle Maynard — MMA fighter
Kyle Maynard — MMA fighter
Kyle Maynard — MMA fighter




Excuses… Let’s hear yours again
There are no shortcuts
“Those who are unaware
 they are walking in darkness
 will never seek the light.”
 Bruce Lee
Six essential bits
Six pack
1
Types & type coercion
object
 number
  string
 boolean
   null
undefined
5 - "4"
5 + "4"
+!{}[true]
+[1]
+[1, 2]
7 - "a"
7 / 0
…
2 Operators,
especially “+” & “==”
5 + "4"
5 + null
4 == "4.00"
null == undefined
0 == false
0 == null
null == false
typeof null == "object"
typeof function () {} == "function"
3
Objects & primitives
var a = "string";
alert(a.length);
a.t = 3;
alert(a.t);
4
Functions & constructors
function f() {};

var a   =   f
            ,
    b   =   f(),
    c   =   new f ,
    d   =   f(f);
5
Closures
function add(a) {
    return function (b) {
         return a + b;
    };
}

add(3)(4) == 7
6
Prototype
Prototypes in JavaScript
      in 5 minutes
function f() {};
                   f   P
function f() {};
f.prototype.x = 3;   f   P   x: 3
function f() {};
f.prototype.x = 3;   f   P   x: 3

var a = new f;

                     a
function f() {};
f.prototype.x = 3;    f     P   x: 3

var a = new f;
a.x = 2;
a.y = 1;              a
                     x: 2
                     y: 1
function f() {};
f.prototype.x = 3;    f     P   x: 3

var a = new f;
a.x = 2;
a.y = 1;              a     b
var b = new f;       x: 2
                     y: 1
function f() {};
f.prototype.x = 3;      z: 0   P2    f     P   x: 3

var a = new f;
a.x = 2;
a.y = 1;                             a     b
var b = new f;                      x: 2
f.prototype = {z: 0};               y: 1
function f() {};
f.prototype.x = 3;      z: 0   P2    f     P   x: 3

var a = new f;
a.x = 2;
a.y = 1;                       c     a     b
var b = new f;                      x: 2
f.prototype = {z: 0};               y: 1
var c = new f;
function f() {};
f.prototype.x = 3;      z: 0   P2    f     P   x: 3

var a = new f;
a.x = 2;
a.y = 1;                       c     a     b
var b = new f;                      x: 2
f.prototype = {z: 0};               y: 1
var c = new f;

               b.constructor == f
            c.constructor == Object
I didn’t get it…
Function.constructor == Function
JavaScript: enter the dragon
Nobody knows what to do
JavaScript: enter the dragon
http://www.udel.edu/anthro/neitzel/supplemental%20sportsS09.htm
Different goals
demand different approaches
Form always follows the function
http://www.flickr.com/photos/sgroi/3228398172/
http://en.wikipedia.org/wiki/Hercules_of_the_Forum_Boarium
JavaScript: enter the dragon
http://www.flickr.com/photos/stebbz/2451346427/
JavaScript: enter the dragon
JavaScript: enter the dragon
Thank You
“A wise man can learn more from
 a foolish question
 than a fool can learn from
 a wise answer.”
Bruce Lee
“If you spend too much time
 thinking about a thing,
 you’ll never get it done.”
 Bruce Lee

Más contenido relacionado

La actualidad más candente

Functors, applicatives, monads
Functors, applicatives, monadsFunctors, applicatives, monads
Functors, applicatives, monadsrkaippully
 
[C++ korea] effective modern c++ study item 3 understand decltype +이동우
[C++ korea] effective modern c++ study   item 3 understand decltype +이동우[C++ korea] effective modern c++ study   item 3 understand decltype +이동우
[C++ korea] effective modern c++ study item 3 understand decltype +이동우Seok-joon Yun
 
JavaScript - Agora nervoso
JavaScript - Agora nervosoJavaScript - Agora nervoso
JavaScript - Agora nervosoLuis Vendrame
 
C++ Programming - 1st Study
C++ Programming - 1st StudyC++ Programming - 1st Study
C++ Programming - 1st StudyChris Ohk
 
All I know about rsc.io/c2go
All I know about rsc.io/c2goAll I know about rsc.io/c2go
All I know about rsc.io/c2goMoriyoshi Koizumi
 
Data Structures Practical File
Data Structures Practical File Data Structures Practical File
Data Structures Practical File Harjinder Singh
 
Basic Programs of C++
Basic Programs of C++Basic Programs of C++
Basic Programs of C++Bharat Kalia
 
C++ Programming - 11th Study
C++ Programming - 11th StudyC++ Programming - 11th Study
C++ Programming - 11th StudyChris Ohk
 
Introduction to Javascript
Introduction to JavascriptIntroduction to Javascript
Introduction to JavascriptHong Liu
 
2018 cosup-delete unused python code safely - english
2018 cosup-delete unused python code safely - english2018 cosup-delete unused python code safely - english
2018 cosup-delete unused python code safely - englishJen Yee Hong
 

La actualidad más candente (20)

Implementing stack
Implementing stackImplementing stack
Implementing stack
 
Pratik Bakane C++
Pratik Bakane C++Pratik Bakane C++
Pratik Bakane C++
 
Functors, applicatives, monads
Functors, applicatives, monadsFunctors, applicatives, monads
Functors, applicatives, monads
 
Pratik Bakane C++
Pratik Bakane C++Pratik Bakane C++
Pratik Bakane C++
 
Function basics
Function basicsFunction basics
Function basics
 
Pratik Bakane C++
Pratik Bakane C++Pratik Bakane C++
Pratik Bakane C++
 
ECMAScript 5: Новое в JavaScript
ECMAScript 5: Новое в JavaScriptECMAScript 5: Новое в JavaScript
ECMAScript 5: Новое в JavaScript
 
[C++ korea] effective modern c++ study item 3 understand decltype +이동우
[C++ korea] effective modern c++ study   item 3 understand decltype +이동우[C++ korea] effective modern c++ study   item 3 understand decltype +이동우
[C++ korea] effective modern c++ study item 3 understand decltype +이동우
 
Stl algorithm-Basic types
Stl algorithm-Basic typesStl algorithm-Basic types
Stl algorithm-Basic types
 
JavaScript - Agora nervoso
JavaScript - Agora nervosoJavaScript - Agora nervoso
JavaScript - Agora nervoso
 
C++ Programming - 1st Study
C++ Programming - 1st StudyC++ Programming - 1st Study
C++ Programming - 1st Study
 
All I know about rsc.io/c2go
All I know about rsc.io/c2goAll I know about rsc.io/c2go
All I know about rsc.io/c2go
 
Pratik Bakane C++
Pratik Bakane C++Pratik Bakane C++
Pratik Bakane C++
 
Static and const members
Static and const membersStatic and const members
Static and const members
 
Cquestions
Cquestions Cquestions
Cquestions
 
Data Structures Practical File
Data Structures Practical File Data Structures Practical File
Data Structures Practical File
 
Basic Programs of C++
Basic Programs of C++Basic Programs of C++
Basic Programs of C++
 
C++ Programming - 11th Study
C++ Programming - 11th StudyC++ Programming - 11th Study
C++ Programming - 11th Study
 
Introduction to Javascript
Introduction to JavascriptIntroduction to Javascript
Introduction to Javascript
 
2018 cosup-delete unused python code safely - english
2018 cosup-delete unused python code safely - english2018 cosup-delete unused python code safely - english
2018 cosup-delete unused python code safely - english
 

Similar a JavaScript: enter the dragon

Java level 1 Quizzes
Java level 1 QuizzesJava level 1 Quizzes
Java level 1 QuizzesSteven Luo
 
Journey of a C# developer into Javascript
Journey of a C# developer into JavascriptJourney of a C# developer into Javascript
Journey of a C# developer into JavascriptMassimo Franciosa
 
Static Optimization of PHP bytecode (PHPSC 2017)
Static Optimization of PHP bytecode (PHPSC 2017)Static Optimization of PHP bytecode (PHPSC 2017)
Static Optimization of PHP bytecode (PHPSC 2017)Nikita Popov
 
[FTfJP23] Points-to Analysis for Context-oriented Javascript Programs
[FTfJP23] Points-to Analysis for Context-oriented Javascript Programs[FTfJP23] Points-to Analysis for Context-oriented Javascript Programs
[FTfJP23] Points-to Analysis for Context-oriented Javascript ProgramsUniversidad de los Andes
 
[FTfJP23] Points-to Analysis for Context-oriented Javascript Programs
[FTfJP23] Points-to Analysis for Context-oriented Javascript Programs[FTfJP23] Points-to Analysis for Context-oriented Javascript Programs
[FTfJP23] Points-to Analysis for Context-oriented Javascript ProgramsUniversidad de los Andes
 
Scripting
ScriptingScripting
Scriptingaztack
 
Kamil witecki asynchronous, yet readable, code
Kamil witecki asynchronous, yet readable, codeKamil witecki asynchronous, yet readable, code
Kamil witecki asynchronous, yet readable, codeKamil Witecki
 
Frege - consequently functional programming for the JVM
Frege - consequently functional programming for the JVMFrege - consequently functional programming for the JVM
Frege - consequently functional programming for the JVMDierk König
 
The mighty js_function
The mighty js_functionThe mighty js_function
The mighty js_functiontimotheeg
 
Object Oriented JavaScript
Object Oriented JavaScriptObject Oriented JavaScript
Object Oriented JavaScriptJulie Iskander
 

Similar a JavaScript: enter the dragon (20)

AnsChap1.pdf
AnsChap1.pdfAnsChap1.pdf
AnsChap1.pdf
 
Java level 1 Quizzes
Java level 1 QuizzesJava level 1 Quizzes
Java level 1 Quizzes
 
JavaScript Inheritance
JavaScript InheritanceJavaScript Inheritance
JavaScript Inheritance
 
Data Structure and Algorithm
Data Structure and AlgorithmData Structure and Algorithm
Data Structure and Algorithm
 
V8
V8V8
V8
 
Journey of a C# developer into Javascript
Journey of a C# developer into JavascriptJourney of a C# developer into Javascript
Journey of a C# developer into Javascript
 
EcmaScript 6
EcmaScript 6 EcmaScript 6
EcmaScript 6
 
Static Optimization of PHP bytecode (PHPSC 2017)
Static Optimization of PHP bytecode (PHPSC 2017)Static Optimization of PHP bytecode (PHPSC 2017)
Static Optimization of PHP bytecode (PHPSC 2017)
 
[FTfJP23] Points-to Analysis for Context-oriented Javascript Programs
[FTfJP23] Points-to Analysis for Context-oriented Javascript Programs[FTfJP23] Points-to Analysis for Context-oriented Javascript Programs
[FTfJP23] Points-to Analysis for Context-oriented Javascript Programs
 
[FTfJP23] Points-to Analysis for Context-oriented Javascript Programs
[FTfJP23] Points-to Analysis for Context-oriented Javascript Programs[FTfJP23] Points-to Analysis for Context-oriented Javascript Programs
[FTfJP23] Points-to Analysis for Context-oriented Javascript Programs
 
Scripting
ScriptingScripting
Scripting
 
Kamil witecki asynchronous, yet readable, code
Kamil witecki asynchronous, yet readable, codeKamil witecki asynchronous, yet readable, code
Kamil witecki asynchronous, yet readable, code
 
Frege - consequently functional programming for the JVM
Frege - consequently functional programming for the JVMFrege - consequently functional programming for the JVM
Frege - consequently functional programming for the JVM
 
Python speleology
Python speleologyPython speleology
Python speleology
 
The mighty js_function
The mighty js_functionThe mighty js_function
The mighty js_function
 
Advanced JavaScript
Advanced JavaScript Advanced JavaScript
Advanced JavaScript
 
Relation and function pdf
Relation and function pdfRelation and function pdf
Relation and function pdf
 
Object Oriented JavaScript
Object Oriented JavaScriptObject Oriented JavaScript
Object Oriented JavaScript
 
Ajaxworld
AjaxworldAjaxworld
Ajaxworld
 
1. functions
1. functions1. functions
1. functions
 

Más de Dmitry Baranovskiy (14)

The Origins of Magic
The Origins of MagicThe Origins of Magic
The Origins of Magic
 
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
 
Java Script Workshop
Java Script WorkshopJava Script Workshop
Java Script Workshop
 
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

Connector Corner: Extending LLM automation use cases with UiPath GenAI connec...
Connector Corner: Extending LLM automation use cases with UiPath GenAI connec...Connector Corner: Extending LLM automation use cases with UiPath GenAI connec...
Connector Corner: Extending LLM automation use cases with UiPath GenAI connec...DianaGray10
 
20230202 - Introduction to tis-py
20230202 - Introduction to tis-py20230202 - Introduction to tis-py
20230202 - Introduction to tis-pyJamie (Taka) Wang
 
NIST Cybersecurity Framework (CSF) 2.0 Workshop
NIST Cybersecurity Framework (CSF) 2.0 WorkshopNIST Cybersecurity Framework (CSF) 2.0 Workshop
NIST Cybersecurity Framework (CSF) 2.0 WorkshopBachir Benyammi
 
UiPath Studio Web workshop series - Day 7
UiPath Studio Web workshop series - Day 7UiPath Studio Web workshop series - Day 7
UiPath Studio Web workshop series - Day 7DianaGray10
 
Cybersecurity Workshop #1.pptx
Cybersecurity Workshop #1.pptxCybersecurity Workshop #1.pptx
Cybersecurity Workshop #1.pptxGDSC PJATK
 
UiPath Studio Web workshop series - Day 8
UiPath Studio Web workshop series - Day 8UiPath Studio Web workshop series - Day 8
UiPath Studio Web workshop series - Day 8DianaGray10
 
UiPath Community: AI for UiPath Automation Developers
UiPath Community: AI for UiPath Automation DevelopersUiPath Community: AI for UiPath Automation Developers
UiPath Community: AI for UiPath Automation DevelopersUiPathCommunity
 
COMPUTER 10: Lesson 7 - File Storage and Online Collaboration
COMPUTER 10: Lesson 7 - File Storage and Online CollaborationCOMPUTER 10: Lesson 7 - File Storage and Online Collaboration
COMPUTER 10: Lesson 7 - File Storage and Online Collaborationbruanjhuli
 
Introduction to Matsuo Laboratory (ENG).pptx
Introduction to Matsuo Laboratory (ENG).pptxIntroduction to Matsuo Laboratory (ENG).pptx
Introduction to Matsuo Laboratory (ENG).pptxMatsuo Lab
 
Building Your Own AI Instance (TBLC AI )
Building Your Own AI Instance (TBLC AI )Building Your Own AI Instance (TBLC AI )
Building Your Own AI Instance (TBLC AI )Brian Pichman
 
Machine Learning Model Validation (Aijun Zhang 2024).pdf
Machine Learning Model Validation (Aijun Zhang 2024).pdfMachine Learning Model Validation (Aijun Zhang 2024).pdf
Machine Learning Model Validation (Aijun Zhang 2024).pdfAijun Zhang
 
Salesforce Miami User Group Event - 1st Quarter 2024
Salesforce Miami User Group Event - 1st Quarter 2024Salesforce Miami User Group Event - 1st Quarter 2024
Salesforce Miami User Group Event - 1st Quarter 2024SkyPlanner
 
Secure your environment with UiPath and CyberArk technologies - Session 1
Secure your environment with UiPath and CyberArk technologies - Session 1Secure your environment with UiPath and CyberArk technologies - Session 1
Secure your environment with UiPath and CyberArk technologies - Session 1DianaGray10
 
Meet the new FSP 3000 M-Flex800™
Meet the new FSP 3000 M-Flex800™Meet the new FSP 3000 M-Flex800™
Meet the new FSP 3000 M-Flex800™Adtran
 
AI You Can Trust - Ensuring Success with Data Integrity Webinar
AI You Can Trust - Ensuring Success with Data Integrity WebinarAI You Can Trust - Ensuring Success with Data Integrity Webinar
AI You Can Trust - Ensuring Success with Data Integrity WebinarPrecisely
 
Designing A Time bound resource download URL
Designing A Time bound resource download URLDesigning A Time bound resource download URL
Designing A Time bound resource download URLRuncy Oommen
 
activity_diagram_combine_v4_20190827.pdfactivity_diagram_combine_v4_20190827.pdf
activity_diagram_combine_v4_20190827.pdfactivity_diagram_combine_v4_20190827.pdfactivity_diagram_combine_v4_20190827.pdfactivity_diagram_combine_v4_20190827.pdf
activity_diagram_combine_v4_20190827.pdfactivity_diagram_combine_v4_20190827.pdfJamie (Taka) Wang
 
UiPath Studio Web workshop series - Day 6
UiPath Studio Web workshop series - Day 6UiPath Studio Web workshop series - Day 6
UiPath Studio Web workshop series - Day 6DianaGray10
 
UiPath Platform: The Backend Engine Powering Your Automation - Session 1
UiPath Platform: The Backend Engine Powering Your Automation - Session 1UiPath Platform: The Backend Engine Powering Your Automation - Session 1
UiPath Platform: The Backend Engine Powering Your Automation - Session 1DianaGray10
 

Último (20)

Connector Corner: Extending LLM automation use cases with UiPath GenAI connec...
Connector Corner: Extending LLM automation use cases with UiPath GenAI connec...Connector Corner: Extending LLM automation use cases with UiPath GenAI connec...
Connector Corner: Extending LLM automation use cases with UiPath GenAI connec...
 
20230104 - machine vision
20230104 - machine vision20230104 - machine vision
20230104 - machine vision
 
20230202 - Introduction to tis-py
20230202 - Introduction to tis-py20230202 - Introduction to tis-py
20230202 - Introduction to tis-py
 
NIST Cybersecurity Framework (CSF) 2.0 Workshop
NIST Cybersecurity Framework (CSF) 2.0 WorkshopNIST Cybersecurity Framework (CSF) 2.0 Workshop
NIST Cybersecurity Framework (CSF) 2.0 Workshop
 
UiPath Studio Web workshop series - Day 7
UiPath Studio Web workshop series - Day 7UiPath Studio Web workshop series - Day 7
UiPath Studio Web workshop series - Day 7
 
Cybersecurity Workshop #1.pptx
Cybersecurity Workshop #1.pptxCybersecurity Workshop #1.pptx
Cybersecurity Workshop #1.pptx
 
UiPath Studio Web workshop series - Day 8
UiPath Studio Web workshop series - Day 8UiPath Studio Web workshop series - Day 8
UiPath Studio Web workshop series - Day 8
 
UiPath Community: AI for UiPath Automation Developers
UiPath Community: AI for UiPath Automation DevelopersUiPath Community: AI for UiPath Automation Developers
UiPath Community: AI for UiPath Automation Developers
 
COMPUTER 10: Lesson 7 - File Storage and Online Collaboration
COMPUTER 10: Lesson 7 - File Storage and Online CollaborationCOMPUTER 10: Lesson 7 - File Storage and Online Collaboration
COMPUTER 10: Lesson 7 - File Storage and Online Collaboration
 
Introduction to Matsuo Laboratory (ENG).pptx
Introduction to Matsuo Laboratory (ENG).pptxIntroduction to Matsuo Laboratory (ENG).pptx
Introduction to Matsuo Laboratory (ENG).pptx
 
Building Your Own AI Instance (TBLC AI )
Building Your Own AI Instance (TBLC AI )Building Your Own AI Instance (TBLC AI )
Building Your Own AI Instance (TBLC AI )
 
Machine Learning Model Validation (Aijun Zhang 2024).pdf
Machine Learning Model Validation (Aijun Zhang 2024).pdfMachine Learning Model Validation (Aijun Zhang 2024).pdf
Machine Learning Model Validation (Aijun Zhang 2024).pdf
 
Salesforce Miami User Group Event - 1st Quarter 2024
Salesforce Miami User Group Event - 1st Quarter 2024Salesforce Miami User Group Event - 1st Quarter 2024
Salesforce Miami User Group Event - 1st Quarter 2024
 
Secure your environment with UiPath and CyberArk technologies - Session 1
Secure your environment with UiPath and CyberArk technologies - Session 1Secure your environment with UiPath and CyberArk technologies - Session 1
Secure your environment with UiPath and CyberArk technologies - Session 1
 
Meet the new FSP 3000 M-Flex800™
Meet the new FSP 3000 M-Flex800™Meet the new FSP 3000 M-Flex800™
Meet the new FSP 3000 M-Flex800™
 
AI You Can Trust - Ensuring Success with Data Integrity Webinar
AI You Can Trust - Ensuring Success with Data Integrity WebinarAI You Can Trust - Ensuring Success with Data Integrity Webinar
AI You Can Trust - Ensuring Success with Data Integrity Webinar
 
Designing A Time bound resource download URL
Designing A Time bound resource download URLDesigning A Time bound resource download URL
Designing A Time bound resource download URL
 
activity_diagram_combine_v4_20190827.pdfactivity_diagram_combine_v4_20190827.pdf
activity_diagram_combine_v4_20190827.pdfactivity_diagram_combine_v4_20190827.pdfactivity_diagram_combine_v4_20190827.pdfactivity_diagram_combine_v4_20190827.pdf
activity_diagram_combine_v4_20190827.pdfactivity_diagram_combine_v4_20190827.pdf
 
UiPath Studio Web workshop series - Day 6
UiPath Studio Web workshop series - Day 6UiPath Studio Web workshop series - Day 6
UiPath Studio Web workshop series - Day 6
 
UiPath Platform: The Backend Engine Powering Your Automation - Session 1
UiPath Platform: The Backend Engine Powering Your Automation - Session 1UiPath Platform: The Backend Engine Powering Your Automation - Session 1
UiPath Platform: The Backend Engine Powering Your Automation - Session 1
 

JavaScript: enter the dragon