Mostrando entradas con la etiqueta programacion. Mostrar todas las entradas
Mostrando entradas con la etiqueta programacion. Mostrar todas las entradas

martes, 7 de diciembre de 2010

Objetos con JavaScript (POO) II

Ya se vió en el post anterior cómo crear un objeto y sus propiedades con javascript, esta vez crearemos un objeto con propiedades y métodos(en este ejemplo sólo declararemos un método).
Para asignar un método a un objeto, primero declaramos el método:


//Method
function GetNombreCompleto()
{
var nombreCompleto = this.Nombre + " " + this.Apellido;
return nombreCompleto;
}

Como vemos este método hace uso de la palabra clave 'this', esto lo hace para acceder a los valores de las propiedades del objeto al que estará conectado.
Ahora asignamos el método a nuestro objeto


//My Object:
function Persona(nombre,apellido,edad)
{
this.Nombre = nombre;
this.Apellido = apellido;
this.Edad = edad;
//Metodo:
this.GetNombreCompleto = GetNombreCompleto;
}

Para llamar al método lo hacemos de la siguiente manera:


persona.GetNombreCompleto()


A continuación el código completo:


<html>
<head>
<title>Test JavaScript Objects</title>
<script type="text/javascript">
//My Object:
function Persona(nombre,apellido,edad)
{
this.Nombre = nombre;
this.Apellido = apellido;
this.Edad = edad;
//Metodo:
this.GetNombreCompleto = GetNombreCompleto;
}

//Method
function GetNombreCompleto()
{
var nombreCompleto = this.Nombre + " " + this.Apellido;
return nombreCompleto;
}

function TestMyObject()
{
var persona;
persona = GetPersona();
var msg = "Nombre: " + persona.Nombre + "\n" + "Apellido: ";
msg += persona.Apellido + "\n" + "Edad: " + persona.Edad + "\nNombreCompleto: " + persona.GetNombreCompleto();
alert(msg);

}

function GetPersona()
{
var persona = new Persona("Pedro","Picapiedra",40);
return persona;
}

</script>
</head>
<body>
<div style="width:300px;height:50px;background:#aaccdd;" onclick="TestMyObject()">
Test Object (clic aquí)
</div>

</body>
</html>

Objetos con JavaScript (POO) I

Delaramos al objeto usando una función, dentro de ésta declaramos las propiedades.Las propiedades van precedidas de la palabra clave 'this' y seguidamente '.'(punto):


//My Object:
function Persona(nombre,apellido,edad)
{
this.Nombre = nombre;
this.Apellido = apellido;
this.Edad = edad;
}

Como vemos, el objeto Persona tendrá 3 propiedades: Nombre, Apellido y Edad.
Veamos cómo podemos acceder a las propiedades:


<html>
<head>
<title>Test JavaScript Objects</title>
<script type="text/javascript">
//My Object:
function Persona(nombre,apellido,edad)
{
this.Nombre = nombre;
this.Apellido = apellido;
this.Edad = edad;
}

function TestMyObject()
{
var persona;
persona = GetPersona();
var msg = "Nombre: " + persona.Nombre + "\n" + "Apellido: ";
msg += persona.Apellido + "\n" + "Edad: " + persona.Edad;
alert(msg);

}

function GetPersona()
{
var persona = new Persona("Pedro","Picapiedra",40);
return persona;
}
</script>
</head>
<body>
<div style="width:300px;height:50px;background:#aaccdd;" onclick="TestMyObject()">
Test Object (clic aquí)
</div>
</body>
</html>


Ahora veamos un ejemplo con un array de objetos Persona :


<html>
<head>
<title>Test JavaScript Objects</title>
<script type="text/javascript">
//My Object:
function Persona(nombre,apellido,edad)
{
this.Nombre = nombre;
this.Apellido = apellido;
this.Edad = edad;
}

function TestArrayObjects()
{
var myObjects = new Array();
myObjects = GetArrayPersonas();
var persona;
var msg = "";
for(var i=0;i<myObjects.length;i++)
{
persona = myObjects[i];
msg = "Nombre: " + persona.Nombre + "\n" + "Apellido: ";
msg += persona.Apellido + "\n" + "Edad: " + persona.Edad;
alert(msg);
}
}

function GetArrayPersonas()
{
var size = 4;
var myarray = new Array(size);
for(var i=0;i<size;i++)
{
var persona = new Persona(("Pedro "+i),("Picapiedra "+i),(40+i));
myarray[i] = persona;
}
return myarray;
}
</script>
</head>
<body>
<div style="width:300px;height:50px;background:#eeffaa;margin-top:30px;" onclick="TestArrayObjects()">
Test Array Objects (clic aquí)
</div>
</body>
</html>

martes, 17 de marzo de 2009

Expresiones Regulares - Validar número de telefono

¿Qué son expresiones regulares?,según la Wikipedia:
Una expresión regular, a menudo llamada también patrón, es una expresión que describe un conjunto de cadenas sin enumerar sus elementos.[...]Las expresiones regulares son un método por medio del cual se pueden realizar búsquedas dentro de cadenas de caracteres. Sin importar si la búsqueda requerida es de dos caracteres en una cadena de 10 o si es necesario encontrar todas las apariciones de un patrón definido de caracteres en un archivo de millones de caracteres, las expresiones regulares proporcionan una solución para el problema. Adicionalmente, un uso derivado de la búsqueda de patrones es la validación de un formato específico en una cadena de caracteres dada, como por ejemplo fechas, números de teléfono o identificadores.

A continuación los los caracteres comodín usados para crear las expresiones regulares:
SignificadoEjemploResultado
\ Marca de carácter especial/\$ftp/Busca la palabra $ftp
^ Comienzo de una línea/^-/Líneas que comienzan por -
$ Final de una línea/s$/Líneas que terminan por s
. Cualquier carácter (menos salto de línea)/\b.\b/Palabras de una sóla letra
| Indica opciones/(L|l|f|)ocal/Busca Local, local, focal
( ) Agrupar caracteres/(vocal)/Busca vocal
[ ] Conjunto de caracteres opcionales/escrib[aoe]/Vale escriba, escribo, escribe


La tabla que sigue describe los modificadores que pueden usarse con los caracteres que forman el patrón.Cada modificador actúa sobre el carácter o el paréntesis inmediatamente anterior.
SímboloDescripciónEjemploResultado
*Repetir 0 o más veces/l*234/Valen 234, 1234, 11234...
+Repetir 1 o más veces/a+mar/Valen amar, aamar, aaamar...
?Repetir 1 o 0 veces/a?mar/Valen amar, mar.
{n}Exactamente n veces/p{2}sadoVale ppasado
{m,n}Entre m y n veces/car{1,3}o/Vale caro, carro, carrro

Para validar un numero de telefono:


function ValidaTelef(string_numero)
{
/*creo la expresion regular y se la asigno a una variable
aceptará numeros como: 83294325,88173764,8... */

var filter = /^[8]{1}[1-9]{2}[0-9]{5}$/;

/*llamo a la funcion test pasandole la cadena numero
Devuelve true si el numero coincide y false en caso contrario*/

return filter.test(string_numero);
}