mozilla

Expresiones y operadores

This translation is incomplete. Please help translate this article from English.

Este capítulo describe expresiones y operadores de JavaScript, incluyendo los de asignación, comparación, aritmética, bit a bit, lógica, strings y otros operadores epeciales.

Expresiones

Una expresión es cualquir unidad de código valida que se resuelve en un valor.

Conceptualmente, existen dos tipos de expresiones, aquellas que asignan un valor a una variable y aquellas que simplemente tienen un valor

La expresión x = 7 es un ejemplo de este primer tipo. Esta expresión usa el operador = para asignar un valor a la variable x. La expresión se evalúa a si misma a siete.

El código 3 + 4 es un ejemplo del segundo tipo. Esta expresión utiliza el operador + para sumar tres mas cuatro sin asignar el resultado, siete, a ninguna variable.

JavaScript tiene las siguientes categorías de expresiones:

Operadores

JavaScript tiene los siguientes tipos de operadores. Esta sección describe el operador y contiene información sobre el ordén de los operadores:

JavaScript tiene operadores binarios y unarios, y un operador ternario especial, el operador condicional. Un operador binario necesita dos operandos, uno antes del operador y otro después de este.

operando1 operador operando2

Por ejemplo, 3+4 o x*y.

Un operador unario requiere solamente un operando antes o después del operador:

Operando operador

o

operador operando

Por ejemplo, x++ o ++x

Operadores de asignación

Un operador de asignación asigna un valor a el operador de la izquierda en función a el valor del operando de la derecha. El operador básico de asignación es el igual (=), que asigna el valor de la derecha a el operador de la izquierda. Por ejemplo, x = y, está asignando el valor y a x.

Los otros operadores de asignación y su forma abreviada están en la siguiente tabla:

Tabla 3.1 Operadores de asignación
 Operador abreviado Significado
x += y x = x + y
x -= y x = x - y
x *= y x = x * y
x /= y x = x / y
x %= y x = x % y
x <<= y x = x << y
x >>= y x = x >> y
x >>>= y x = x >>> y
x &= y x = x & y
x ^= y x = x ^ y
x |= y x = x | y

Operadores de comparación

This seems to me kind of poorly explained, mostly the difference betwen "==" and "==="... Un operador de comperación compra sus operandos y devuelve un valor lógico vasado en si la comparación es verdadera (true) o falsa (false). Los operadores pueden ser númericos, cadena de caracteres (strings), lógico u objetos. Strings son comparados banadose en orden lexicográfico estandar, basandose en Unicode. En la mayoría de los casos, si dos operadores no son del mismo tipo, JavaScript intenta convertirlos en el tipo apropiado para permiter la comparación, generalmente, convirtiendolos a tipo númerico. Las únicas excepciones que tiene esta conversión son los operadores === y !== que implican que ambos valores sean del mismo tipo a la hora de la comparación. Estos operadores no intentan convertir los operandos a tipo compatible antes de comprobar su igualdad. La siguiente tabla describe los operadores de comparación en base a el siguiente código de ejemplo:

var var1 = 3, var2 = 4;
Tabla 3.2 Operadores de comparación
Operador Descripción Ejemplos devolviendo true
Igualdad (==) Devuelve true si ambos operandos son iguales. 3 == var1

"3" == var1

3 == '3'
Desigualdad (!=) Devuelve true si ambos operandos no son iguales. var1 != 4
var2 != "3"
Estrictamente igual (===)

Devuelve true si los operandos son igual y tienen el mismo tipo. Mira también Object.is y sameness in JS.

3 === var1
Estrictamente desiguales(!==)

Devuelve true si los operandos no son igual y/o no tienen el mismo tipo.

var1 !== "3"
3 !== '3'
Mayor que (>)

Devuelve true si el operando de la izquierda es mas grande que el operando de la derecha.

