JAVASCRIPT

KAROL GISELA ALVAREZ LEON 191740

LAUREN CRISTINA PEÑARANDA ALVAREZ 191730

LUIS ANDERSON CORONEL ROJAS

UNIVERSIDAD FRANCISCO DE PAULA SANTANDER

FACULTAD DE INGENIERIAS

INGENIERIAS DE SISTEMAS

OCAÑA, 2019
Tabla de contenido

Introducción ....................................................................................................................... 3

¿Qué es javaScript? ............................................................................................................ 4

Elementos del lenguaje ...................................................................................................... 5

Funciones ........................................................................................................................... 6

Sintaxis De Una Función ............................................................................................... 6

Funciones que manejan variables de texto .................................................................... 7

Funciones que manejan arrays ....................................................................................... 7

Ejemplos ............................................................................................................................ 8

Ejemplo Sumar dos números JavaScript ....................................................................... 8

Conclusiones .................................................................................................................... 14

Bibliografía ...................................................................................................................... 15
 Introducción

Este trabajo es con el fin de dar a conocer más afondo JavaScript JavaScript el cual es el

lenguaje que nos permite interactuar con el navegador de manera dinámica y eficaz,

proporcionando a las páginas web dinamismo y vida. Es un lenguaje orientado a objetos,

ya que dispone de Herencia, si bien ésta se realiza siguiendo el paradigma de programación

basada en prototipos, Con Javascript podemos crear efectos especiales en las páginas y

definir interactividades con el usuario, es el siguiente paso, después del HTML, que puede

dar un programador de la web que decida mejorar sus páginas y la potencia de sus

proyectos. Hablaremos de sus funciones, estructura y funcionalidad.

 ¿Qué es javaScript?

JavaScript es un lenguaje de los denominados lenguajes de scripting. Los scripts

(script se traduce como guión, literalmente) son archivos de órdenes, programas por

lo general simples. Es por esto que no podemos definir JavaScript como un lenguaje

de programación en un sentido estricto, pero sin embargo sí nos permite crear

páginas dinámicas, con algunos efectos realmente interesantes y que mejoren

considerablemente su aspecto. Nos permite tener cierta interacción con el usuario de

nuestras páginas, reconocer determinados eventos que se puedan producir y

responder a éstos adecuadamente. Podemos, por ejemplo, añadir elementos con

movimiento que recuerdan a las animaciones Flash. Incluso podemos crear algunos

programas más complejos que manejen estructuras de datos. Tratándose de un

lenguaje de script, los programas que realicemos, no necesitarán ser compilado. Los

lenguajes de scripting son lenguajes interpretados. Esto en la práctica significa que

cuando trabajemos con JavaScript escribiremos nuestro programa y podremos

ejecutarlo de forma directa, sin necesidad de hacer nada más. 1 Resumiendo: trabajar

con JavaSript es sencillo y rápido, los resultados pueden ser muy satisfactorios y

aunque el lenguaje tenga algunas limitaciones, permite al programador controlar lo

que ocurre en la página.

 Elementos del lenguaje

 Constantes: representan entidades que no se modifican durante la ejecución del

programa. Son constantes todos los valores que aparecen directamente en un

programa, por ejemplo 3.1415 es una constante que representa el numero π.

Las constantes con identificador de declaran con la clausula const seguida del

identificador, el símbolo “=” y el valor de la constante.

Const nombre_variable = valor_de_la_constante.

 Variables: posiciones de memoria a las que se le asigna un nombre y a las que se

puede acceder para obtener el valor que almacena.

Las variables se crean normalmente al comienzo del programa utilizando la

palabra var seguida del nombre de la variable que queremos crear, como en los

siguientes ejemplos.

 Operadores: símbolos que representan una operación de naturaleza matemática

relacional o lógica.

 Expresiones: son combinaciones de variables constantes y operadores.

 Instrucciones o sentencias: permiten organizar el flujo de ejecución de un

programa, estableciendo el orden en el que encadenan las opciones del mismo.

 Funciones: agrupaciones de instrucciones diseñadas para resolver un problema

concreto.
 Funciones

Es muy frecuente el uso de funciones en cualquier lenguaje de programación. Una

función es un conjunto de instrucciones que forman parte de un mismo proceso. Los

lenguajes de programación suelen tener muchas funciones predefinidas que realizan los

procesos más habituales. Más adelante veremos que nosotros mismos podremos definir las

funciones que necesitemos y que el lenguaje no nos facilite. De hecho, alguien se ocupó de

programar esas funciones predefinidas para que podamos utilizarlas en nuestro código. En

algunas ocasiones las funciones necesitan valores que debemos enviarles para que ellas

puedan procesarlos y devolvernos un resultado. A estos valores que tenemos que enviar a

