clase programación 10

ProgramaciónClase 10. Javascript Modular

Prof. Gonzalo Müllergmullerb@mail.com

Facultad de IngenieríaUniversidad Central de Venezuela

ProgramaciónClase 10. Javascript Modular

Clase Anterior

� Programación estructurada.

� Programación modular.

� Algoritmo: Bloque principal, llamadas, 20 líneas.

� Módulos.

� Clases.

Programación – Prof. Gonzalo Müller – Clase 10 – GM - 2

� Clases.

� Tipos: Subrutinas y Funciones.

� Representación de Algoritmos Modulares

� Definición: subrutinas, funciones.

� Llamada: subrutinas, funciones.

Clase Anterior

� Metodología de la Programación Modular

� Diseño Modular: Diagrama Top-Down.

� DRE, DF, PC y CF.

� Tabla de Módulos.

� Características: Acoplamiento y Cohesión.

Programación – Prof. Gonzalo Müller – Clase 10 – GM - 3

� Características: Acoplamiento y Cohesión.

� Acoplamiento de datos básico.

� Solo bloques terminales del DTD.

� Subrutinas: No generan resultado.

� Funciones: Generan 1 resultado.

� Beneficios: reutilización, cambios, errores y tiempo.

Programación Modular

El uso de módulos consta de tres pasos:

1. Declaración.

Programación – Prof. Gonzalo Müller – Clase 10 – GM - 4

2. Definición.

3. Llamada.

Programación Modular

1. Declaración: hace público el modulo para su uso en programa.

Programación – Prof. Gonzalo Müller – Clase 10 – GM - 5

Programación Modular

1. Declaración: hace público el modulo para su uso en programa.

2. Definición: le da la forma al módulo, es la que le da vida en el programa.

Programación – Prof. Gonzalo Müller – Clase 10 – GM - 6

vida en el programa.

Programación Modular

1. Declaración: hace público el modulo para su uso en programa.

2. Definición: le da la forma al módulo, es la que le da vida en el programa.

Programación – Prof. Gonzalo Müller – Clase 10 – GM - 7

vida en el programa.

3. Llamada: cuando se le da uso al modulo en el programa.

Programación Modular

1. Declaración: hace público el modulo para su uso en programa. Sin la declaración,

el modulo no podría ser utilizado por el programa

2. Definición: le da la forma al módulo, es la que le da vida en el programa.

Programación – Prof. Gonzalo Müller – Clase 10 – GM - 8

vida en el programa.

Sin la definición, el modulo no funcionaría

3. Llamada: cuando se le da uso al modulo en el programa.

Sin llamadas, el modulo no tiene razón de existir

Declaración

Presenta al programa el encabezado del módulo,Nombre y Parámetros que recibe, lo que se conocecomo prototipo.

Nombre(parámetro1, parámetro2, …)

Programación – Prof. Gonzalo Müller – Clase 10 – GM - 9

Nombre(parámetro1, parámetro2, …)

� Dando a conocer el módulo para poder hacer usode este a lo largo de todo el programa.

� A igual que las variables, los módulos deben serdeclarados antes de ser utilizados.

Definición

Constituye la Codificación del Algoritmo del módulo,es decir, el conjunto de sentencias necesarias para queéste realice la tarea a la que está destinado.

Nombre(parámetro1, parámetro2, …)

…

Programación – Prof. Gonzalo Müller – Clase 10 – GM - 10

� Al igual que el programa principal un módulo:

� Puede declarar sus propias variables.

� Puede realizar llamadas a otros módulos.

…

Fin

Declaración y Definición en Javascript

En Javascript la Declaración y la Definición se realizan juntas en un sola operación

Programación – Prof. Gonzalo Müller – Clase 10 – GM - 11

Declaración y Definición en Javascript

En Javascript la Declaración y la Definición se realizan juntas en un sola operación utilizando la palabra clave function:

function nombre(parametro1, parametro2,…)

Programación – Prof. Gonzalo Müller – Clase 10 – GM - 12

function nombre(parametro1, parametro2,…)

{

…

}

Declaración y Definición en Javascript

