SlideShare a Scribd company logo
1 of 41
Download to read offline
functon some () {
  “use strict”;
  // do something...
  ubar = ‘dedededfe’ // error
}
for (var i = 0; i < myarray.length; i++ ) {
  // = some
}




for (var i = 0, max = myarray.length; i < max ;i++ ) {
  // = some
}
var man = { heads : 2, legs : 2 };
Object.prototype.clne = function() {};

for (var i in man) {
  if (man.hasOwnProperty(i)) {
     console.log(i, ‘:’, man[i]);
  }     # => heads:2
}       #     legs:2
var zero = 0;
if (zero === false) {
   // good
}

if (zero == false) {
   // anti pattern
}
// anti pattern
parseInt(“012”) => 10

// good way
parseInt(“012”, 10) => 12
Number(“012”)       => 12
var Person function(name) {
  this.name = name;
  this.say = function(){ return “ test “ + this.name };
}

var person = new Person(“aaa”);
function Gadget () {
  var name = “aaaa”;

    this.getName = function () { return name};
    this.setName = function (n) { name = n };
}

var g = new Gadget();
 g.getName();
 g.setName(‘test’);
g.name = “change”;
var Person = function(name) {
  this.name = name;
  this.say = function(){ return “ test “ + this.name };
}

var person = Person(“aaa”);
person.name // => this will reference window.name or
global symbol ‘name’
var Waffle = function() {
  var that = { msg : ‘yummy’ };
  return that;
}

var waffle = new Waffle(); // => {msg: ‘yummy’};
function Waffle() {
  if(!(this instanceof Waffle)) {
    return new Waffle();
  }

 this.tastes = ‘yummy’ ;
}
var waffle = Waffle(); // is instance of Waffle
try {
  throw {
    name : “someError”,
    message : “error test”,
    test : function() { return name }
  };
} catch (e) {
  console.log(e.test());
}
try {
   throw {
      name : “someError”,
      message : “error test”,
      errorStatus : 312
   };
} catch (e) {
   return [message, e.errorStatus];
}
function Gadget () {
  this.name = “aaaa”;

    this.getName = function () { return name};
    this.setName = function (n) { name = n };
}

var g = new Gadget();
g.name = “changed”;
var blog = Blog.load( {blog_id: 2} );
var entry = blog.entries().first();

var logger = function(msg) {
   console.log(“Blog : “ + blog.id + “ Entry :
“ + entry.id + msg)
};

logger(“see this”) / /=> “Blog id : 2 Entry id : 3 see
this”
var blog = Blog.load( {blog_id: 2} );
var entry = blog.entry();

function cusutom_logger(blog_id, entry_id) {
  return function(msg) {
   console.log(“Blog : “ + blog_id + “ Entry :
“ + entry_id + msg)};
}

var logger = cusutom_logger(blog.id, entry.id);
logger(“see this”) / /=> “Blog id : 2 Entry id : 3 see
this”
$(‘div1’).onclick = function () {
   alert (‘aaa’);
}
$(‘div2’).onclick = function () {
   alert (‘bbb’);
}
....
$(‘div1’).onclick = gen_alert(‘aaa’);
$(‘div2’).onclick = gen_alert(‘bbb’);
function gen_alert(msg) {
  return function { alert(msg) };
}
typedef int (*CALLBACK)(* void); // pointer type for int func(void *)
typedef struct {
    CALLBACK handler;
    void * option;
} callback_data;

callback_data callback;
void register_callback (CALLBACK f, void* opt) {
    callback.handler = f; callback.option = opt;
}
void invoke_callback() {
    CALLBACK f = callback.handler;
    f(callback.option);
}

char * msg = “message”;
int speak() { printf (“%s”, (char *)void) };
main () {
    register_callback((CALLBACK)speak, (void *)msg);
    invoke_callback();
}

More Related Content

What's hot

jQuery: out with the old, in with the new
jQuery: out with the old, in with the newjQuery: out with the old, in with the new
jQuery: out with the old, in with the new
Remy Sharp
 
20 modules i haven't yet talked about
20 modules i haven't yet talked about20 modules i haven't yet talked about
20 modules i haven't yet talked about
Tatsuhiko Miyagawa
 