las funciones, los llamamos argumentos (también a veces parámetros) y deben ir entre

paréntesis. Aquellas funciones que no necesitan argumentos llevarán los paréntesis vacíos.

También suele ser frecuente que una función retorne el resultado del proceso que realiza. Y

puede ser que dicho resultado nos sea útil para continuar la ejecución de nuestro programa.

En estos casos lo que haremos es asignar la función a una variable que será la encargada de

recogerlo.

Sintaxis De Una Función

funtion nombre_de_la_funtion(){

….enunciados a ejecutar….

}
Funciones que manejan variables de texto

Son aquellas que se aplican a variables de tipo texto. Veamos una lista de ellas, lo que

hacen y algunos ejemplos:

- length(): Calcula el número de caracteres de una variable de tipo texto. Es decir,

devuelve el número de caracteres que la componen.

var miTexto = “Pinté mi casa de amarillo”;

var longitudMiTexto = mensaje.length;

El resultado será 25 y se recoge en la variable longitudMiTexto. Longitud de una

variable de tipo texto

Funciones que manejan arrays

A continuación presentamos algunas de las funciones más utilizadas para tratar arrays.

Como se verá, algunas son muy similares a las estudiadas para texto:

- length: Devuelve el número de elementos que componen un array.

Obtención del número de elementos de un array.

var coloresPrimarios = [“rojo”, “azul”, “amarillo”];

var numeroColores = coloresPrimarios.length; // numeroColores = 3.

- concat(): Devuelve la concatenación de varios arrays: (Ribes, 2011)

 Ejemplos

Ejemplo Función

