Comprender y usar declaraciones de JavaScript

Las declaraciones se utilizan en JavaScript para controlar el flujo de su programa. A diferencia de las propiedades, los métodos y los eventos, que están fundamentalmente vinculados al objeto que los posee, las declaraciones están diseñadas para funcionar independientemente de cualquier objeto JavaScript. Eso significa que puede usar una declaración ya sea que esté trabajando con el objeto de documento, el objeto de ventana, el objeto de historial o algún otro objeto. Como lenguaje, JavaScript admite relativamente pocas declaraciones, solo lo suficiente para sobrevivir. Sin embargo, ofrece el mínimo de declaraciones que se necesitan para construir una aplicación completamente funcional.

JavaScript admite actualmente las siguientes once declaraciones. Tenga en cuenta que algunas de estas, como comment, var y new, no son declaraciones de buena fe, pero a menudo se tratan como tales. Se incluyen en esta discusión en aras de la exhaustividad.

  • // comentario
  • romper
  • Seguir
  • para
  • para ... en
  • función
  • si ... si no
  • nuevo
  • regreso
  • var
  • mientras
  • con

Algunas de las declaraciones que se ofrecen en Java carecen notablemente de JavaScript. Esto incluye la instrucción de cambio, así como todas las formas de instrucciones de captura de errores (como atrapar y lanzar). JavaScript mantiene estas declaraciones como palabras reservadas y, quizás, en alguna versión futura, se implementarán.