Opa presentation at GamesJs
Opa presentation at GamesJsOpa presentation at GamesJs
Opa presentation at GamesJs
Henri Binsztok
 
Tipo virus espia con esto aprenderan a espiar a personas etc jeropas de mrd :v
Tipo virus espia con esto aprenderan a espiar a personas etc jeropas de mrd :v Tipo virus espia con esto aprenderan a espiar a personas etc jeropas de mrd :v
Tipo virus espia con esto aprenderan a espiar a personas etc jeropas de mrd :v
Arian Gutierrez
 
Jqeury ajax plugins
Jqeury ajax pluginsJqeury ajax plugins
Jqeury ajax plugins
Inbal Geffen
 

What's hot (20)

Understanding Functions and "this" in the World of ES2017+
Understanding Functions and "this" in the World of ES2017+Understanding Functions and "this" in the World of ES2017+
Understanding Functions and "this" in the World of ES2017+
 
jQuery: out with the old, in with the new
jQuery: out with the old, in with the newjQuery: out with the old, in with the new
jQuery: out with the old, in with the new
 
20 modules i haven't yet talked about
20 modules i haven't yet talked about20 modules i haven't yet talked about
20 modules i haven't yet talked about
 
Beyond the DOM: Sane Structure for JS Apps
Beyond the DOM: Sane Structure for JS AppsBeyond the DOM: Sane Structure for JS Apps
Beyond the DOM: Sane Structure for JS Apps
 
Component lifecycle hooks in Angular 2.0
Component lifecycle hooks in Angular 2.0Component lifecycle hooks in Angular 2.0
Component lifecycle hooks in Angular 2.0
 
Future of HTTP in CakePHP
Future of HTTP in CakePHPFuture of HTTP in CakePHP
Future of HTTP in CakePHP
 
AngularJS - $http & $resource Services
AngularJS - $http & $resource ServicesAngularJS - $http & $resource Services
AngularJS - $http & $resource Services
 
Angular promises and http
Angular promises and httpAngular promises and http
Angular promises and http
 
Building Your First Widget
Building Your First WidgetBuilding Your First Widget
Building Your First Widget
 
えっ、なにそれこわい
えっ、なにそれこわいえっ、なにそれこわい
えっ、なにそれこわい
 
FRP and Bacon.js
FRP and Bacon.jsFRP and Bacon.js
FRP and Bacon.js
 
Composition in JavaScript
Composition in JavaScriptComposition in JavaScript
Composition in JavaScript
 
BVJS
BVJSBVJS
BVJS
 
Opa presentation at GamesJs
Opa presentation at GamesJsOpa presentation at GamesJs
Opa presentation at GamesJs
 
안드로이드 세미나 2
안드로이드 세미나 2안드로이드 세미나 2
안드로이드 세미나 2
 
안드로이드 세미나 2
안드로이드 세미나 2안드로이드 세미나 2
안드로이드 세미나 2
 
Tipo virus espia con esto aprenderan a espiar a personas etc jeropas de mrd :v
Tipo virus espia con esto aprenderan a espiar a personas etc jeropas de mrd :v Tipo virus espia con esto aprenderan a espiar a personas etc jeropas de mrd :v
Tipo virus espia con esto aprenderan a espiar a personas etc jeropas de mrd :v
 
Ruby on Rails Intro
Ruby on Rails IntroRuby on Rails Intro
Ruby on Rails Intro
 
Jqeury ajax plugins
Jqeury ajax pluginsJqeury ajax plugins
Jqeury ajax plugins
 
Add loop shortcode
Add loop shortcodeAdd loop shortcode
Add loop shortcode
 

Similar to JavaScript patterns

The Beauty Of Java Script V5a
The Beauty Of Java Script V5aThe Beauty Of Java Script V5a
The Beauty Of Java Script V5a
rajivmordani
 
JavaScript for PHP developers
JavaScript for PHP developersJavaScript for PHP developers
JavaScript for PHP developers
Stoyan Stefanov
 
Jsphp 110312161301-phpapp02
Jsphp 110312161301-phpapp02Jsphp 110312161301-phpapp02
Jsphp 110312161301-phpapp02
Seri Moth
 
Orlando BarCamp Why Javascript Doesn't Suck
Orlando BarCamp Why Javascript Doesn't SuckOrlando BarCamp Why Javascript Doesn't Suck
Orlando BarCamp Why Javascript Doesn't Suck
erockendude
 

