PHP alapok 5: while, do while

while:

Ha olyan kód akarunk megírni, ami folyamatosan ismétlődik de még nem tudjuk, hogy hányszor akkor használjuk a while ciklust.

A ciklusoknál arra kell figyelni, hogy mindig legyen egy állítás ami hamis és leállítja a ciklust, mert ha nem akkor belefutunk egy végtelen ciklusba.

<?php
	$loopCond = true;
	while ($loopCond == true){
		//Echo your message that the loop is running below
		echo "<p>The loop is running.</p>";
		$loopCond = false;
	}
	echo "<p>And now it's done.</p>";
    ?>

do while:

<?php
$i = 0;
do {
    echo $i;
} while ($i > 0);
?>

A kód addig fut amíg az állítás hamis utána kilép.

<?php
		$loopCond = false;
		do {
			echo "<p>The loop ran even though the loop condition is false.</p>";
		} while($loopCond);
		echo "<p>Now the loop is done running.</p>";
		
    ?>

PHP alapok 4: for loop, foreach loop

A for loop-ot akkor használjuk, hogy ha ugyanazt a kódot akarjuk lefuttatni újra és újra főleg ha tudjuk, hogy ez hányszor történjen meg.

pl echo-val kiírathatjuk minden 4-ik évszámot egészen 2050-ig.

<?php
    for ($year = 2016; $year < 2050; $year = $year + 4){
        echo "<p>$year</p>";
    }
?>

vagy írassuk ki vele a számokat 1-9-ig

<?php
for ($i = 1; $i < 10; $i++) {
    echo $i;
}
// echoes 0123456789
?>

loop+array= foreach:

Foreach loopal írathatjuk ki egy tömb összes elemét.

<?php
  $numbers = array(1, 2, 3);

  foreach($numbers as $item) {
      echo $item;
  }
?>

Először hozzunk létre egy tömböt. Ezután használjuk a foreach loopot a zárójelbe ( $numbers as $item) szintaxis azt mondja a PHP-nek, hogy : “Minden egyes elemét a $numbers tömbből hozzárendeljük egy átmeneti változóhoz az $item.” Végül a kódot amit futtatni szeretnénk rakjuk kapcsos zárójelek közé.

 

PHP alapok 3 : tömbök(arrays)

A tömb az elemek listája, lehetővé teszi, hogy több elemet tároljunk egyetlen változóban.

Elképzelhetjük úgyis mint egy bevásárló listát. Mikor írnánk egy bevásárló listát, minden egyes tételt külön papírra írnánk és minden egyes tételt meg kellene vásárolni (változók) Ez egy elég felesleges és buta dolog lenne. Ehelyett egyetlen egy papírlapra írjuk fel az összes tételt amit megakarunk venni. Ez a papírlap a tömb.

 <?php
      $array = array("Egg", "Tomato", "Beans");
      echo $array[0];
      //outputs "Egg"
    ?>

Ha kiakarjuk íratni a tömb egyes elemeit akkor szokás szerint 0-tól kell elkezdeni a számolást.

A PHP egy nagyon rugalmas nyelv. Használhatunk kétféle szintaxist

az egyik a []

a másik {}

Mindkét forma teljesen egyenértékű, csak rajunk áll hogy melyiket használjuk.

Módosíthatunk egy elemet:

 <?php
      $array = array("Egg", "Tomato", "Beans");
      $array[2] = "Bread";
      echo $array[2];  //outputs Bread
    ?>

Eltávolíthatunk elemet:

 <?php
      $array = array("Egg", "Tomato", "Beans");
      unset($array[2]);
    ?>

vagy törölhetjük az egész tömböt:

 <?php
      $array = array("Egg", "Tomato", "Beans");
      unset($array);
    ?>

 

PHP alapok 2 : if, else if, else és switch

if, else if, else:

<?php
   $items = 7;
  
   if($items > 5){
       echo "items nagyobb mint 5";
   } else if ( $items = 5){
       echo "items egyenlő 5";
   } else {
       echo "items kisebb mint 5";
   }
 ?>

Switch:

A switch utasítás jól jön akkor, hogy ha több állításunk van.

<?php
$num = 2;
   switch ($num){
        case 0:
            echo "Az érték 0";
            break;
        case 1: 
            echo "Az érték 1";
            break;
        case 2:
            echo "Az érték 2";
            break;
        default: 
            echo "Az érték nem 0,1 vagy 2";
    }
 ?>

Néha szeretnénk, hogy ha több kifejezésnek ugyanaz legyen az eredménye:

<?php
$i = 5;
    
    switch ($i) {
        case 0:
            echo '$i is 0.';
            break;
        case 1:
        case 2:
        case 3:
        case 4:
        case 5:
            echo '$i is somewhere between 1 and 5.';
            break;
        case 6:
        case 7:
            echo '$i is either 6 or 7.';
            break;
        default:
            echo "I don't know how much \$i is.";
    }
 ?>

PHP alapok 1 : változók, kommentek és echo

A PHP kód egyenesen írható a HTML kódba is mint pl:

<body>
  <p>
     <?php
       echo "I'm learning PHP!";
     ?>
  </p>
</body>

A PHP kód mindig a” <?php”  és a “?>” jelek közé megy és a sor végére pontosvessző kerül.

A fájlunkat most már nem index.html néven hanme index.php néven mentjük el. Ezzel azt üzenjük, hogy a fájlunkban már van PHP kód is.

echo-val vagy print-tel írathatjuk ki a szöveget(string).

Hasonlóan a JavaScripthez itt is összefűzhetünk több szöveget, csak itt a pontokkal.(JavaScriptben + tehettük meg).

<?php
    echo "Hello," . " " . "world!";
</p>

Matematikai műveleteket is végezhetünk:

<?php
    echo 5*7;  
</p>

Váltózókban tárolhatjuk el őket:

<?php
    $myName = "Ani";  
    $myAge = 28;
</p>
  • a változók nevét dollár jellel kezdjük $
  • a változónak adjunk értéket, ha szöveg akkor idézőjelek közé kell tenni, ha szám akkor nem kell.

Kommenteket adhatunk hozzá

<?php
    $myName = "Ani";  
    $myAge = 28;
  // I'm a comment
// echoval tudjuk kiíratni
echo $myName;
echo $myAge;
</p>

Mi is az a PHP?