En Javascript la Declaración y la Definición se realizan juntas en un sola operación utilizando la palabra clave function:

function nombre(parametro1, parametro2,…)

Declaración

Programación – Prof. Gonzalo Müller – Clase 10 – GM - 13

function nombre(parametro1, parametro2,…)

{

…

}

Declaración y Definición en Javascript

En Javascript la Declaración y la Definición se realizan juntas en un sola operación utilizando la palabra clave function:

function nombre(parametro1, parametro2,…)

Programación – Prof. Gonzalo Müller – Clase 10 – GM - 14

function nombre(parametro1, parametro2,…)

{

…

}

Definición

Declaración y Definición en Javascript

<html>

<head>

<title>Título</title>

<script>

DECLARACIÓN Y DEFINICIÓN DE MÓDULOS

</script>

Módulos debenser declaradosantes de serutilizados

Programación – Prof. Gonzalo Müller – Clase 10 – GM - 15

</head>

<body>

Contenido Original

</body>

<script>

Programa Principal

</script>

</html>

utilizados

Declaración y Definición en Javascript

� El nombre del módulo constituye un identificador porlo que debe cumplir con las reglas de identificadores.

function nombre(parametro1, parametro2,…)

Identificador de la función

Programación – Prof. Gonzalo Müller – Clase 10 – GM - 16

function nombre(parametro1, parametro2,…)

{

…

}

Declaración y Definición en Javascript

Reglas para definir un Identificador:

1. Se forma con un secuencia de los siguientescaracteres:

� a b c d e f g h i j k l m n o p q r s t u v w x y z

A B C D E F G H I J K L M N O P Q R S T

Programación – Prof. Gonzalo Müller – Clase 10 – GM - 17

�A B C D E F G H I J K L M N O P Q R S TU V W X Y Z

� 0 1 2 3 4 5 6 7 8 9

� _

Declaración y Definición en Javascript

2. No puede contener espacios en blanco, ni ningúnotro carácter diferente de los indicados enanteriormente.

3. El primer carácter no puede ser un dígito.

4. Hay distinción entre las letras mayúsculas y

Programación – Prof. Gonzalo Müller – Clase 10 – GM - 18

4. Hay distinción entre las letras mayúsculas yminúsculas.

Recomendación: utilizar nombres quetengan un significado para el dato ómódulo que representan.

Declaración y Definición en Javascript

Ejemplo:

function mayor2(dato1, dato2)

…

function Mayor2(dato1, dato2)

…

Correctos

Programación – Prof. Gonzalo Müller – Clase 10 – GM - 19

…

function Mayor_2(dato1, dato2)

…

function Mayor 2(dato1, dato2)

…

function 2Mayor(dato1, dato2)

Incorrectos

Declaración y Definición en Javascript

Ejemplo:

function mayor2(dato1, dato2)

…

function Mayor2(dato1, dato2)

…

Diferentes

Programación – Prof. Gonzalo Müller – Clase 10 – GM - 20

…

function Mayor_2(dato1, dato2)

…

function Mayor 2(dato1, dato2)

…

function 2Mayor(dato1, dato2)

Declaración y Definición en Javascript

� Declaración y Definición de una Subrutina:

function nombre(parametro1, parametro2, …)

{// Declaraciones locales

//

Programación – Prof. Gonzalo Müller – Clase 10 – GM - 21

//

…// Algoritmo

//

…}

Declaración y Definición en Javascript

� Declaración y Definición de una Subrutina:

function nombre(parametro1, parametro2, …)

{// Declaraciones locales

//

Programación – Prof. Gonzalo Müller – Clase 10 – GM - 22

//

…// Algoritmo

//

…}

Los parámetros no se declaran como las variables,es decir, NO se debe colocar:var parametro1, parametro2 …;

Declaración y Definición en Javascript

Ejemplo: Declarar y Definir una subrutina para escribir en la salida un resultado:

function escribeResultado(resultado)

{

document.write(“Raiz:”, resultado);

}

Programación – Prof. Gonzalo Müller – Clase 10 – GM - 23

}

Declaración y Definición en Javascript