Similar to JavaScript patterns (20)

JavaScript - Like a Box of Chocolates
JavaScript - Like a Box of ChocolatesJavaScript - Like a Box of Chocolates
JavaScript - Like a Box of Chocolates
 
Introduction to ECMAScript 2015
Introduction to ECMAScript 2015Introduction to ECMAScript 2015
Introduction to ECMAScript 2015
 
The Beauty Of Java Script V5a
The Beauty Of Java Script V5aThe Beauty Of Java Script V5a
The Beauty Of Java Script V5a
 
The Beauty of Java Script
The Beauty of Java ScriptThe Beauty of Java Script
The Beauty of Java Script
 
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)
 
JavaScript Survival Guide
JavaScript Survival GuideJavaScript Survival Guide
JavaScript Survival Guide
 
Intro to Advanced JavaScript
Intro to Advanced JavaScriptIntro to Advanced JavaScript
Intro to Advanced JavaScript
 
Say It With Javascript
Say It With JavascriptSay It With Javascript
Say It With Javascript
 
Ian 20150116 java script oop
Ian 20150116 java script oopIan 20150116 java script oop
Ian 20150116 java script oop
 
jQuery Data Manipulate API - A source code dissecting journey
jQuery Data Manipulate API - A source code dissecting journeyjQuery Data Manipulate API - A source code dissecting journey
jQuery Data Manipulate API - A source code dissecting journey
 
Backbone js
Backbone jsBackbone js
Backbone js
 
Ten useful JavaScript tips & best practices
Ten useful JavaScript tips & best practicesTen useful JavaScript tips & best practices
Ten useful JavaScript tips & best practices
 
TDC 2014 - JavaScript de qualidade: hoje, amanhã e sempre!
TDC 2014 - JavaScript de qualidade: hoje, amanhã e sempre!TDC 2014 - JavaScript de qualidade: hoje, amanhã e sempre!
TDC 2014 - JavaScript de qualidade: hoje, amanhã e sempre!
 
JavaScript for PHP developers
JavaScript for PHP developersJavaScript for PHP developers
JavaScript for PHP developers
 
Jsphp 110312161301-phpapp02
Jsphp 110312161301-phpapp02Jsphp 110312161301-phpapp02
Jsphp 110312161301-phpapp02
 
JavaScript - Like a Box of Chocolates - jsDay
JavaScript - Like a Box of Chocolates - jsDayJavaScript - Like a Box of Chocolates - jsDay
JavaScript - Like a Box of Chocolates - jsDay
 
Orlando BarCamp Why Javascript Doesn't Suck
Orlando BarCamp Why Javascript Doesn't SuckOrlando BarCamp Why Javascript Doesn't Suck
Orlando BarCamp Why Javascript Doesn't Suck
 
Fundamental JavaScript [UTC, March 2014]
Fundamental JavaScript [UTC, March 2014]Fundamental JavaScript [UTC, March 2014]
Fundamental JavaScript [UTC, March 2014]
 
Introduccion a Jasmin
Introduccion a JasminIntroduccion a Jasmin
Introduccion a Jasmin
 
Javascript - Beyond-jQuery
Javascript - Beyond-jQueryJavascript - Beyond-jQuery
Javascript - Beyond-jQuery
 

Recently uploaded

Recently uploaded (20)

Evaluating the top large language models.pdf
Evaluating the top large language models.pdfEvaluating the top large language models.pdf
Evaluating the top large language models.pdf
 
TrustArc Webinar - Stay Ahead of US State Data Privacy Law Developments
TrustArc Webinar - Stay Ahead of US State Data Privacy Law DevelopmentsTrustArc Webinar - Stay Ahead of US State Data Privacy Law Developments
TrustArc Webinar - Stay Ahead of US State Data Privacy Law Developments
 
Finology Group – Insurtech Innovation Award 2024
Finology Group – Insurtech Innovation Award 2024Finology Group – Insurtech Innovation Award 2024
Finology Group – Insurtech Innovation Award 2024
 
[2024]Digital Global Overview Report 2024 Meltwater.pdf
[2024]Digital Global Overview Report 2024 Meltwater.pdf[2024]Digital Global Overview Report 2024 Meltwater.pdf
[2024]Digital Global Overview Report 2024 Meltwater.pdf
 