var2 > var1
"12" > 2
Mayor o igual que (>=) Devuelve true si el operando de la izquierda es mas grande que el operando de la derecha. var2 >= var1
var1 >= 3
Menor que (<) Devuelve true si el operando de la izquierda es mas pequeño que el operando de la derecha. var1 < var2
"2" < "12"
Menor o igual que (<=) Devuelve true si el operando de la izquierda es mas pequeño o igual que el operando de la derecha. var1 <= var2
var2 <= 5

Operadores aritméticos

Los operadores aritméticos cogen valores númericos (tanto literales como variables), y sus operandos y devuelven un único resultado numerico. Los operadores aritméticos estandar son la suma (+), la multiplicación(*), la resta(-) y la división (/). Estos operadores funcionan como en los otros lenguajes de programación cuando son usados con números de puntos flotantes (en particular, tenga en cuenta que la división por cero produce Infinity). Por ejemplo:

console.log(1 / 2); /* devuelve 0.5 */
console.log(1 / 2 == 1.0 / 2.0); /* devuelve true */

Además, JavaScript provee los siguientes operadores aritméticos:

Table 3.3 Operadores aritméticos
Operator Description Example
%
(Modulo)

Operador binario. Devuelve el resto de la división de dos operandos

12 % 5 returns 2.
++
(Incremento)

Operador unario. Suma uno a el operando. Si es usado antes del operando (++x) devuelve el valor del operando después de añadirle 1 y si se usa después del operando (x++) devuelve el valor de este operando antes de añadir 1.

Si x es 3, entonces ++x establece x a 4 y devuelve 4, mientras que x++ devuelve 3 y, solo después de devolver el valor, establece x a 4.
--
(Decrement)

Operador unario. Resta one al operando. El valor devuelto es igual que para el operador de incremento

Si x es 3, entonces --x establece x a 2 y devuelve 2, mientras que x-- devuelve 3 y, solo después de devolver el valor, establece x a 2.
-
(Unary negation)

Operación unaria. Devuelve la negación del operando

Si x es 3, entonces -x devuelve -3.

Operadores Bit-a-bit

Los operadores bit a bit trata sus operandos como un conjunto de 32 bits (ceros y unos), mas que como números decimales, hexadecimales o octales. Por ejemplo, el número decimal 9 se representa en binario como 1001. Los operadores bit a bit realiza sus operaciones en dicha representación binaria, pero devuelven un valor númerico estandar.

La siguiente tabla muestra los operadores bit-a-bit que provee JavaScript

Table 3.4 Bitwise operators
Operator Usage Description
Bitwise AND a & b

Returns a one in each bit position for which the corresponding bits of both operands are ones.

Devuelve un uno en cada posición del bit para cada bit iguales en ambos operandos

Bitwise OR a | b Returns a one in each bit position for which the corresponding bits of either or both operands are ones.
Bitwise XOR a ^ b Returns a one in each bit position for which the corresponding bits of either but not both operands are ones.
Bitwise NOT ~ a Inverts the bits of its operand.
Left shift a << b Shifts a in binary representation b bits to the left, shifting in zeros from the right.
Sign-propagating right shift a >> b Shifts a in binary representation b bits to the right, discarding bits shifted off.
Zero-fill right shift a >>> b Shifts a in binary representation b bits to the right, discarding bits shifted off, and shifting in zeros from the left.

Operadores lógicos bit a bit

Conceptualmente, los operadores lógicos bit a bit funcionan de la siguiente manera:

  • Los operandos son convertido a enteros de 32 bits y expresados como series de bits (ceros y unos).
  • Cada bit en el primer operando es emparejando con el correspondiente bit en el segundo operando: Primer bit con primer bit, segundo bit con segundo bit..
  • La operación se aplica para cada par de bits y el resultado es construido bit a bit.

Por ejemplo, la representación binaria de 9 es 1001, y la representación binaria de 15 es 1111. Asi que, cuando las operaciones bit a bit son aplicadas a estos valores, los resultados son los siguientes:

Table 3.5 Bitwise operator examples
Expresión Resultado Descripción binaria
15 & 9 9 1111 & 1001 = 1001
15 | 9 15 1111 | 1001 = 1111
15 ^ 9 6 1111 ^ 1001 = 0110
~15 -16 ~00000000...00001111 = 11111111...11110000
~9 -10 ~00000000...00001001 = 11111111...11110110

Observa que los 32 bits se invierten utilizando el operador de negación bitwise NOT "~", y que en los valores más significativos (Extremo izquierdo) el bit con valor 1 representa números negativos en binario (Representación en complemento a dos)

Los operadores Bitwise shift

Los operadores Bitwise shift utilizan dos operandos : el primero es un numero que será desplazado N veces, y el segundo especifica el número de posiciones (N) que el primer operando va a ser desplazado. La dirección del desplazamiento es controlado por el operador utilizado.
 

Los operadores Shift convierten los operandos en enteros de 32bits y retornarán un resultado que será del mismo tipo que el operando de la izquierda

Los diferentes operadores Shift están listados en la siguiente tabla.

Table 3.6 Bitwise shift operators
Operador Descripción Ejemplo
<<
(Desplazamiento a la izquierda)
 

Este operador desplaza el primer operando el número especificado de bits hacia la izquierda. El exceso de bits desplazados a la izquierda se descartan. Ningún bit se desplaza desde la derecha.

 

9<<2 retorna 36, puesto que 9 es 1001 y se desplaza 2 bits hacia la izquierda, dando como resultado 100100, cuya transformación a decimal es 36.

>>
(Sign-propagating right shift)

Este operador desplaza el primer operando el número especificado de bits hacia la derecha. El exceso de bits desplazados a la derecha se descartan. Las copias del bit de más a la izquierda se desplazan desde la izquierda.

9>>2 retorna 2, puesto que 9 es 1001 y se desplaza 2 bits hacia la derecha, dando como resultado 10, cuya transformación a decimal es 2. Del mismo modo, -9>>2 retorna -3, puesto que el signo se mantiene.
>>>
(Zero-fill right shift)
Este operador desplaza el primer operando el número especificado de bits hacia la derecha. El exceso de bits desplazados a la derecha se descartan. Ningún bit se desplaza desde la izquierda. 19>>>2 retorna 4, puesto que 19 es 10011 y se desplaza 2 bits hacia la derecha dando como resultado 100, cuya transformación al decimal es 4. For non-negative numbers, zero-fill right shift and sign-propagating right shift yield the same result.

Operadores lógicos

Los operadores lógicos son tipicamente utilizado con valores boleanos (valores lógicos); ellos devuelven un valor boleano. Sin embargo, los operadores && y || devuelven el valor de uno de los operandos, asi que si estos operadores son usados con valores no boleanos, devolveran un valor no boleano. Los operadores lógicos están descritos en la siguiente tabla:

Table 3.6 Logical operators
Operator Usage Description
&& expr1 && expr2

(Logical AND) Devuelve expr1 si puede ser convertido a false o sino devuelve expr2. Así, cuando se usa con valores boleanos, && devuelve true si ambos operandos son true, en caso contrario devuelve false.

|| expr1 || expr2

(Logical OR) Devuelve expr1 si puede ser convertido a false o sino devuelve expr2. Así, cuando se usa con valores boleanos, && devuelve true si cualquiero operandos es true, o false si ambos son falsos.

! !expr

(Logical NOT) Devuelve false si el operando no puede ser convertido a true, en caso contrario, devuelve true

Ejemplos de expresiones que pueden ser convertidas a falso son aquellas que comparan con null, 0, NaN, string vacío o undefined.

El siguiente código muestra ejemplos del operador && (logical AND).