Ejemplo: Declarar y Definir una subrutina para escribir en la salida un resultado:

function escribeResultado(resultado)

{

document.write(“Raiz:”, resultado);

}

Programación – Prof. Gonzalo Müller – Clase 10 – GM - 24

}

Ejemplo: Declarar y Definir subrutina para escribir en la salida el encabezado del programa:

function escribeEncabezado()

{

document.write(“COLARA 1.0<br/>2080<br/>”);}

Sin Parámetro

Declaración y Definición en Javascript

Ejemplo: Construir una pagina web con Javascript conacoplamiento de datos básicos para para leer y sumardos números.

Programación – Prof. Gonzalo Müller – Clase 10 – GM - 25

Declaración y Definición en Javascript

� Declaración y Definición de una Función:

� se utiliza la palabra clave return para el retornofunction nombre(parametro1, parametro2, …)

{// Declaraciones locales

//

Programación – Prof. Gonzalo Müller – Clase 10 – GM - 26

//

…// Algoritmo

//

…//

return valor;}

Declaración y Definición en Javascript

� Declaración y Definición de una Función:

function nombre(parametro1, parametro2, …)

{// Declaraciones locales

//

Programación – Prof. Gonzalo Müller – Clase 10 – GM - 27

Retorno

//

…// Algoritmo

//

…//

return valor;}

Declaración y Definición en Javascript

� Variable retorno: Usualmente se define una variable local que contiene el valor a retornar.function nombre(parametro1, parametro2, …)

{// Declaraciones locales

//

var

Programación – Prof. Gonzalo Müller – Clase 10 – GM - 28

Retorno

Variable retornovar resultado;

…// Algoritmo

//

…//

return resultado;}

Declaración y Definición en Javascript

Ejemplo: Declarar y Definir una función que calcule lasuma de dos números y utilizar en el ejemplo anterior.

Programación – Prof. Gonzalo Müller – Clase 10 – GM - 29

Declaración y Definición en Javascript

Ejemplo: Declarar y Definir una función que calcule el cubo de un número.

Programación – Prof. Gonzalo Müller – Clase 10 – GM - 30

Declaración y Definición en Javascript

Ejemplo: Declarar y Definir una función que calcule el cubo de un número.

n

c

c=n3

Programación – Prof. Gonzalo Müller – Clase 10 – GM - 31

Declaración y Definición en Javascript

Ejemplo: Declarar y Definir una función que calcule el cubo de un número.

n

c

c=n3

Programación – Prof. Gonzalo Müller – Clase 10 – GM - 32

cubo(n)

c = n*n*n

retorna c

Declaración y Definición en Javascript

Ejemplo: Declarar y Definir una función que calcule el cubo de un número.

Modulo Parámetros Retorno Tipo

cubo n c Función

Variables

c

n

c

c=n3

Programación – Prof. Gonzalo Müller – Clase 10 – GM - 33

cubo(n)

c = n*n*n

retorna c

c

Declaración y Definición en Javascript

Ejemplo: Declarar y Definir una función que calcule el cubo de un número.

Variables

c

Modulo Parámetros Retorno Tipo

cubo n c Funciónn

c

c=n3

Encabezado de la función

Programación – Prof. Gonzalo Müller – Clase 10 – GM - 34

cubo(n)

c = n*n*n

retorna c

c

<script>

function cubo(n){

}</script>

Declaración y Definición en Javascript

Ejemplo: Declarar y Definir una función que calcule el cubo de un número.

Variables

c

Modulo Parámetros Retorno Tipo

cubo n c Funciónn

c

c=n3

Programación – Prof. Gonzalo Müller – Clase 10 – GM - 35

cubo(n)

c = n*n*n

retorna c

c

<script>

function cubo(n){

}</script>

DECLARACIONES

SECUENCIA DE SENTENCIAS

Declaración y Definición en Javascript

Ejemplo: Declarar y Definir una función que calcule el cubo de un número.

Variables

c

Modulo Parámetros Retorno Tipo

cubo n c Funciónn

c

c=n3

Programación – Prof. Gonzalo Müller – Clase 10 – GM - 36

cubo(n)

c = n*n*n