funtion holaMundo(){

alert(“Hola Mundo”);

holaMundo();

Ejemplo Sumar dos números JavaScript

<html>
<head>
<title>Sumar dos Numeros JavaScript</title>
</head>
<body>
<fieldset>
<legend>Ingrese dos numeros</legend>
<label for="">Numero 1:</label>
<input type="text" id="txtN1">
<br><br>
<label for="">Numero 2:</label>
<input type="text" id="txtN2">
<br><br>
<input type="button" onclick="Sumar();" value="Calucular">
</fieldset>
</body>
<script>
function Sumar() {
var n1 = document.getElementById('txtN1').value;
var n2 = document.getElementById('txtN2').value;
var suma = parseInt(n1) + parseInt(n2);
alert("La suma es: "+suma)
}
</script>
</html>
Ejemplo Calculadora

<!DOCTYPE html>

<html lang="es">

<head>

</head>

<body>

<h1>Calculadora</h1>

<input type="text" id="arg1" size="1"> X <input type="text" id="arg2" size="1">

<input type="button" value="Calcular!" onclick="calc()">

<div id="result"></div>

<script type="text/javascript">

function calc(){

var argOne=document.getElementById('arg1').value;

var argTwo=document.getElementById('arg2').value;

var ans=(argOne*argTwo);

document.getElementById('result').innerHTML=argOne + ' multiplicado por ' + argTwo + ' es igual a ' + a

ns;

</script>

</body>

</html>
 Ejemplo de calculadora básica en JavaScript

<!DOCTYPE html>
<html>
<head>
<title>Calculadora basica</title>
<style>
input[type="button"]:hover{
background-color:slategray;
cursor: pointer;
}
input[type="button"].arit{
background-color:maroon;
}
input[type="button"].igual{
background-color: green;
}
input[type="button"].clear{
background-color:orangered;
}
form{
background-color:white;
}
input[type="text"]{
background-color:black;
border:0px;
width:250px;
height: 40px;
font-size: 20px;
color: white;
text-align: right;
pointer-events: none;
}
input[name="txtcaja1"]{
height: 20px;
font-size: 16px;
}
input[name="txtcaja2"]{
margin-bottom: 5px;
font-size: 26px;
}
input[type="button"]{
font-size: 18px;
font-weight:lighter;
font-family:Segoe, "Segoe UI", "DejaVu Sans", "Trebuchet MS", Verdana,
"sans-serif";
 width:60px;border:0px;
height: 60px;
color: white;
background-color:blue;
margin-bottom: 5px;
}
body{
background-color:#f1f1f1;
}
</style>
</head>
<body>
<center>
<h1>Calculadora Basica</h1>
<form name="f1"><br>
<input type="text" name="txtcaja1">
<br>
<input type="text" name="txtcaja2" value="0">
<br>
<input type="button" class="arit" onClick="arit('%')" value="%">
<input type="button" onClick="raiz()" value="√">
<input type="button" onClick="escribir('7')" value="x²">
<input type="button" onClick="escribir('7')" value="¹/×">
<br>
<input type="button" class="clear" onClick="document.f1.txtcaja2.value='0'"
value="CE">
<input type="button" class="clear" onClick="document.f1.reset(); blocdel = false;"
value="C">
<input type="button" class="clear" onClick="deletecarac()" value="◄">

<input type="button" class="arit" onClick="arit('/')" value="÷">

<br>
<input type="button" onclick="escribir(this.value)" value="7">
<input type="button" onclick="escribir(this.value)" value="8">
<input type="button" onclick="escribir(this.value)" value="9">
<input type="button" class="arit" onClick="arit('*')" value="×">
<br>
<input type="button" onclick="escribir(this.value)" value="4">
<input type="button" onclick="escribir(this.value)" value="5">
<input type="button" onclick="escribir(this.value)" value="6">
<input type="button" class="arit" onClick="arit('-')" value="-">
<br>
<input type="button" onclick="escribir(this.value)" value="1">
<input type="button" onclick="escribir(this.value)" value="2">
<input type="button" onclick="escribir(this.value)" value="3">
<input type="button" class="arit" onClick="arit('+')" value="+">
<br>
<input type="button" class="arit" onClick="masmenos()" value="±">
<input type="button" onclick="escribir(this.value)" value="0">
<input type="button" onClick="escribir('.')" value=".">
<input type="button" class="igual" onClick="calcular()" value="=">
<br>
</form>
</center>
<script type="text/javascript">
var borrar = false;
function deletecarac(){
var caja2 = document.f1.txtcaja2.value;
if (caja2 == "" || caja2 == "0" || caja2.length == 1 && blocdel!=true){
document.f1.txtcaja2.value = "0";
}
else if(blocdel!=true){
var res = caja2.substring(0,caja2.length-1);
document.f1.txtcaja2.value = res;
}
}
function escribir(n){
var caja2 = document.f1.txtcaja2.value;
if (borrar) {
//alert("se borro");
document.f1.txtcaja2.value="";
borrar = false;
document.f1.txtcaja2.value = n;
}
else if (caja2 == "0" && n != "."){
cajao = caja2.replace("0", "")
document.f1.txtcaja2.value = cajao + n;
}
else{
document.f1.txtcaja2.value = caja2 + n;
}
}
function raiz(){
var caja1 = document.f1.txtcaja1.value;
var caja2 = document.f1.txtcaja2.value;
document.f1.txtcaja1.value = "Math.sqrt("+ caja2 + caja1 +")";
document.f1.txtcaja2.value = "";
}
function arit(o){
var caja1 = document.f1.txtcaja1.value;
var caja2 = document.f1.txtcaja2.value;
var unum = caja1.substring(caja1.length-1);
 calcular()
if (unum == "+" || unum == "-" || unum=="*" || unum=="/") {
unum = unum.replace(unum,o);
var res = caja1.substring(0,caja1.length-1);
document.f1.txtcaja1.value = res+unum;
}
if (caja1 == "" && caja2 != ""){
document.f1.txtcaja1.value = caja2 + o;
}
else{
document.f1.txtcaja1.value = caja1 + caja2 + o;
}
borrar = true;
}
function calcular(){
var caja1 = document.f1.txtcaja1.value;
var caja2 = document.f1.txtcaja2.value;
document.f1.txtcaja2.value = eval(caja1 + caja2);
document.f1.txtcaja1.value = "";
borrar = true;
blocdel = true;
}
function masmenos(){
var caja2 = document.f1.txtcaja2.value;
if (caja2 > 0){
document.f1.txtcaja2.value = "(-" + caja2 + ")";
}
else{
cajaplus = caja2.replace(/[-|(|)]/g, "");
document.f1.txtcaja2.value = cajaplus;
}
}
</script>
</body>
</html>
 Conclusiones

Después de haber realizado un trabajo de investigación sobre Java Script, nos podemos dar

de cuenta que es una forma de cómo hacer dinámico o con ciertas características de

moviente una página Web diseñada en HTML. JavaScript

Es una parte fundamental para la realización de las páginas web, ya que cuenta con una

amplia gama de funciones, pues puede ser incluido en cualquier elemento de HTML, sin

necesidad de instalar otro programa.

 Bibliografía

Rodríguez, M. D. (2012). JavaScript (2a. ed.).

JavaScript (2a. ed.), Editorial ICB, 2012. ProQuest Ebook Central,

http://ebookcentral.proquest.com/lib/ufpsosp/detail.action?docID=5809120.

Created from ufpsosp on 2019-10-08 16:14:24.

(Alba P. R., 2011)

Ribes, Alba, Purificación. Manual de Javascript, Editorial CEP, S.L., 2011. ProQuest

Ebook Central, http://ebookcentral.proquest.com/lib/ufpsosp/detail.action?docID=3217353.

Created from ufpsosp on 2019-10-08 16:17:25.