Funciones Propias de JavaScript:

Output:

document.
document.getElementById('IdEtiqueta').propiedad =
document.getElementById('demo').innerHTML = cambia contenido etiqueta
document.getElementById('myImage').src = cambia src de la etiqueta
document.getElementById('demo').style.fontSize='35p = cambia estilo css

document.write(‘mensaje’); //imprime un mensaje en el documento

window.alert(‘mensaje’). //nos da un ventanazo de alerta
console.log(‘mensaje’); //muestra un mensaje en la consola

Sintaxis:

 Decalarando variable
var x, y, z;
x = 5;
y = 6;
z = x + y;

 Strings are text, written within double or single quotes:

"John Doe"
‘John Doe’

 Concatenar

"John" + " " + "Doe";

 El tipo de sintaxis es
CamelCase.

 Peculiar:
var y = 123e5; // 12300000
var z = 123e-5; // 0.00123

var x = 16 + 4 + "Volvo"; //20Volvo

var x = "Volvo" + 16 + 4; //Volvo164
var answer = "It's alright"; // Single quote inside double quotes
var answer = "He is called 'Johnny'"; // Single quotes inside double quotes
var answer = 'He is called "Johnny"'; // Double quotes inside single quotes

var x1 = 34.00; // Written with decimals 34

var x2 = 34; // Written without decimals 34

var person = {firstName:"John",

lastName:"Doe",
Age: 50,
eyeColor:"blue"
};
//para imprimir
//document.getElementById("demo").innerHTML = person.firstName + " is " +
person.age + " years old.";

_______________________________________________________________________________
var person = {firstName:"John", lastName:"Doe", age:50, eyeColor:"blue"};
person = null; // Now value is null, but type is still an object
var person = {firstName:"John", lastName:"Doe", age:50, eyeColor:"blue"};
person = undefined; // Now both value and type is undefined
______________________________________________________________________________________

Keywords and Description:

break Terminates a switch or a loop

continue Jumps out of a loop and starts at the top

debugger Stops the execution of JavaScript, and calls (if available) the
debugging function

do ... while Executes a block of statements, and repeats the block, while a
condition is true

for Marks a block of statements to be executed, as long as a

condition is true

function Declares a function

 if/else/ Marks a block of statements to be executed, depending on a
elseif condition

return Exits a function

switch Marks a block of statements to be executed, depending on

different cases

try ... catch Implements error handling to a block of statements

var Declares a variable

Comentarios:

/*
esto es un comentario multilinea en javascript
*/

// esto es un comentario de una sola línea en jascript

Operadores:

JavaScript Arithmetic Operators

Operator Description

+ Addition

- Subtraction

* Multiplication

/ Division
 % Modulus (Remainder)

++ Increment

-- Decrement

JavaScript Type Operators

Operator Description

typeof Returns the type of a variable

instanceof Returns true if an object is an instance of an object

type

JavaScript Assignment Operators

Operator Example Same As

= x=y 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

JavaScript Comparison Operators

Operator Description

== equal to

=== equal value and equal type

!= not equal

!== not equal value or not equal type

> greater than

< less than

>= greater than or equal to

<= less than or equal to

 ? ternary operator

Operador de cadena en JS:

Es el signo de +

JavaScript Bitwise Operators

Operator Description Example Same as Result Decimal

& AND 5&1 0101 & 0001 0001 1

| OR 5|1 0101 | 0001 0101 5

~ NOT ~5 ~0101 1010 10

^ XOR 5^1 0101 ^ 0001 0100 4

<< Zero fill left shift 5 << 1 0101 << 1 1010 10

>> Signed right shift 5 >> 1 0101 >> 1 0010 2

>>> Zero fill right shift 5 >>> 1 0101 >>> 1 0010 2

 JavaScript Operator Precedence Values:

Value Operator Description Example

19 () Expression grouping (3 + 4)

18 . Member person.name

18 [] Member person["name"]

17 () Function call myFunction()

17 new Create new Date()

16 ++ Postfix Increment i++

16 -- Postfix Decrement i--