retorna c

c

<script>

function cubo(n)

{

var c;

}

</script>

Declaración y Definición en Javascript

Ejemplo: Declarar y Definir una función que calcule el cubo de un número.

Variables

c

Modulo Parámetros Retorno Tipo

cubo n c Funciónn

c

c=n3

Programación – Prof. Gonzalo Müller – Clase 10 – GM - 37

cubo(n)

c = n*n*n

retorna c

c

<script>

function cubo(n)

{

var c;

c=n*n*n;

}

</script>

Declaración y Definición en Javascript

Ejemplo: Declarar y Definir una función que calcule el cubo de un número.

Variables

c

Modulo Parámetros Retorno Tipo

cubo n c Funciónn

c

c=n3

Programación – Prof. Gonzalo Müller – Clase 10 – GM - 38

cubo(n)

c = n*n*n

retorna c

c

<script>

function cubo(n)

{

var c;

c=n*n*n;

return c;}

</script>

Declaración y Definición en Javascript

Ejemplo: Declarar y Definir una función que calcule el cubo de un número:function cubo(n)

{// Declaraciones locales

//

Programación – Prof. Gonzalo Müller – Clase 10 – GM - 39

//

var c;

// Algoritmo

//

c = n*n*n;

//

return c;

}

Declaración y Definición en Javascript

Ejemplo: Declarar y Definir una función que calcule el cubo de un número:function cubo(n)

{// Declaraciones locales

//

Programación – Prof. Gonzalo Müller – Clase 10 – GM - 40

Retorno

Variable retorno//

var c;

// Algoritmo

//

c = n*n*n;

//

return c;

}

Declaración y Definición en Javascript

Ejemplo: Declarar y Definir una función que calcule el cubo de un número:function cubo(n)

{// Declaraciones locales

//

Es un parámetro y por lotantoNO SE DECLARA

Programación – Prof. Gonzalo Müller – Clase 10 – GM - 41

Retorno

Variable retorno//

var c;

// Algoritmo

//

c = n*n*n;

//

return c;

}

Llamada

Pone en ejecución el módulo.

� Se coloca el nombre del módulo.

� Seguido de los argumentos separados por comasentre paréntesis.

Programación – Prof. Gonzalo Müller – Clase 10 – GM - 42

Nombre(Argumento1, Argumento2, …)

Llamada

� Llamada de una Subrutina: se pone en ejecución a través una sentencia de llamada:

Nombre(Argumento1, Argumento2, …);

Programación – Prof. Gonzalo Müller – Clase 10 – GM - 43

Llamada

� Llamada de una Subrutina: se pone en ejecución a través una sentencia de llamada:

Nombre(Argumento1, Argumento2, …);

Programación – Prof. Gonzalo Müller – Clase 10 – GM - 44

Ejemplo:

escribeEncabezado();

…

escribeResultado(s);

…

Llamada

� Llamada de una Función: una función retorna un valor, por lo que la llamada formará parte de una:

� Sentencia a Asignación:

Variable = Nombre(Argumento1, Argumento2, …);

Programación – Prof. Gonzalo Müller – Clase 10 – GM - 45

Llamada

� Llamada de una Función: una función retorna un valor, por lo que la llamada formará parte de una:

� Sentencia a Asignación:

Variable = Nombre(Argumento1, Argumento2, …);

� Expresión Lógica:

Programación – Prof. Gonzalo Müller – Clase 10 – GM - 46

� Expresión Lógica:

(Nombre(Argumento1, Argumento2, …) != …)

Llamada

� Llamada de una Función: una función retorna un valor, por lo que la llamada formará parte de una:

� Sentencia a Asignación:

Variable = Nombre(Argumento1, Argumento2, …);

� Expresión Lógica:

Programación – Prof. Gonzalo Müller – Clase 10 – GM - 47

� Expresión Lógica:

(Nombre(Argumento1, Argumento2, …) != …)

� Expresión Aritmética:

…+ Nombre(Argumento1, Argumento2, …) / 2…

Llamada

� Llamada de una Función: una función retorna un valor, por lo que la llamada formará parte de una:

� Sentencia a Asignación:

Variable = Nombre(Argumento1, Argumento2, …);

� Expresión Lógica:

Programación – Prof. Gonzalo Müller – Clase 10 – GM - 48

� Expresión Lógica:

(Nombre(Argumento1, Argumento2, …) != …)

� Expresión Aritmética:

…+ Nombre(Argumento1, Argumento2, …) / 2…

� Otra Llamada (como Argumento):

Nombre1(…, Nombre(Argumento1, …, …));Argumento

Llamada

� Sentencia a Asignación:

Ejemplo: s = cubo(a);

Programación – Prof. Gonzalo Müller – Clase 10 – GM - 49

Llamada

� Sentencia a Asignación:

Ejemplo: s = cubo(a);

� Expresión Lógica:

Ejemplo: (cubo(a) > 10)

Programación – Prof. Gonzalo Müller – Clase 10 – GM - 50

Llamada

� Sentencia a Asignación:

Ejemplo: s = cubo(a);

� Expresión Lógica:

Ejemplo: (cubo(a) > 10)

Programación – Prof. Gonzalo Müller – Clase 10 – GM - 51

� Expresión Aritmética:

Ejemplo: (cubo(a) + 2)/cubo(b)

Llamada

� Sentencia a Asignación:

Ejemplo: s = cubo(a);

� Expresión Lógica:

Ejemplo: (cubo(a) > 10)

Programación – Prof. Gonzalo Müller – Clase 10 – GM - 52

� Expresión Aritmética:

Ejemplo: (cubo(a) + 2)/cubo(b)

� Otra Llamada (como Argumento):

Ejemplo: cubo(a + cubo(b))

escribeResultado(cubo(a))

Argumento

Argumento

Ejercicio

Construir una pagina web con Javascript conacoplamiento de datos básicos para calcular el máximode 2 números. Al menos 3 módulos:

lectura, proceso y

Programación – Prof. Gonzalo Müller – Clase 10 – GM - 53

Fase 1: Diseño y Análisis: DES, DTD

DES, DRE ó DF y LV de Módulos y TM.

DRE ó DF, LV y CF de Bloque Principal.

� Identificar parámetros, variables y variables deretorno

Fase 2: Codificación: pagina Web con Javascript.

lectura, proceso y escritura

Llamada

� Funcionamiento de los parámetros de entrada: Suponga un módulo con dos entradas:

MóduloEntrada 1

Programación – Prof. Gonzalo Müller – Clase 10 – GM - 54

Declaración y Definición:Modulo(parametro1, parametro2) ...

Entrada 2

Caja Negra

Llamada

parametro1

Módulo

Programación – Prof. Gonzalo Müller – Clase 10 – GM - 55

parametro2 Internamente

Llamada

� El módulo puede ser llamado con 2 constantes: 8 y9

8

Módulo

Programación – Prof. Gonzalo Müller – Clase 10 – GM - 56

9

Llamada

8

Módulo

Programación – Prof. Gonzalo Müller – Clase 10 – GM - 57

Llamada:Modulo(8, 9)

9

Llamada

� Internamente, el módulo maneja los parámetros 1 y2, con los valores 8 y 9, respectivamente.

parametro1

Módulo

Programación – Prof. Gonzalo Müller – Clase 10 – GM - 58

parametro2

parametro1=8parametro2=9

Llamada

parametro1

Módulo

Programación – Prof. Gonzalo Müller – Clase 10 – GM - 59

parametro2

Opera con parametro1 y parametro2

Llamada

� El módulo puede ser llamado con 2 variables: A y B

Variable A

Módulo

Programación – Prof. Gonzalo Müller – Clase 10 – GM - 60

Variable B

Llamada

Variable A

Módulo

Programación – Prof. Gonzalo Müller – Clase 10 – GM - 61

Llamada:Modulo(A, B)

Variable B

Llamada

� Internamente, el módulo maneja los parámetros 1 y2, con los valores de A y B, respectivamente.

parametro1

Módulo

Programación – Prof. Gonzalo Müller – Clase 10 – GM - 62

parametro2

parametro1=valor de Aparametro2=valor de B