A Domino Admins Adventures (Engage 2024)
A Domino Admins Adventures (Engage 2024)A Domino Admins Adventures (Engage 2024)
A Domino Admins Adventures (Engage 2024)
 
How to Troubleshoot Apps for the Modern Connected Worker
How to Troubleshoot Apps for the Modern Connected WorkerHow to Troubleshoot Apps for the Modern Connected Worker
How to Troubleshoot Apps for the Modern Connected Worker
 
Presentation on how to chat with PDF using ChatGPT code interpreter
Presentation on how to chat with PDF using ChatGPT code interpreterPresentation on how to chat with PDF using ChatGPT code interpreter
Presentation on how to chat with PDF using ChatGPT code interpreter
 
Understanding Discord NSFW Servers A Guide for Responsible Users.pdf
Understanding Discord NSFW Servers A Guide for Responsible Users.pdfUnderstanding Discord NSFW Servers A Guide for Responsible Users.pdf
Understanding Discord NSFW Servers A Guide for Responsible Users.pdf
 
Raspberry Pi 5: Challenges and Solutions in Bringing up an OpenGL/Vulkan Driv...
Raspberry Pi 5: Challenges and Solutions in Bringing up an OpenGL/Vulkan Driv...Raspberry Pi 5: Challenges and Solutions in Bringing up an OpenGL/Vulkan Driv...
Raspberry Pi 5: Challenges and Solutions in Bringing up an OpenGL/Vulkan Driv...
 
08448380779 Call Girls In Greater Kailash - I Women Seeking Men
08448380779 Call Girls In Greater Kailash - I Women Seeking Men08448380779 Call Girls In Greater Kailash - I Women Seeking Men
08448380779 Call Girls In Greater Kailash - I Women Seeking Men
 
08448380779 Call Girls In Diplomatic Enclave Women Seeking Men
08448380779 Call Girls In Diplomatic Enclave Women Seeking Men08448380779 Call Girls In Diplomatic Enclave Women Seeking Men
08448380779 Call Girls In Diplomatic Enclave Women Seeking Men
 
GenAI Risks & Security Meetup 01052024.pdf
GenAI Risks & Security Meetup 01052024.pdfGenAI Risks & Security Meetup 01052024.pdf
GenAI Risks & Security Meetup 01052024.pdf
 
Mastering MySQL Database Architecture: Deep Dive into MySQL Shell and MySQL R...
Mastering MySQL Database Architecture: Deep Dive into MySQL Shell and MySQL R...Mastering MySQL Database Architecture: Deep Dive into MySQL Shell and MySQL R...
Mastering MySQL Database Architecture: Deep Dive into MySQL Shell and MySQL R...
 
How to Troubleshoot Apps for the Modern Connected Worker
How to Troubleshoot Apps for the Modern Connected WorkerHow to Troubleshoot Apps for the Modern Connected Worker
How to Troubleshoot Apps for the Modern Connected Worker
 
🐬 The future of MySQL is Postgres 🐘
🐬  The future of MySQL is Postgres   🐘🐬  The future of MySQL is Postgres   🐘
🐬 The future of MySQL is Postgres 🐘
 
08448380779 Call Girls In Civil Lines Women Seeking Men
08448380779 Call Girls In Civil Lines Women Seeking Men08448380779 Call Girls In Civil Lines Women Seeking Men
08448380779 Call Girls In Civil Lines Women Seeking Men
 
Axa Assurance Maroc - Insurer Innovation Award 2024
Axa Assurance Maroc - Insurer Innovation Award 2024Axa Assurance Maroc - Insurer Innovation Award 2024
Axa Assurance Maroc - Insurer Innovation Award 2024
 
Data Cloud, More than a CDP by Matt Robison
Data Cloud, More than a CDP by Matt RobisonData Cloud, More than a CDP by Matt Robison
Data Cloud, More than a CDP by Matt Robison
 
Tech Trends Report 2024 Future Today Institute.pdf
Tech Trends Report 2024 Future Today Institute.pdfTech Trends Report 2024 Future Today Institute.pdf
Tech Trends Report 2024 Future Today Institute.pdf
 