A PHP (PHP: Hypertext Preprocessor (eredetileg “Personal Home Page”)” általános szerveroldali szkriptnyelv dinamikus weblapok készítésére. A HTML oldalakkal ellentétben a kiszolgáló a PHP-kódot nem küldi el az ügyfélnek, hanem a kiszolgáló oldalán a PHP-értelmező motor dolgozza fel azt. A programokban lévő HTML elemek érintetlenül maradnak, de a PHP kódok lefutnak.

A PHP működése:

A PHP oldalak elkészítésénél a HTML-t gyakorlatilag csak mint formázást használják. Amikor egy PHP-ben megírt oldalt akarunk elérni, a kiszolgáló először feldolgozza a PHP utasításokat, és csak a kész (HTML) kimenetet küldi el a böngészőnek. A kliens oldalról nem látható a programkód. A feldolgozáshoz egy interpretert (értelmezőt) használ, amely általában a webszerver egy külső modulja.

Rengeteg feladat végezhető el vele, ilyenek a bejelentkezés, az adatbázis kezelés, fájlkezelés, kódolás, adategyeztetés, kapcsolatok létrehozása, e-mail küldése, adatfeldolgozás, dinamikus listakészítés stb.

JavaScript OOP felé vezető út….

Objektum

Objektum. Ez az adat típus egy kicsit komplexebb mint a többi.

Miből áll egy objektum?  var name = {};

Mikor csinálunk egy objektumot akkor mindegyiknek tulajdonságnak(property) van értéke (value).

Például :Object literal notation:

var dave = {
	name: „Dave”
	age: 22
};

ahol age a tulajdonság és 22 az érték. Ha több tulajdonságot akarunk megadni akkor vesszővel kell elválasztani őket egymástól.

Utána elmentjük őket egy globális változóban. Ezt két féleképpen tehetjük meg.

  • ponttal:
var name = dave.name;
var age = dave.age;

  • és zárójelekkel:
var name = dave[„name”];
var age = dave[„age”];

Constructor notation:

var dave = new Object();
  dave.name = „Dave”;
  dave.age = 22;

Metódusok

A metódus nagyon fontos része az objektum orientált programozásnak(OOP). A metódus hasonló a funkcióhoz.

Folytassuk az előző példát:

dave.setAge = function(newAge){
	dave.age = newAge;
};

Most állítsuk be Dave életkorát 40-re

dave.setAge(40);

A funkciókat csak paraméterek bevitelére lehet használni, de a metódusok az objektumok tulajdonságaival számolni is tudnak. Például Dave korából kitudja számolni hogy melyik évben született.

var dave = new Object();
dave.age = 22;
dave.setAge = function (newAge){
  dave.age = newAge;
};

dave.yearOfBirth = function () {
  return 2014 - dave.age;
};
console.log(dave.yearOfBirth());

Ez a metódus nagyon jól működik, hogyha Dave esetében, de ha már több ember van akkor nem jó. Ilyenkor használjuk a this kulcsszót.

// here we define our method using "this", before we even introduce dave
var setAge = function (newAge) {
  this.age = newAge;
};
// now we make dave
var dave = new Object();
dave.age = 30;
dave.setAge = setAge;
dave.setAge(35);

Nagyon unalmas egy objektumot több tulajdonsággal feltölteni. Rengeteget kellene gépelni. Pl constructor notation. Ilyenkor nagyon jól tudjuk használni a this kulcsszót.

function Person(name,age) {
  this.name = name;
  this.age = age;
}
//Írjuk meg Dave adatait és adjuk hozzá Kate adatait is
var dave = new Person("Dave", 30);
var kate = new Person("Kate", 25);
// és így tovább, feltölthetjük még adatokkal

Ha van olyan tulajdonság ami minden esetbe ugyanaz akkor azt nem kell minden egyes esetben begépelni, hanem megoldhatjuk a következőképpen:

function Person(name,age) {
  this.name = name;
  this.age = age;
  this.species = "Homo Sapiens";
}
var dave = new Person("Dave", 30);
var kate = new Person("Kate", 25);
console.log("Dave's species is " + dave.species + " and he is " + dave.age );
console.log("Kate's species is " + kate.species + " and she is " + kate.age);

Az objektum is csak egy ugyanolyan típus mint a szöveg, a szám csak sokkal komplexebb. Ugyanúgy minta számoknál és a szövegnél, az objektumoknál is tudunk tömböket csinálni.

// A szokásos person constructor
function Person (name, age) {
    this.name = name;
    this.age = age;
}

// Most csináljunk az embereknek egy tömböt.
var family = new Array();
family[0] = new Person("alice", 40);
family[1] = new Person("dave", 20);
family[2] = new Person("kate", 8);
family[3] = new Person("timmy",6);

Ciklusokkal ugyanúgy kiírhatjuk a nevüket mint máskor:

for ( i=0; i< family.length; i++){
    console.log(family[i]);
    };

Írhatunk funkciókat is:

// person constructor
function Person (name, age) {
    this.name = name;
    this.age = age;
}

//Írjunk egy funkciót ami kiírja két ember korának a különbségét
var ageDifference = function(person1, person2) {
    return person1.age - person2.age;
};

// és egy másik funkció ami megmondja 2 ember közül ki az idősebb.

var olderAge = function(person1, person2){
    if(person1.age > person2.age){
        return person1.age;
    }else{
            return person2.age;
        };
};


// Vigyük be az emberek adatait
var dave = new Person("Dave", 30);
var kate= new Person("Kate", 28);

console.log("The older person is " + olderAge(dave, kate));

jQuery super mario

CodePen

HTML:

<!DOCTYPE html>
<html>
    <head>
    	<title>Super Mario!</title>
        <link rel='stylesheet' type='text/css' href='stylesheet.css'/>
		<script type='text/javascript' src='script.js'></script>
	</head>
	<body>
        <img src="http://i1061.photobucket.com/albums/t480/ericqweinstein/mario.jpg"/>
	</body>
</html>

CSS:

img {
    position: relative;
    left: 0;
    top: 0;
}

jQuery

$(document).ready(function() {
    $(document).keydown(function(key) {
        switch(parseInt(key.which,10)) {
			// Left arrow key pressed
			case 37:
				$('img').animate({left:"-=10px"}, 'fast');
				break;
			// Up Arrow Pressed
			case 38:
				$('img').animate({top:"-=10px"}, "fast");
				break;
			// Right Arrow Pressed
			case 39:
				$('img').animate({left:"+=10px"}, "fast");
				break;
			// Down Arrow Pressed
			case 40:
				$('img').animate({top:"+=10px"}, "fast");
				break;
		}
	});
});

jQuery focus

CodePen

HTML:

<!DOCTYPE html>
<html>
    <head>
		<title>Time to Focus!</title>
		<link rel='stylesheet' type='text/css' href='stylesheet.css'/>
		<script type='text/javascript' src='script.js'></script>
	</head>
	<body>
		<form>
			Name: <input type='text' name='name'></input>
		</form>
	</body>
</html>

CSS:

input {
    font-family: Verdana, Arial, Sans-Serif;
}

jQuery:

$(document).ready(function(){
    $('input').focus(function(){
        $('input').css('outline-color', '#FF0000');    
    });
});