Llamada

parametro1

Módulo

Programación – Prof. Gonzalo Müller – Clase 10 – GM - 63

parametro2

Opera con parametro1 y parametro2

Llamada

� El módulo puede ser llamado con 2 variables: X y Y

Variable X

Módulo

Programación – Prof. Gonzalo Müller – Clase 10 – GM - 64

Variable Y

Llamada

Variable X

Módulo

Programación – Prof. Gonzalo Müller – Clase 10 – GM - 65

Llamada:Modulo(X, Y)

Variable Y

Llamada

� Nuevamente, el módulo maneja los parámetros 1 y2, ahora con los valores de X y Y, respectivamente.

parametro1

Módulo

Programación – Prof. Gonzalo Müller – Clase 10 – GM - 66

parametro2

parametro1=valor de Xparametro2=valor de Y

Llamada

parametro1

Módulo

Programación – Prof. Gonzalo Müller – Clase 10 – GM - 67

parametro2

Opera con parametro1 y parametro2

Llamada

� El módulo puede ser llamado con dos expresionescomo argumento.

Expresión 1

Módulo

Programación – Prof. Gonzalo Müller – Clase 10 – GM - 68

Expresión 2

Llamada

Expresión 1

Módulo

Programación – Prof. Gonzalo Müller – Clase 10 – GM - 69

Llamada:Modulo(Expresión 1, Expresión 2)

Expresión 2

Llamada

� Nuevamente, el módulo maneja los parámetros 1 y2, ahora con los valores resultados de lasexpresiones.

parametro1

Módulo

Programación – Prof. Gonzalo Müller – Clase 10 – GM - 70

parametro2

parametro1=resultado de Expresion1parametro2=resultado de Expresion2

Llamada

parametro1

Módulo

Programación – Prof. Gonzalo Müller – Clase 10 – GM - 71

parametro2

Opera con parametro1 y parametro2

Llamada

parametro1

MóduloSe puede llamar el módulo con

diferentes valores:

Programación – Prof. Gonzalo Müller – Clase 10 – GM - 72

parametro2valores:

variables, constantes o expresiones

Internamente siempre seránparametro1 y parametro2

Llamada

Ejemplo:

Llamadas:...

a = cubo(6.7);escribeResultado(a);

...

Llamada a la misma función con diferentes valores

Programación – Prof. Gonzalo Müller – Clase 10 – GM - 73

...

b = cubo(a);escribeResultado(b);

...

escribeResultado(12);

...

ulNumero = cubo(a + b);escribeResultado(ulNumero+1);

diferentes valores

Llamada

function cubo(n)

{// Declaraciones locales

//

var c;

// Algoritmo

Internamente siempre será n

Programación – Prof. Gonzalo Müller – Clase 10 – GM - 74

// Algoritmo

//

c = n*n*n;

//

return c;

}

Llamada

Llamadas:...

a = cubo(6.7);

escribeResultado(a);...

Programación – Prof. Gonzalo Müller – Clase 10 – GM - 75

...

b = cubo(a);

escribeResultado(b);...

escribeResultado(12);...

ulNumero = cubo(a + b);

escribeResultado(ulNumero+1);

Llamada a la misma subrutina con diferentes valores

Llamada

Definición:

function escribeResultado(resultado)

{

document.write(“Cubo:”, resultado);

Programación – Prof. Gonzalo Müller – Clase 10 – GM - 76

document.write(“Cubo:”, resultado);

}

Internamente siempre será resultado

Programación Modular en Javascript

Ejemplo: Construir una pagina web con Javascript conacoplamiento de datos básicos para calcular las raícesde una ecuación cuadrática.

Programación – Prof. Gonzalo Müller – Clase 10 – GM - 77

Ejercicio

Construir una pagina web con Javascript conacoplamiento de datos básicos para calcular el cubo de3 números. Al menos 3 módulos:

lectura, proceso y

Programación – Prof. Gonzalo Müller – Clase 10 – GM - 78

Fase 1: Diseño y Análisis: DES, DTD

DES, DRE ó DF y LV de Módulos y TM.