ProductAnonymous-April2024-WinProductDiscovery-MelissaKlemke
ProductAnonymous-April2024-WinProductDiscovery-MelissaKlemkeProductAnonymous-April2024-WinProductDiscovery-MelissaKlemke
ProductAnonymous-April2024-WinProductDiscovery-MelissaKlemke
 

JavaScript patterns

  • 1.
  • 2.
  • 3.
  • 4.
  • 5.
  • 6.
  • 7.
  • 8.
  • 9.
  • 10.
  • 11. functon some () { “use strict”; // do something... ubar = ‘dedededfe’ // error }
  • 12.
  • 13.
  • 14. for (var i = 0; i < myarray.length; i++ ) { // = some } for (var i = 0, max = myarray.length; i < max ;i++ ) { // = some }
  • 15.
  • 16.
  • 17. var man = { heads : 2, legs : 2 }; Object.prototype.clne = function() {}; for (var i in man) { if (man.hasOwnProperty(i)) { console.log(i, ‘:’, man[i]); } # => heads:2 } # legs:2
  • 18.
  • 19. var zero = 0; if (zero === false) { // good } if (zero == false) { // anti pattern }
  • 20.
  • 21. // anti pattern parseInt(“012”) => 10 // good way parseInt(“012”, 10) => 12 Number(“012”) => 12
  • 22.
  • 23.
  • 24. var Person function(name) { this.name = name; this.say = function(){ return “ test “ + this.name }; } var person = new Person(“aaa”);
  • 25.
  • 26. function Gadget () { var name = “aaaa”; this.getName = function () { return name}; this.setName = function (n) { name = n }; } var g = new Gadget(); g.getName(); g.setName(‘test’); g.name = “change”;
  • 27.
  • 28. var Person = function(name) { this.name = name; this.say = function(){ return “ test “ + this.name }; } var person = Person(“aaa”); person.name // => this will reference window.name or global symbol ‘name’
  • 29. var Waffle = function() { var that = { msg : ‘yummy’ }; return that; } var waffle = new Waffle(); // => {msg: ‘yummy’};
  • 30. function Waffle() { if(!(this instanceof Waffle)) { return new Waffle(); } this.tastes = ‘yummy’ ; } var waffle = Waffle(); // is instance of Waffle
  • 31. try { throw { name : “someError”, message : “error test”, test : function() { return name } }; } catch (e) { console.log(e.test()); }
  • 32. try { throw { name : “someError”, message : “error test”, errorStatus : 312 }; } catch (e) { return [message, e.errorStatus]; }
  • 33. function Gadget () { this.name = “aaaa”; this.getName = function () { return name}; this.setName = function (n) { name = n }; } var g = new Gadget(); g.name = “changed”;
  • 34. var blog = Blog.load( {blog_id: 2} ); var entry = blog.entries().first(); var logger = function(msg) { console.log(“Blog : “ + blog.id + “ Entry : “ + entry.id + msg) }; logger(“see this”) / /=> “Blog id : 2 Entry id : 3 see this”
  • 35. var blog = Blog.load( {blog_id: 2} ); var entry = blog.entry(); function cusutom_logger(blog_id, entry_id) { return function(msg) { console.log(“Blog : “ + blog_id + “ Entry : “ + entry_id + msg)}; } var logger = cusutom_logger(blog.id, entry.id); logger(“see this”) / /=> “Blog id : 2 Entry id : 3 see this”
  • 36.
  • 37.
  • 38.
  • 39. $(‘div1’).onclick = function () { alert (‘aaa’); } $(‘div2’).onclick = function () { alert (‘bbb’); } ....
  • 40. $(‘div1’).onclick = gen_alert(‘aaa’); $(‘div2’).onclick = gen_alert(‘bbb’); function gen_alert(msg) { return function { alert(msg) }; }
  • 41. typedef int (*CALLBACK)(* void); // pointer type for int func(void *) typedef struct { CALLBACK handler; void * option; } callback_data; callback_data callback; void register_callback (CALLBACK f, void* opt) { callback.handler = f; callback.option = opt; } void invoke_callback() { CALLBACK f = callback.handler; f(callback.option); } char * msg = “message”; int speak() { printf (“%s”, (char *)void) }; main () { register_callback((CALLBACK)speak, (void *)msg); invoke_callback(); }