var a1 =  true && true;     // t && t devuelve true
var a2 =  true && false;    // t && f devuelve false
var a3 = false && true;     // f && t devuelve false
var a4 = false && (3 == 4); // f && f devuelve false
var a5 = "Cat" && "Dog";    // t && t devuelve Dog
var a6 = false && "Cat";    // f && t devuelve false
var a7 = "Cat" && false;    // t && f devuelve false

El siguiente código muestra ejemplos del operador || (logical OR).

var o1 =  true || true;     // t || t devuelve true
var o2 = false || true;     // f || t devuelve true
var o3 =  true || false;    // t || f devuelve true
var o4 = false || (3 == 4); // f || f devuelve false
var o5 = "Cat" || "Dog";    // t || t devuelve Cat
var o6 = false || "Cat";    // f || t devuelve Cat
var o7 = "Cat" || false;    // t || f devuelve Cat

El siguiente código muestra ejemplos del operador !(logical NOT).

var n1 = !true;  // !t devuelve false
var n2 = !false; // !f devuelve true
var n3 = !"Cat"; // !t devuelve false

Short-circuit evaluation

As logical expressions are evaluated left to right, they are tested for possible "short-circuit" evaluation using the following rules:

  • false && anything is short-circuit evaluated to false.
  • true || anything is short-circuit evaluated to true.

The rules of logic guarantee that these evaluations are always correct. Note that the anything part of the above expressions is not evaluated, so any side effects of doing so do not take effect.

String operators

Además de los operadores de comparación, que pueden ser usado para evaluar strings, el operador de concatenación (+) une dos valores string, devolviendo otro string que es la unión de estos. Por ejemplo,  "Mi" + "String" devuelve un único string "Mi string".

La versión acortada de este operador de asignación += puede ser usado también para concatenar string. Por ejemplo, si una variable myString tiene el valor "alpha", el resultado de aplicar la operacion myString += "bet" asigna el string "alphabet" a esta variable.

Special operators

JavaScript provides the following special operators:

En JavaScript provee los siguientes operadores especiales:

Conditional operator

El operador condicional es el único operador JavaScript que recibe 3 operandos. Los operadores pueden tener 1 o 2 valores basados en una condición. La sintaxis es:

condición ? val1 : val2

Si la condición es true, el operador tiene el valor 1. Por otro lado, si la condición es falsa tiene el valor dos. Puedes usar el operador condicional dondequiera que uses un operador estandar.

Por ejemplo,

var status = (age >= 18) ? "adulto" : "menor";

Esta declaración asigna el valor "adulto" a la variable status si la edad es 18 o mas, por otro lado, si no lo fuese, asignaria el valor "menor" a la variable status.

Comma operator

El operador de coma (,) simplemente evalua varios de sus operandos y devuelve el valor del segundo operando. Este operador se utiliza principalmente en los bucles for, para permitir que varias variables sean actualizada en cada ejecución del bucle.

For example, if a is a 2-dimensional array with 10 elements on a side, the following code uses the comma operator to increment two variables at once. The code prints the values of the diagonal elements in the array:

Por ejemplo, si a es un array bidimensional con 10 elemento en un lado, el siguiente código utiliza el operador de coma para incrementar 2 variables a la vez. El código imprive el valor de los elementos de la diagonal del array.

for (var i = 0, j = 9; i <= 9; i++, j--)
  document.writeln("a[" + i + "][" + j + "]= " + a[i][j]);

delete

La función del operador delete es eliminar  un objeto, una propiedad de un objeto, o un elemento en el indice específico de un array. La sintaxis es la siguiente:

delete objectName;
delete objectName.property;
delete objectName[index];
delete property; // esta forma es posible solo con una declaración with

Donde objectName es el nombre de un objeto, property el nombre de una propiedad, e index un entero que representa la localización de un elemento en un array.

The fourth form is legal only within a with statement, to delete a property from an object.

Puedes usar el operador delete para eliminar aquellas variables que han sido declaradas implicitamente, pero no aquellas que han sido declaradas con var

Si la operación delete finaliza con éxito, estable una propiedad o elemento a undefined. El operador delete devuelve true si la operación ha sido posible y false en caso contrario