DRE ó DF, LV y CF de Bloque Principal.

� Identificar parámetros, variables y variables deretorno

Fase 2: Codificación: pagina Web con Javascript.

lectura, proceso y escritura

Ejercicio

Construir una pagina web con Javascript conacoplamiento de datos básicos para calcular el cubo deN números. Al menos 3 módulos:

lectura, proceso y

Programación – Prof. Gonzalo Müller – Clase 10 – GM - 79

Fase 1: Diseño y Análisis: DES, DTD

DES, DRE ó DF y LV de Módulos y TM.

DES, DRE ó DF, LV y CF de Bloque Principal.

� Identificar parámetros, variables y variables deretorno

Fase 2: Codificación: pagina Web con Javascript.

lectura, proceso y escritura

Ámbito de una variable

Establece en que bloques del programa puede ser utilizada la variable.

� Ámbito Global → Variables globales: pueden serutilizadas en cualquier parte del código.

Programación – Prof. Gonzalo Müller – Clase 10 – GM - 80

utilizadas en cualquier parte del código.

� Ámbito Local → Variables locales: pueden serutilizadas sólo en el bloque de código donde fuerondeclaradas.

Ámbito Global

Algoritmo principal

datoGlobal

Programación – Prof. Gonzalo Müller – Clase 10 – GM - 81

Funcion1()

Subrutina1()

Ámbito Global

Algoritmo principal

datoGlobal

datoGlobal

Programación – Prof. Gonzalo Müller – Clase 10 – GM - 82

Funcion1()

Subrutina1()

datoGlobalpuede ser

empleada en cualquiera de estos bloques

Ámbito Global

…<script>function funcion1(){…}function subrutina1() datoGlobal puede

ser empleada en

Programación – Prof. Gonzalo Müller – Clase 10 – GM - 83

function subrutina1(){…

}</script>…<script>…</script>

ser empleada en cualquiera de estos

bloques

En Javascript las variables del bloqueprincipal son variables globales

Ámbito Local

Algoritmo principal

datoMain

Programación – Prof. Gonzalo Müller – Clase 10 – GM - 84

Funcion1()

Subrutina1()

datoFuncion1

datoSubrutina1

Ámbito Local

Algoritmo principal

datoMain

datoMain sólo es válido dentro del algoritmo principal

Programación – Prof. Gonzalo Müller – Clase 10 – GM - 85

Funcion1()

Subrutina1()

datoFuncion1

datoSubrutina1

datoFuncion1 sólo es válido dentro de

Funcion1

datoSubrutina1 sólo es válido dentro de

Subrutina1

Ámbito Local…<script>function funcion1(){var datoFuncion1;…

}function subrutina1()

datoFuncion1 sólo es válido dentro de

Funcion1

datoSubrutina1 sólo

Programación – Prof. Gonzalo Müller – Clase 10 – GM - 86

function subrutina1(){var datoSubrutina1;…

}</script>…<script>var datoMain;…

</script>

datoSubrutina1 sólo es válido dentro de

Subrutina1

datoMain “sólo” es válido dentro del

algoritmo principal

Ámbito Local

Ejemplo:…<script>function funcion1(){var datoFuncion1;datoFuncion1 = 11;

}function subrutina1()

Programación – Prof. Gonzalo Müller – Clase 10 – GM - 87

function subrutina1(){var datoSubrutina1;datoFuncion1 = 12;

}</script>…<script>var datoMain;datoFuncion1 = 13;

</script>

ERROR!

ERROR!

Ámbito Local…<script>function funcion1(){var dato1;…

}function subrutina1()

dato1 de Funcion1

Programación – Prof. Gonzalo Müller – Clase 10 – GM - 88

function subrutina1(){var dato1;…

}</script>…<script>var dato1;…

</script>

dato1 de Subrutina1

dato1 del algoritmo principal

Ámbito Local

Ejemplo: …

<script>function funcion1(){var dato1;dato1 = 11;return dato1;

}function subrutina1(){var dato1;

Programación – Prof. Gonzalo Müller – Clase 10 – GM - 89

var dato1;dato1 = 12;document.write(“subrutina” + dato1);

}</script>…

