<!-- Load jQuery -->
<script src="../jquery-1.9.1.min.js" type="text/javascript" ></script>
<!-- Load the library -->
+ <script src="../libs/raphael-min.js" type="text/javascript" ></script>
+
<script src="../simpleWebSlides.js" type="text/javascript" ></script>
<link rel="stylesheet" href="../simpleWebSlides.css" type="text/css" media="all" />
</script>
</head>
<body>
- <a href="prog_internet_05.xhtml" class="sws-previous"/>
+ <a href="unix_prog_web_05.xhtml" class="sws-previous"/>
<div class="sws-slide sws-cover sws-option-nofooter">
- <h1>Programmation Internet</h1>
+ <h1>Unix et Programmation Web</h1>
<h1>Cours 6</h1>
<a href="mailto:kn@lri.fr">kn@lri.fr</a><br/>
<a href="http://www.lri.fr/~kn/">http://www.lri.fr/~kn</a>
<li> <em>Intégration avec HTML</em> : PHP supporte
des <em><i>templates</i></em> (modèles/patrons) HTML contenant
du PHP</li>
+ <li> <em>Expose des Web simplement</em> (ports, URL, requêtes
+ HTTP, …)</li>
</ul>
<p>Exemple: fichier <tt>heure.php</tt> : </p><code><![CDATA[ <html>
<head><title>Heure</title></head>
<li>autre chose</li>
</ul>
</div>
+ <div class="sws-slide">
+ <h1>Un mot sur les langages de programmation (subjectif)</h1>
+ <ol>
+ <li> Il n'y a pas d'excellent langage de programmation. Par
+ contre il y a d'excellents programmeurs</li>
+ <li> Connaître plusieurs langages aide à devenir un bon
+ programmeur (en particulier plusieurs paradigmes différents :
+ impératifs, objet, fonctionnel, logique, déclaratif, …).
+ </li>
+ <li> On ne peut pas vraiment se faire plaisir en informatique
+ en étant un mauvais programmeur</li>
+ <li>Il y a de très mauvais langages, le plus mauvais étant
+ PHP</li>
+ </ol>
+ </div>
+
+
<h1>Types de base et expressions simples</h1>
<div class="sws-slide">
<h1>Entiers (<tt>integer</tt>)</h1>
</html>
]]></code>
</div>
+
+
+ <h1>Définitions de fonctions</h1>
+
+ <div class="sws-slide">
+ <h1>Fonctions</h1>
+ <p>Les fonctions sont déclarées à l'aide du
+ mot-clé <tt><em>function</em></tt>. On renvoie des résultats à
+ l'aide du mot-clé <tt><em>return</em></tt>.</p>
+ <code><![CDATA[
+ <?php
+ ]]><em>function</em> double ($x)
+ <em>{</em>
+ <em>return</em> $x + $x;
+ <em>}</em>
+
+ echo double(10);
+ <![CDATA[?>]]>
+ </code>
+ </div>
+
+
+ <div class="sws-slide">
+ <h1>Portée des variables locales et globales
+ <b style="color:red">⚠</b>
+ </h1>
+ <div id="cont2" style="width:100%;position:relative;"
+ onresize="draw_arrows();" >
+ <div id="left2" style="display:inline-block;width:50%; position:relative;
+ box-sizing:border-box;
+ padding: 0 1em 0 2em;
+ border-style:dashed;
+ border-width: 0 1pt 0 0;
+ border-color:gray; float:left;">
+<code> <?php
+ <em style="color:red">$a</em> = 42;
+ function add_a($x)
+ {
+ <span id="leftend" />
+ return $x + <em style="color:red">$a</em>;<span id="leftstart" />
+ }
+ echo add_a(10);
+ ?>
+</code>
+ </div>
+ <div id="right2" style="display:inline-block;
+ width:50%; position:relative;
+ box-sizing:border-box;
+ padding: 0 2em 0 1em;
+ vertical-align:text-top;
+ ">
+<code > <?php
+ <em>$a</em> = 42;<span id="rightend"/>
+ function add_a($x)
+ {
+ <em>global $a</em>;<span id="rightmid"/>
+ return $x + <em>$a</em>;<span id="rightstart"/>
+ }
+ echo add_a(10);
+ ?>
+</code>
+ </div>
+ </div>
+
+ <script type="text/javascript">
+
+ function overlay(id) {
+ var w = $("#" + id)[0].offsetWidth;
+ var h = $("#" + id)[0].offsetHeight;
+ $("#svg_"+id).remove();
+ var paper = Raphael(id, w, h);
+ paper.canvas.id = "svg_" + id;
+ return paper;
+ };
+
+ function curve_to(paper, start, end, style) {
+ var x1 = $(start)[0].offsetLeft;
+ var y1 = $(start)[0].offsetTop;
+ var x2 = $(end)[0].offsetLeft;
+ var y2 = $(end)[0].offsetTop;
+
+ var path_cmd =
+ "M" + x1 + " " + y1 + " S" + x1 + " " + y2 + " " + x2 + " " + y2;
+ var p1 = paper.path(path_cmd);
+ p1.attr(style);
+
+ };
+
+ function draw_arrows(x) {
+
+ var paper = overlay("left2");
+ $("#svg_left2").css ( { 'z-index': '2', 'top':'0', 'left':'0', 'position':'absolute' } );
+
+ curve_to (paper, "#leftstart", "#leftend", { 'stroke': "red",
+ 'stroke-dasharray' : "-",
+ 'stroke-width': 2,
+ 'arrow-end' : "block-wide-long" });
+
+ var paper = overlay("right2");
+ $("#svg_right2").css({ 'z-index': '2', 'top':'0', 'right':'0', 'position':'absolute' });
+
+ curve_to (paper, "#rightstart", "#rightmid", { 'stroke': "green",
+ 'stroke-width': 2,
+ 'arrow-end' : "block-wide-long" });
+ curve_to (paper, "#rightmid", "#rightend", { 'stroke': "green",
+ 'stroke-width': 2,
+ 'arrow-end' : "block-wide-long" });
+ };
+ SWS.Presentation.registerCallback(0, draw_arrows);
+ </script>
+ <p>Le code de gauche <em style="color:red">affiche 10</em> !
+ Les variables ont une portée <em style="color:red">locale</em>
+ par défaut. Si <tt>$a</tt> n'est pas définie dans le corps de la
+ fonction, sa valeur est <tt style="color:red">NULL</tt>
+ (variable non définie). <span >Pour référencer
+ des variables globales, on utilise le mot clé <tt><em>global</em></tt>.</span>
+ </p>
+ </div>
+ <div class="sws-slide">
+ <h1>Fonction : définition <b style="color:red">⚠</b></h1>
+ <p>On peut utiliser une fonction <s>« avant »</s> de la définir :</p>
+ <code> <?php
+ echo next(10);
+ echo <br/>;
+
+ function next($x)
+ {
+ return $x + 1;
+ }
+ ?></code>
+ <p>On définira <em>toujours</em> des fonctions <em>avant</em> de
+ les utiliser. On ne peut pas définir deux fonctions avec le même
+ nom.
+ </p>
+ </div>
+ <div class="sws-slide">
+ <h1>Fonctions : passage par référence</h1>
+ <div style="position:relative;margin-top:20pt;">
+ <div style="margin-left:20pt;display:inline-block;vertical-align:top;float:left;">
+ <code><?php
+ function add_a($tab)
+ {
+ $tab["a"] = 42;
+ }
+
+ $mytab = array();
+ add_a($mytab);
+ echo $mytab["a"];
+ //<s>n'affiche rien (car NULL ⇝ "")</s>
+?></code>
+ </div>
+ <div style="margin-left:20pt;display:inline-block;vertical-align:top;">
+ <code><?php
+ function add_a(<em>&</em>$tab)
+ {
+ $tab["a"] = 42;
+ }
+
+ $mytab = array();
+ add_a($mytab);
+ echo $mytab["a"];
+ //<em>affiche 42</em>
+?></code>
+ </div>
+
+ </div>
+ <br/>
+ <p style="position:relative">On utiliser le modificateur <tt><em>&</em></tt> devant
+ un paramètre de fonction pour indiquer que ce dernier est passé
+ par référence.</p>
+
+ <p style="position:relative">Lorsque l'on veut <em>modifier</em> un argument de la
+ fonction (plutot que de renvoyer une version modifiée, par
+ ex. mise à jour d'un tableau, d'une chaîne, …), on doit le
+ passer par référence.
+ </p>
+ </div>
</body>
</html>