x = 42;
var y = 43;
myobj = new Number();
myobj.h = 4;    // create property h
delete x;       // returns true (puede eliminar si se declaro implicitamente)
delete y;       // returns false (no puede eliminar si se declaro con var)
delete Math.PI; // returns false (no puede eliminar propiedas predefinidas)
delete myobj.h; // returns true (puede eliminar propiedades definidas por el usuario)
delete myobj;   // returns true (puede eliminar si se ha declarado implicito)
Eliminado elemento de array

Cuando elimina un elemento de un array no afecta a el tamaño del array. Por ejemplo, si elimina a[3], a[4] siguen existiendo los elementos a[4] y a[3]  pero su valor es undefined.

When the delete operator removes an array element, that element is no longer in the array. In the following example, trees[3] is removed with delete. However, trees[3] is still addressable and returns undefined.

Cuando el operador delete elimina un elemento de un array, este elemento no aparece mas en el array. En el siguiente ejemplo, trees[3] es eliminado con delete. Sin embargo, trees[3] sigue siendo accesible y devuelve undefined.

var trees = new Array("redwood", "bay", "cedar", "oak", "maple");
delete trees[3];
if (3 in trees) {
  // Esto no se ejecutará
}

Si desea que un elemento de un array exista, pero no tenga un valor undefined, debe asignar el valor undefined en vez de usar el operador delete. En el siguiente ejemplo a trees[3] se le asigna un valor undefined, pero el elemento del array sigue existiendo

var trees = new Array("redwood", "bay", "cedar", "oak", "maple");
trees[3] = undefined;
if (3 in trees) {
  // Este trozo si se ejecutará
}

in

The in operator returns true if the specified property is in the specified object. The syntax is:

propNameOrNumber in objectName

where propNameOrNumber is a string or numeric expression representing a property name or array index, and objectName is the name of an object.

The following examples show some uses of the in operator.

// Arrays
var trees = new Array("redwood", "bay", "cedar", "oak", "maple");
0 in trees;        // returns true
3 in trees;        // returns true
6 in trees;        // returns false
"bay" in trees;    // returns false (you must specify the index number,
                   // not the value at that index)
"length" in trees; // returns true (length is an Array property)

// Predefined objects
"PI" in Math;          // returns true
var myString = new String("coral");
"length" in myString;  // returns true

// Custom objects
var mycar = {make: "Honda", model: "Accord", year: 1998};
"make" in mycar;  // returns true
"model" in mycar; // returns true

instanceof

The instanceof operator returns true if the specified object is of the specified object type. The syntax is:

objectName instanceof objectType

where objectName is the name of the object to compare to objectType, and objectType is an object type, such as Date or Array.

Use instanceof when you need to confirm the type of an object at runtime. For example, when catching exceptions, you can branch to different exception-handling code depending on the type of exception thrown.

For example, the following code uses instanceof to determine whether theDay is a Date object. Because theDay is a Date object, the statements in the if statement execute.

var theDay = new Date(1995, 12, 17);
if (theDay instanceof Date) {
  // statements to execute
}

new

You can use the new operator to create an instance of a user-defined object type or of one of the predefined object types Array, Boolean, Date, Function, Image, Number, Object, Option, RegExp, or String. On the server, you can also use it with DbPool, Lock, File, or SendMail. Use new as follows:

var objectName = new objectType([param1, param2, ..., paramN]);

You can also create objects using object initializers, as described in using object initializers.

See the new operator page in the Core JavaScript Reference for more information.

this

Use the this keyword to refer to the current object. In general, this refers to the calling object in a method. Use this as follows:

this["propertyName"]
this.propertyName

Example 1.
Suppose a function called validate validates an object's value property, given the object and the high and low values:

function validate(obj, lowval, hival){
  if ((obj.value < lowval) || (obj.value > hival))
    alert("Invalid Value!");
}

