{"id":350,"date":"2007-11-29T10:01:10","date_gmt":"2007-11-29T09:01:10","guid":{"rendered":"http:\/\/www.dotmana.com\/index.php\/?p=350"},"modified":"2007-11-29T10:01:10","modified_gmt":"2007-11-29T09:01:10","slug":"programmation-javascript-objet-par-lexemple","status":"publish","type":"post","link":"http:\/\/www.dotmana.com\/weblog\/2007\/11\/programmation-javascript-objet-par-lexemple\/","title":{"rendered":"Programmation JavaScript Objet par l&#8217;exemple"},"content":{"rendered":"<p>Un tr\u00e8s bon exemple de programmation JS Objet (concis et rapide) sur le blog jflad :<\/p>\n<blockquote>\n<div class=\"post-content\">Ce tutoriel vous pr\u00e9sente la syntaxe de la programmation Objet en <a href=\"http:\/\/blog.jflad.com\/tag\/Javascript\">Javascript<\/a>. Pour la petite histoire, le <a href=\"http:\/\/blog.jflad.com\/tag\/Javascript%20\">Javascript <\/a>\u00e9tait le pr\u00e9curseur des langages orient\u00e9 <strong>Objet <\/strong>pour le <strong>Web<\/strong>. D\u00e9cliner en <a href=\"http:\/\/blog.jflad.com\/tag\/Action%20Script\">Action Script<\/a> pour <a href=\"http:\/\/blog.jflad.com\/tag\/Flash%20\">Flash <\/a>ou il a connu un tr\u00e8s grand succ\u00e8s, il a perdu progressivement de sa notori\u00e9t\u00e9 au fil des ann\u00e9es, mais heureusement avec le <a href=\"http:\/\/blog.jflad.com\/tag\/Buzz%20\"><strong>Buzz <\/strong><\/a>du <a href=\"http:\/\/blog.jflad.com\/tag\/Web%202.0\">Web 2.0<\/a> et <a href=\"http:\/\/blog.jflad.com\/tag\/Ajax\">Ajax<\/a>, ce langage b\u00e9n\u00e9ficie d&#8217;une seconde vie !<\/p>\n<p>Voici un exemple qui vous montre comme cr\u00e9er vos propres objet en <a href=\"http:\/\/blog.jflad.com\/tag\/Javascript\">Javascript<\/a> et les instancier:<\/p>\n<blockquote><p>\/\/ Object JS<br \/>\nvar monObjet = {<\/p>\n<p>\/\/ Param\u00e8tre<br \/>\nparam1: {&#8220;x&#8221;: 0, &#8220;y&#8221;: 0},\u00a0\u00a0\u00a0 \/\/ On constate qu&#8217;un variable de param\u00e8tre peut aussi \u00eatre un objet<br \/>\nparam2: 2,<br \/>\nparam3: 333,<\/p>\n<p>\/\/ M\u00e9thode<br \/>\nmaMethode1 : function (var1, var2) {<br \/>\nthis[&#8216;param1&#8217;].x = var1;\u00a0\u00a0 \/\/ On pointe sur le param\u00e8tre objet avec des crochets comme dans <a href=\"http:\/\/blog.jflad.com\/tag\/Flash\">Flash<\/a>!<br \/>\nthis.param2 = var2;\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0 \/\/ Poitage classique sur un param\u00e8tre<br \/>\nalert(&#8216;Var1: &#8216;+var2);<br \/>\n},<\/p>\n<p>maMethode2 : function() {<br \/>\nvar var2 = this[&#8216;param1&#8217;].x;<br \/>\nalert(&#8216;Var2: &#8216;+var2);<br \/>\n},<\/p>\n<p>maMethode3 : function() {<br \/>\nvar var3 = this[&#8216;param3&#8217;];<br \/>\nalert(&#8216;Var3: &#8216;+var3);<br \/>\n}<\/p>\n<p>}<\/p>\n<p>\/\/ Pour instancier un objet &#8216;monObjet&#8217; et lui appliquer des m\u00e9thode<br \/>\nmonObjet.maMethode1(100,200);<br \/>\nmonObjet.maMethode2();<br \/>\nmonObjet.maMethode3();<\/p><\/blockquote>\n<p>Comme vous pouvez le constater, ce n&#8217;est pas tr\u00e8s compliquer, mais il y a beaucoup de mauvaise utilisation du <a href=\"http:\/\/blog.jflad.com\/tag\/Javascript%20\">Javascript <\/a>qui porte souvent \u00e0 confusion. Mais cet exemple illustre la v\u00e9ritable syntaxe orient\u00e9 objet du <a href=\"http:\/\/blog.jflad.com\/tag\/Javascript\">Javascript<\/a>, coupl\u00e9 avec <a href=\"http:\/\/blog.jflad.com\/tag\/Mootools\">Mootools<\/a>, vous allez vraiment avoir un grande libert\u00e9 d&#8217;action un fois ce principe maitris\u00e9 !<\/div>\n<\/blockquote>\n<p><a target=\"_blank\" href=\"http:\/\/blog.jflad.com\/post\/Programmation-Objet-en-Javascript\">source<\/a><\/p>\n","protected":false},"excerpt":{"rendered":"<p>Un tr\u00e8s bon exemple de programmation JS Objet (concis et rapide) sur le blog jflad : Ce tutoriel vous pr\u00e9sente la syntaxe de la programmation Objet en Javascript. Pour la petite histoire, le Javascript \u00e9tait le pr\u00e9curseur des langages orient\u00e9 &hellip; <a href=\"http:\/\/www.dotmana.com\/weblog\/2007\/11\/programmation-javascript-objet-par-lexemple\/\">Continue reading <span class=\"meta-nav\">&rarr;<\/span><\/a><\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[7],"tags":[],"class_list":["post-350","post","type-post","status-publish","format-standard","hentry","category-dev"],"_links":{"self":[{"href":"http:\/\/www.dotmana.com\/weblog\/wp-json\/wp\/v2\/posts\/350","targetHints":{"allow":["GET"]}}],"collection":[{"href":"http:\/\/www.dotmana.com\/weblog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"http:\/\/www.dotmana.com\/weblog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"http:\/\/www.dotmana.com\/weblog\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"http:\/\/www.dotmana.com\/weblog\/wp-json\/wp\/v2\/comments?post=350"}],"version-history":[{"count":0,"href":"http:\/\/www.dotmana.com\/weblog\/wp-json\/wp\/v2\/posts\/350\/revisions"}],"wp:attachment":[{"href":"http:\/\/www.dotmana.com\/weblog\/wp-json\/wp\/v2\/media?parent=350"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"http:\/\/www.dotmana.com\/weblog\/wp-json\/wp\/v2\/categories?post=350"},{"taxonomy":"post_tag","embeddable":true,"href":"http:\/\/www.dotmana.com\/weblog\/wp-json\/wp\/v2\/tags?post=350"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}