15 ++ Prefix Increment ++i

15 -- Prefix Decrement --i

15 ! Logical not !(x==y)

15 typeof Type typeof x

14 * Multiplication 10 * 5

14 / Division 10 / 5

14 % Modulo division 10 % 5

14 ** Exponentiation 10 ** 2

13 + Addition 10 + 5

13 - Subtraction 10 - 5

12 << Shift left x << 2

12 >> Shift right x >> 2

12 >>> Shift right (unsigned) x >>> 2

11 < Less than x<y

11 <= Less than or equal x <= y

11 > Greater than x>y

11 >= Greater than or equal x >= y

10 == Equal x == y

10 === Strict equal x === y

10 != Unequal x != y

10 !== Strict unequal x !== y

6 && Logical and x && y

5 || Logical or x || y

3 = Assignment x=y

3 += Assignment x += y

3 -= Assignment x -= y

3 *= Assignment x *= y

3 %= Assignment x %= y

3 <<= Assignment x <<= y

3 >>= Assignment x >>= y

3 >>>= Assignment x >>>= y

3 &= Assignment x &= y

3 ^= Assignment x ^= y

3 |= Assignment x |= y
Tipos de Datos:

 string
 number
 boolean
 undefined
 function
 object

// nota null es de tipo objeto

/*

typeof undefined // undefined

typeof null // object

null === undefined // false

null == undefined // true

*/

typeof "John" // Returns "string"

typeof 3.14 // Returns "number"
typeof true // Returns "boolean"
typeof false // Returns "boolean"
typeof x // Returns "undefined" (if x has no value)
typeof {name:'John', age:34} // Returns "object"
typeof [1,2,3,4] // Returns "object" (not "array", see note below)
typeof null // Returns "object"
typeof function myFunc(){} // Returns "function"

Objetos, propiedades y métodos sintaxis:

<script>
var person = {
firstName: "John",
lastName : "Doe",
id : 5566,
fullName : function() {
return this.firstName + " " + this.lastName;
}
};

document.getElementById("demo").innerHTML = person.fullName;
</script>

//function () { return this.firstName + " " + this.lastName; }

Creando objetos: var y = new String("John");

Funciones:

<script>
var x = myFunction(4, 3);
document.getElementById("demo").innerHTML = x;

function myFunction(a, b) {
return a * b;
}
</script>

Scope:

Modelo 1
// code here can not use carName
function myFunction() {
var carName = "Volvo";
// code here can use carName}

Modelo 2
var carName = " Volvo";
// code here can use carName
function myFunction() { // code here can use carName }

Modelo 3
myFunction();
// code here can use carName
function myFunction() { carName = "Volvo";}

Modelo 4
var carName = "Volvo";
// code here can use window.carName
document.getElementById("demo").innerHTML = "I can display " + window.carName;

La propiedad THIS:
this.innerHTML = Date();
//escribe la fecha actual ej: Fri Dec 29 2017 22:03:12 GMT-0400 (Hora estándar de
Venezuela)

Funciones y métodos de JS:

Date() //despliega la fecha y hora
Texto.length //.length nos da el largo de la cadena de caracteres
Tupeof //devuelve el tipo de variable

Eventos en Javascript:

Mouse Events
Event Descripcion

onclick Ocurre al dar un click

oncontextmenu ¿?? Domina el menú contextual

(Solo funciona en firefox)

ondblclick Ocurre al dar dos clicks

onmousedown Ocurre al dar click y bajar en la pagina

onmouseenter Ocurre cuando estas sobre el elemento

onmouseleave Ocurre cuando deja de estar sobre el elemento

onmousemove Ocurre cuando el mouse se mueve sobre un

elemento en todo momento, EN TODO MOMENTO

onmouseover Ocurre cuando el mouse se mueve sobre un

elemento en todo momento, EN TODO MOMENTO o
sobre su HIJO

onmouseout Ocurre cuando el mouse deja de moverse sobre un

elemento en todo momento, EN TODO MOMENTO

onmouseup The event occurs when a user releases a mouse

button over an element