Comentario (//)

Los caracteres // le dicen a JavaScript que desea incluir comentarios explicativos en su programa. El comentario termina con el primer retorno duro que se encuentra. JavaScript no pone límite a la longitud del comentario, siempre que no haya una devolución definitiva antes de que finalice el comentario. JavaScript asume que el texto después de la devolución completa es un código válido.

// Este es un simple comentario

// Este es otro comentario que abarca más de una línea. Aunque el comentario pasa a la segunda línea, la primera línea termina con un "retorno suave" en el programa de edición de texto. No se inserta ningún carácter de retorno rígido.

Puede colocar los // caracteres de comentario en cualquier lugar de una línea. JavaScript tratará todo el texto de esa línea después de // como un comentario.

MyVariable = "Esto es una prueba" // asigna la variable de texto MyVariable 

Los comentarios se ignoran cuando se reproduce el guión, por lo que no afectan en gran medida la velocidad de ejecución. Sin embargo, muchos comentarios aumentan el tamaño del archivo de los scripts y tardan más en descargarse en la computadora del usuario a través de una conexión de acceso telefónico a Internet. Para obtener los mejores resultados, limite los comentarios en los programas JavaScript a líneas breves y sencillas.

Al escribir comentarios largos, es mejor utilizar los caracteres de comentario alternativos / * y * /. El texto entre estos caracteres se trata como un comentario. Alternativamente, puede comenzar cada línea con los // caracteres de comentario.

// Esta sección verifica si se presiona la tecla Enter, // luego continúa 

o

/ * Esta sección verifica si se presiona la tecla Enter, luego continúa en * / 

Volver al índice

Romper

La instrucción break le dice a JavaScript que salga de una "estructura controlada" y reanude la ejecución en un punto después de la estructura. La sentencia break se usa con estructuras construidas con los siguientes comandos:

  • para
  • para ... en
  • mientras

La sentencia break se utiliza con más frecuencia para finalizar prematuramente un bucle for. Por ejemplo:

for (Count = 1; Count <= 10; Count ++) {if (Count == 6) break; document.write ("

Bucle: "+ Count +"

");}

Este ejemplo muestra un ciclo for que cuenta de 1 a 10 e imprime el número en cada iteración del ciclo. Una instrucción if dentro del bucle for se usa para probar si el valor de la variable Count es igual a 6. Si Count es igual a 6, se ejecuta la instrucción break y el script sale del bucle for. Como se usa en este ejemplo simple, el script contará de 1 a 6 y luego se detendrá. Sale del bucle for antes de que pueda contar hasta 10.

Volver al índice

Seguir

La instrucción continue le dice a JavaScript que omita cualquier instrucción que pueda seguir en un bucle for, for ... in o while, y continúe con la siguiente iteración. El uso más común de la instrucción continue es omitir condicionalmente instrucciones en el bucle pero no salir del bucle (como lo hace la instrucción break). Por ejemplo:

for (Count = 1; Count <= 10; Count ++) {if (Count == 6) continue; document.write ("

Bucle: "+ Count +"

");}

El ejemplo anterior muestra un ciclo for que cuenta de 1 a 10 e imprime el número en cada iteración del ciclo. Una instrucción if dentro del bucle for se usa para probar si el valor en la variable Count es igual a 6. Si Count es igual a 6, se ejecuta la instrucción continue y el script omite la instrucción document.write en la siguiente línea. Pero el ciclo no termina. En cambio, continúa e imprime líneas para los números restantes. Como se usa en este ejemplo simple, el script contará del 1 al 5, saltará 6, luego imprimirá del 7 al 10.

Volver al índice

por

La instrucción for repite un bloque de instrucciones una o más veces. El número de iteraciones está controlado por valores proporcionados como argumentos. La sintaxis de la instrucción for es:

para (InitVal; Prueba; Incremento) 
  • InitVal is the starting value of the for loop. It is often 0 or 1, but it can be any number. InitVal is an expression that establishes the initial value and assigns that value to a variable. For example, Count=0 or i=1.

  • Test is the expression used by the for statement to control the number of iterations of the loop. As long as the Test expression is true, the loop continues. When the Test expression proves false, the loop ends. Example: Count<10 is true as long as the value in the Count variable is less than 10.

  • Incrementindica cómo desea que cuente el bucle for: de uno en uno, dos, cinco, diez, etc. Esta también es una expresión y generalmente toma la forma de CountVar++, donde CountVares el nombre de la variable asignada por primera vez en la InitValexpresión. Ejemplo: Count ++ aumenta el valor de la variable Count en uno para cada iteración.
Tenga en cuenta que, a diferencia de todas las demás construcciones en JavaScript, la instrucción for utiliza punto y coma, en lugar de comas, para separar sus argumentos. Esto está de acuerdo con la sintaxis utilizada en C, C ++ y Java.

Here's an example of a for loop that counts from 1 to 10, stepping one digit at a time. At each iteration, the script inserts some text and begins a new line. The JavaScript you wish to repeat is enclosed in { and } characters following the for statement; this forms the for statement block. You can provide one line or many within the { and } characters.

for (Count=1; Count<=10; Count++) { document.write ("Iteration: "+Count+"

"); }

Count is the variable name used to store the for loop counter. The for loop starts out with 1 and proceeds to 10. The test expression is Count<=10, which reads:

Count is less than or equal to 10 

As long as this expression is true, the for loop continues. Do note that the Increment argument is also an expression and in the example uses the Count variable to increment the for loop by 1 for each iteration. There's no law that says you must increment the for loop by ones. Here's just one of the many alternatives. This example counts by tens, from 10 to 100.

for (Count=1; Count<101; Count+=10) { document.write ("Iteration: "+Count+"

"); }

Back to index

For...in

The for...in statement is a special version of the for statement described in the previous section. For...in is used to display the property names and/or property contents of objects. It is mostly handy as a debugging and testing tool: If a portion of your JavaScript code isn't working properly, and you suspect it may be the fault of a JavaScript object you are trying to use, you can examine all of the properties for that object with the for...in statement.

Unlike the for statement, for...in doesn't use incrementing tests or other expressions. You provide the name of a holding variable (the name of the variable is up to you) and the object you want to use. The basic syntax for the for...in statement is:

for (var in object) { statements } 
  • var is the name of a variable
  • object is the object you wish to examine
  • statements are one or more JavaScript instructions you wish to execute for each property returned by the for...in loop

As an example, suppose you want to determine the properties of the navigator object (this object contains details about the Netscape Navigator or other browser you are using). The following code displays each property name in an alert box. When running the script, click OK to proceed to the next property name. The loop automatically ends when there are no more properties in the object.

for (temp in navigator) { alert (temp); } 

A variation of this example is shown below. It not only displays the property names but also displays the contents of each property (some properties are empty and therefore no contents are shown for them). The contents of the properties are displayed by using the syntax object[var], or in this case navigator[temp].

for (temp in navigator) { alert (temp + ": " + navigator[temp]); } 

The for..in loop can be used for all object types. You can use it to iterate through all the properties for a form in a document, for example, or through the properties of a user-defined object. For instance, to cycle through all the properties of a form, you'd use the for...in loop as in the following example (assume the form name is "myform"):

 function test() { for (temp in document.myform) { alert (temp); } }

Back to index

Function

The function statement lets you create your own user-defined functions (as well as user-defined objects and methods for those objects). Functions are self-contained routines that can be "called" elsewhere within your JavaScript code. For example, if you have a function named

writeMyName

, which displays your name in headline text, you can activate it by merely referring to the name

writeMyName

someplace within your JavaScript code. Here's a short

test

that shows how this might work:

  Function Test  function writeMyName () { MyName="John Doe" alert (MyName) }     

The writeMyName function is defined within ... tags. It is activated (otherwise known as "called") when the form button is pushed. This calling action is accomplished using the onClick event handler, defined in the tag for the form button.

Back to index

If...else

The if, along with its optional else, statement is used to build an "if conditional" expression. It is called a conditional expression because it tests for a specific condition.

  • If the expression is true, the script performs the instructions following the if statement.
  • If the expression is false, the script jumps to the instructions that follow the else statement. If there is no else statement, the script jumps past the if statement entirely and continues from there.

The syntax for if is:

if (expression) 

The result of the if expression is always either true or false. The following syntax is acceptable when there's only one instruction following the if and else statements:

if (ExampleVar == 10) Start(); else Stop(); 

Should more than one instruction follow the if or else statement, the { and } characters must be used to define an if statement block. With the { and } characters in place, JavaScript knows to execute all of the instructions within the block.

if (ExampleVar == 10) { Count = 1; Start(); } else { Count = 0; Stop(); } 

Expressions in if statements are not limited to the == equality operator. You can test if values are not equal to one another, greater than, less than, and more. For more information on the operators you can use, see the references list at the end of this column. It points to valuable JavaScript documentation, including documentation provided by Netscape.

Back to index

New

The new statement creates a new copy of an object. It is used in either of two ways:

  • To define a new Date object (Date is a built-in JavaScript object)
  • To define a new user-defined object

The syntax is the same with either use:

varname = new objectName(params); 
  • varname is the name of the new object. Acceptable names are the same as for JavaScript variables. In fact, you can consider the created object as a JavaScript variable.

  • objectName is the name of the object. When using the built-in Date object, you use the word Date (note the capitalization -- this is mandatory). When using a user-defined object function, you provide the name of the object function.

  • params are one or more parameters that you pass to the object function, if needed.

The following example shows how to use the new statement to create a copy -- otherwise known as an "instance" -- of the Date object:

now = new Date(); 

El objeto now, que puede considerarse una variable de JavaScript, tiene todas las propiedades y métodos del objeto Date de JavaScript. Por ejemplo, usa el objeto ahora para determinar la hora actual del día:

ahora = nueva fecha (); HourNow = ahora.getHours ();