Lo básico de Javascript - Universidad de los Andes
Anuncio
Lo básico de Javascript
ISIS2603
Departamento de Sistemas y Computación
Universidad de los Andes
Javascript
Permite extender las capacidades de HTML
Se utiliza principalmente del lado del cliente para
mejoras en la interfaz de usuario y para
crear páginas web dinámicas
También hay una forma de JavaScript del lado del
servidor (Server-side JavaScript o SSJS).
Su uso en aplicaciones externas a la web, por
ejemplo en documentos PDF, aplicaciones de
escritorio (mayoritariamente widgets) es también
significativo.
Javascript (cont.)
Se puede utilizar dentro de cualquier lenguaje que
traduzca a HTML como PHP, ASP, SVG, etc.
Es un lenguaje interpretado que se embebe en una
página Web:
las instrucciones las analiza y procesa el navegador en el
momento que deben ser ejecutadas.
Adopta nombres y convenciones del lenguaje de
programación Java.
Sin embargo Java y JavaScript no están relacionados
y tienen semánticas y propósitos diferentes.
Ejemplo simple
<!DOCTYPE html>
<html>
<head> <meta charset="utf-8">
<title>Ejemplo sencillo</title>
<h1 id="header">Esto es JavaScript</h1>
<script>
alert(“Bienvenido a los ejemplos de javascript”);
</script>
</head>
<body>/*...*/</body>
</html>
Javascript (cont.)
Se define como:
imperativo y estructurado,
orientado a objetos,
basado en prototipos, ,
débilmente tipado y dinámico.
Imperativo y estructurado
Variables cuyo alcance es el de la función donde se
definieron
var x; // define la variable x
var y = 2; // define la variable y y le asigna el valor 2
Estructuras de control:
if, bucles for, sentencias switch, etc.
if (a < b) {
t = b;
b = a;
}
while (b !== 0) {
b = a % b;
a = t;
}
Tipado dinámico
El tipo está asociado al valor, no a la variable.
var x = 15; // Number (int) declaration
var y = 15.6 // Number (float) declaration
var z = 'Hello World' // String declaration
var arr = []; // Array literal declaration
var obj = {}; // Object literal declaration
console.log( typeof( x ) ); // number
console.log( typeof( z ) ); // string
console.log( typeof( arr ) ); // object
console.log( typeof( obj ) ); // object
Orientado Objetos
Los objetos son arrays asociativos
obj.x = 10 y obj['x'] = 10 son equivalentes
Las propiedades y sus valores pueden ser creados,
cambiados o eliminados en tiempo de ejecución.
var triangulo = new Object(); // el objeto triangulo es un objeto vacío
triangulo.ladoA = 3;
// triangulo tiene una nueva propiedad ladoA cuyo
// valor es 3
triangulo.ladoB = 4;
triangulo.ladoC = 5;
Orientado Objetos
Agrega el método getArea al objeto triangulo
triangulo.getArea = function () {
// Devuelve el área de un triángulo
var semiperimetro = (this.ladoA + this.ladoB + this.ladoC) / 2;
var valor = semiperimetro * (semiperimetro - this.ladoA) * (semiperimetro this.ladoB) * (semiperimetro - this.ladoC);
return Math.sqrt( valor ); }; // El punto y coma aquí es obligatorio.
Prototipos
JavaScript usa prototipos en vez de clases para el
uso de herencia.
Un prototipo es un objeto que se copia para crear
otros objetos
Se realiza a través de Funciones como constructores
de objetos
Las funciones también se comportan como
constructores.
Prototipos (cont.)
Prefijar una llamada a la función con la palabra
clave new
Crear una nueva instancia de un prototipo, que
heredan propiedades y métodos del constructor
// Una simple función
function Saludator() {
alert("Saludos factory!!") }
// Y una simple llamada Saludator()
// Un nuevo objeto a partir de su "clase“
prototipo
var saludo = new Saludator()
Prototipos (cont.)
var Saludator = function (nom) {
this.nombre = nom
this.saluda = function() {
alert("hola "+plural(this.nombre))
}
function plural(n) {
return n + "s"
}
}
var obj1 = new Saludator("mundo")
obj1.saluda()
obj1.plural() // fallaría porque plural() es privado
Funciones como métodos
A diferencia de muchos lenguajes orientados a
objetos, no hay distinción entre la definición de
función y la definición de método.
La distinción se produce durante la llamada a la
función; una función puede ser llamada como un
método.
Cuando una función es llamada como un método de
un objeto, la palabra clave this, que es una
variable local a la función, representa al objeto
que invocó dicha función.
Funciones de primera clase
A las funciones se les suele llamar ciudadanos de
primera clase; son objetos en sí mismos.
Una función javascript propiedades y métodos,
como .call() y .bind().
Una función anidada es una función definida dentro
de otra. Esta es creada cada vez que la función
externa es invocada.
Parámetros en las funciones
Un número indefinido de parámetros pueden ser
pasados a la función.
La función puede acceder a ellos a través de los
parámetros o también a través del objeto local
arguments.