<script>var dato1;dato1 = 13;document.write(“funcion:” + funcion1());subrutina1();document.write(“principal:” + dato1);

</script>

Ámbito Global y Local

� El ámbito local predomina sobre el ámbito global.

Algoritmo principal

dato1

dato1

Programación – Prof. Gonzalo Müller – Clase 10 – GM - 90

Funcion1()

Subrutina1()

dato1

dato1

dato1

Ejercicios

Construir una pagina web para:

1) Calcular f(x) = sen(2*x)+x4 para N puntos.

2) Determinar las distancias entre N maquinas.

Fase 1: Diseño y Análisis: DES, DTD

DES, DRE ó DF y LV de Módulos y TM.

Programación – Prof. Gonzalo Müller – Clase 10 – GM - 91

DES, DRE ó DF y LV de Módulos y TM.

DRE ó DF, LV y CF de Bloque Principal.

� Identificar parámetros, variables y variables deretorno

Fase 2: Codificación: pagina Web con Javascript.

Ejercicios

Construir una pagina web para:

3) Calcular el factorial de N números.

4) Dado un conjunto de N números, establecer cuales son números compuestos.

Fase 1: Diseño y Análisis: DES, DTD

Programación – Prof. Gonzalo Müller – Clase 10 – GM - 92

Fase 1: Diseño y Análisis: DES, DTD

DES, DRE ó DF y LV de Módulos y TM.

DRE ó DF, LV y CF de Bloque Principal.

� Identificar parámetros, variables y variables deretorno

Fase 2: Codificación: pagina Web con Javascript.

Ejercicios

Construir una pagina web para:5) Promediar los pares y promediar los impares de los números entre A y B.6) Dado N intervalos, calcular la sumatoria de los números que contiene cada intervalo.Fase 1: Diseño y Análisis: DES, DTD

Programación – Prof. Gonzalo Müller – Clase 10 – GM - 93

Fase 1: Diseño y Análisis: DES, DTDDES, DRE ó DF y LV de Módulos y TM.DRE ó DF, LV y CF de Bloque Principal.� Identificar parámetros, variables y variables deretorno

Fase 2: Codificación: pagina Web con Javascript.

Ejercicios

Construir una pagina web para:7) Dado un conjunto de puntos en R2 por el usuario determinar cuales se encuentra por encima, por debajo y sobre una recta dada por el usuario.8) Encontrar por Newton 1 solución para f(x) = 0.Fase 1: Diseño y Análisis: DES, DTD

Programación – Prof. Gonzalo Müller – Clase 10 – GM - 94

Fase 1: Diseño y Análisis: DES, DTDDES, DRE ó DF y LV de Módulos y TM.DRE ó DF, LV y CF de Bloque Principal.� Identificar parámetros, variables y variables deretorno

Fase 2: Codificación: pagina Web con Javascript.

Ejercicios

Construir una pagina web para:

9) Encontrar 1 Mínimo de f(x) por 1+1.

Fase 1: Diseño y Análisis: DES, DTD

DES, DRE ó DF y LV de Módulos y TM.

DRE ó DF, LV y CF de Bloque Principal.

Programación – Prof. Gonzalo Müller – Clase 10 – GM - 95

DRE ó DF, LV y CF de Bloque Principal.

� Identificar parámetros, variables y variables deretorno

Fase 2: Codificación: pagina Web con Javascript.

Resumen

� Programación Modular

1. Declaración.

2. Definición.

3. Llamada.

� Declaración y Definición en Javascript: function

Programación – Prof. Gonzalo Müller – Clase 10 – GM - 96

� Declaración y Definición en Javascript: function

� Bloque <script> de declaración en <head>

� Reglas para identificadores

� Subrutina

� Función: return

� Variable retorno

Resumen

� Llamada:

� Subrutina: Sentencia de Llamada.

� Función: Asignación, Expresión, Argumento.

� Parámetros de entrada: variables, constantes oexpresiones.

Programación – Prof. Gonzalo Müller – Clase 10 – GM - 97

expresiones.

� Ámbito: Local y Global

� local predomina sobre el global.