You could call validate in each form element's onChange event handler, using this to pass it the form element, as in the following example:

<B>Enter a number between 18 and 99:</B>
<INPUT TYPE="text" NAME="age" SIZE=3
   onChange="validate(this, 18, 99);">

Example 2.
When combined with the form property, this can refer to the current object's parent form. In the following example, the form myForm contains a Text object and a button. When the user clicks the button, the value of the Text object is set to the form's name. The button's onClick event handler uses this.form to refer to the parent form, myForm.

<FORM NAME="myForm">
Form name:<INPUT TYPE="text" NAME="text1" VALUE="Beluga"/>
<INPUT NAME="button1" TYPE="button" VALUE="Show Form Name"
   onClick="this.form.text1.value = this.form.name;"/>
</FORM>

typeof

The typeof operator is used in either of the following ways:

  1. typeof operand
    
  2. typeof (operand)
    

The typeof operator returns a string indicating the type of the unevaluated operand. operand is the string, variable, keyword, or object for which the type is to be returned. The parentheses are optional.

Suppose you define the following variables:

var myFun = new Function("5 + 2");
var shape = "round";
var size = 1;
var today = new Date();

The typeof operator returns the following results for these variables:

typeof myFun;     // returns "function"
typeof shape;     // returns "string"
typeof size;      // returns "number"
typeof today;     // returns "object"
typeof dontExist; // returns "undefined"

For the keywords true and null, the typeof operator returns the following results:

typeof true; // returns "boolean"
typeof null; // returns "object"

For a number or string, the typeof operator returns the following results:

typeof 62;            // returns "number"
typeof 'Hello world'; // returns "string"

For property values, the typeof operator returns the type of value the property contains:

typeof document.lastModified; // returns "string"
typeof window.length;         // returns "number"
typeof Math.LN2;              // returns "number"

For methods and functions, the typeof operator returns results as follows:

typeof blur;        // returns "function"
typeof eval;        // returns "function"
typeof parseInt;    // returns "function"
typeof shape.split; // returns "function"

For predefined objects, the typeof operator returns results as follows:

typeof Date;     // returns "function"
typeof Function; // returns "function"
typeof Math;     // returns "object"
typeof Option;   // returns "function"
typeof String;   // returns "function"

void

The void operator is used in either of the following ways:

  1. void (expression)
    
  2. void expression
    

The void operator specifies an expression to be evaluated without returning a value. expression is a JavaScript expression to evaluate. The parentheses surrounding the expression are optional, but it is good style to use them.

You can use the void operator to specify an expression as a hypertext link. The expression is evaluated but is not loaded in place of the current document.

The following code creates a hypertext link that does nothing when the user clicks it. When the user clicks the link, void(0) evaluates to undefined, which has no effect in JavaScript.

<A HREF="javascript:void(0)">Click here to do nothing</A>

The following code creates a hypertext link that submits a form when the user clicks it.

<A HREF="javascript:void(document.form.submit())">
Click here to submit</A>

Operator precedence

The precedence of operators determines the order they are applied when evaluating an expression. You can override operator precedence by using parentheses.

The following table describes the precedence of operators, from highest to lowest.

Table 3.7 Operator precedence
Operator type Individual operators
member . []
call / create instance () new
negation/increment ! ~ - + ++ -- typeof void delete
multiply/divide * / %
addition/subtraction + -
bitwise shift << >> >>>
relational < <= > >= in instanceof
equality == != === !==
bitwise-and &
bitwise-xor ^
bitwise-or |
logical-and &&
logical-or ||
conditional ?:
assignment = += -= *= /= %= <<= >>= >>>= &= ^= |=
comma ,

A more detailed version of this table, complete with links to additional details about each operator, may be found in JavaScript Reference.

Etiquetas y colaboradores del documento

Contributors to this page: fscholz, spachecojimenez, ricardochavarri
Última actualización por: ricardochavarri,
Ocultar la barra lateral