Está en la página 1de 26

Pretrabajo – LABORATORIA

Growth Mindset

Objetivos de aprendizaje:
Entender qué es Growth Mindset (mentalidad de crecimiento) y
adoptarla antes de empezar este curso.

Sobre Growth Mindset

Laboratoria es un programa increíble, que te enseña todo lo


que necesitas para iniciar tu carrera en el sector digital en
un periodo muy corto de tiempo. Seguramente te habrás
preguntado cómo podrás lograrlo, y la respuesta está
en aprender a aprender.

¿Alguna vez has leído o escuchado algo sobre Growth Mindset?


Al finalizar este módulo, esperamos que no sólo entiendas
este concepto, sino que adoptes una mentalidad de crecimiento
que te permita enfrentar los retos de aprender algo nuevo, y
tener la confianza de saber que podrás superarlos.

La mayoría de personas creen que la inteligencia es una


capacidad mental con la que nacemos, que es estática y que no
podemos cambiar. Esta creencia ocasiona que pensemos que
nuestra inteligencia tiene un límite, y que hay cosas qu e
simplemente no podremos aprender.
Sin embargo, diversas investigaciones sobre el cerebro y el
aprendizaje han demostrado que cada vez que aprendemos algo
nuevo nuestro cerebro cambia y crece. En otras palabras,
nosotras mismas tenemos el control para desarrollar y
expandir nuestra inteligencia.
Hace 30 años, Carol Dweck, una psicóloga estadounidense, se
planteó investigar y comparar cómo estas distintas creencias
podían causar que las personas obtuvieran diferentes
resultados al enfrentarse a un reto de aprendizaje. Después
de varias investigaciones, ella acuñó los términos Fixed
mindset y Growth mindset, es decir, mentalidad fija o
mentalidad de crecimiento, para describir a ambos tipos de
creencias.
A través de sus estudios en diferentes escuelas de E stados
Unidos, ella descubrió que cuando los estudiantes creen que
pueden lograr que su inteligencia se desarrolle, entonces
están dispuestos a esforzarse más, porque entienden que el
logro que alcanzarán será mejor y más grande.
Actualmente, los últimos avances en neurociencias han
mostrado que el cerebro es mucho más maleable de lo que
pensábamos. Las investigaciones en plasticidad neuronal
evidencian cómo la conectividad entre neuronas puede cambiar
con las experiencias que las personas van acumulando. C on
práctica, las redes neuronales van creciendo y creando nuevas
conexiones. Esto implica que tú puedes incrementar el
crecimiento de tus redes neuronales con acciones, como al
realizar preguntas, leer, practicar una y otra vez algo que
te resulta complicado, y manteniendo buenos hábitos de
alimentación y sueño.

Gracias a estos nuevos descubrimientos científicos, muchos


investigadores han comenzado a entender la conexión entre los
tipos de mentalidades y las posibilidades de alcanzar logros.
Los estudios de Carol Dweck han mostrado que si piensas que
tu cerebro puede crecer, entonces tu comportamiento es
distinto a si piensas que naciste con una inteligencia fija.
Por ejemplo, una estudiante con una mentalidad fija, estará
orientada a mostrar un desempeño perfecto, por lo que
preferirá realizar solo actividades que sabe que puede
lograr, para así verse siempre inteligente. En cambio, una
estudiante con una mentalidad de crecimiento, se sentirá
mucho más cómoda enfrentando retos que no necesariamente sabe
cómo lograr, porque sabe que estos desafíos le permitirán
aprender más.

Tener una mentalidad de crecimiento significa que entiendes


que puedes desarrollar e incrementar tu inteligencia y todas
tus habilidades, y que no tienes miedo a los retos. Significa
que sabes que la mejor manera de aprender se logra con
esfuerzo, y por ello estás dispuesta a cometer errores en el
proceso.

Desarrollando Growth Mindset


Verás que tu mentalidad puede variar, pues aunque quisiéramos
tener siempre una mentalidad de crecimient o, la realidad es
que tenemos que trabajar día a día y en cada situación
desafiante para mantenerla. Lo importante es poder reconocer
y detectar cuándo estamos teniendo elementos de una
mentalidad fija, para luego reflexionar y encontrar
estrategias para cambiar. La siguiente imagen resume algunas
de las diferencias entre ambas mentalidades, y te ayudará a
identificar cómo mejorar:
Growth Mindset en Laboratoria
Antes de pasar al siguiente módulo queremos darte algunos
consejos para tu proceso de aprendizaje:
1. El aprendizaje es mejor y perdura más cuando necesitas
esforzarte más. Los aprendizajes fáciles se recuerdan hoy,
pero no mañana. Cuando el aprendizaje es más difícil, es más
fuerte y se queda en tu memoria más tiempo.
2. Tratar de resolver un problema antes de que te muestren cómo
hacerlo, te permitirá luego aprender y entender mejor la
solución que te enseñen.
3. Cometer errores y corregirlos es lo que te permitirá
construir los puentes para avanzar en el proceso de
aprendizaje.
Con todos estos conocimientos que has adquirido y con tu
nueva mentalidad, te proponemos aceptar este reto: Aprender a
programar para transformar tu futuro.

¿Por qué aprender a programar?

Objetivos de aprendizaje:
 Entender qué es la programación y por qué aprender a
programar.
 Entender qué es JavaScript y por qué aprenderlo.
 Conocer algunas historias de egresadas de Laboratoria.
El texto a continuación es una traducción al español, con
ciertos ajustes, del capítulo 1 de JavaScript for kids, Nick
Morgan, 2015.

¿Qué es la programación?

Las computadoras son máquinas increíblemente poderosas,


capaces de realizar hazañas increíbles, como jugar ajedrez
competitivo, servir miles de páginas web o hacer millones de
cálculos complejos en menos de unos segundos. Recientemente,
las computadoras se están utilizando para crear automóviles
autónomos (que se manejan solos), mundos enteros d e realidad
virtual y robots con inteligencia artificial.

Pero en el fondo, las computadoras son realmente bastante


tontas. Las computadoras sólo pueden hacer exactamente lo que
nosotros, los humanos, les digamos. Les decimos cómo
comportarse usando programas de computación, que son
simplemente un conjunto de instrucciones para que las
computadoras sigan. Sin programas, ¡las computadoras no
pueden hacer nada! La programación es, por lo tanto, el arte
de crear un conjunto de instrucciones que le indica n a una
computadora cómo realizar una tarea.
¿Por qué aprender a programar?

La programación es un espacio para crear. Es una forma de


expresión, así como el arte y el diseño. Es un mecanismo para
transformar tus pensamientos en algo vivo que todo el mundo
puede ver y con el cual puedan interactuar. Como dijo, Steve
Jobs, uno de los gigantes del mundo tech:

“Todo el mundo en este país debería aprender a programar una


computadora, porque te enseña a pensar” — Steve Jobs
La programación se ha vuelto tan importante, que se encuentra
entre las carreras más demandadas por el mercado. Te damos
tres datos del mercado de trabajo para programadores:
1. Programador de software es la carrera que tendrá mayor
crecimiento en la próxima década en América Latina. Según
estimaciones, la región va a tener una necesidad de 1.25
millones de programadores hacia 2025.
2. Desarrolladores web y desarrolladores de software se
encuentran dentro de las profesiones mejor pagadas en América
Latina.
3. Los empleos tech ya no sólo se encuentran en el sector tech.
En la actualidad 2 de cada 3 empleos tech se encuentran fue ra
del sector. Ello significa que la programación abre las
puertas para trabajar en diferentes sectores y aportar tu
talento al desarrollo de distintas industrias.

¿Qué es JavaScript?

Las computadoras son tan tontas que no podemos darle nuestras


instrucciones en inglés, español o cualquier otro idioma
hablado. Tenemos que escribir nuestros programas en
un lenguaje de programación. JavaScript es justamente eso: un
lenguaje de programación.
Puede que no hayas oído hablar de JavaScript antes, pero
ciertamente lo has usado. JavaScript se utiliza para escribir
programas que se ejecutan en páginas web. JavaScript puede
controlar cómo se ve una página web o hacer que la página
responda cuando un usuario hace click en un botón o mueve el
mouse. Sitios como Gmail, Facebook y Twitter usan JavaScript
para facilitar el envío de correo electrónico, publicar
comentarios o navegar por sitios web.

¿Por qué JavaScript?

JavaScript no es el único lenguaje de programación que existe


- de hecho, hay literalmente cientos de lenguajes de
programación. Pero hay muchas razones para aprender
JavaScript. Por un lado, es mucho más fácil (y más divertido)
de aprender que muchos otros lenguajes de programación. Pero
tal vez lo mejor de todo es que para escribir y ejecutar
programas JavaScript, lo único que se necesita es un
navegador web. Un navegador web es lo que utilizas para
navegar por internet. Por ejemplo, lo que utilizas para abrir
Facebook o Google o Wikipedia en tu computadora. Los
navegadores más populares son: Google Chrome, Safari, Mozilla
Firefox e Internet Explorer. Cada navegador web viene con
un intérprete JavaScript que entiende cómo leer programas
JavaScript.

Otra razón que hace interesante estudiar JavaScript en este


momento es su posición como uno de los lenguages de
programación más populares. Según GitHub, una red de trabajo
colaborativo para programadores, JavaScript es el lenguaje
más popular dentro de esta plataforma:
Historia de JavaScript

JavaScript fue creado (¡en solo 10 días!) por Brendan Eich,


en 1995, para crear interactividad y dinamismo en Netscape
Navigator, uno de los primeros navegadores web. Desde
entonces, JavaScript ha sido adoptado por la mayoría de los
navegadores modernos (piensa en Chrome, Safari, etc.). Y por
muchos años JavaScript fue utilizado únicamente dentro del
navegador. Sin embargo, hoy en día se utiliza JavaScript
también fuera del navegador para crear cualquier tipo de
cosas. Las aplicaciones de JavaScript son casi infinitas - lo
cual lo hace un excelente lenguaje de programación que
aprender.

Escribiendo JavaScript en la web

Seguramente te estás preguntando cómo es eso de tener


un intérpreteJavaScript en el navegador. Pues, la mejor forma
de aprender es haciendo: abre tu navegador Chrome y sigue los
pasos que presenta Michelle en el siguiente video. Michelle
te mostrará cómo escribir JavaScript y cómo hacer cosas
geniales desde tu computadora, únicamente utilizando el
navegador.
JavaScript != Java

Última nota final sobre el contexto de JavaScript como


lenguaje de programación: JavaScript no es lo mismo que Java.
Java es otro lenguaje de programación. Mucha gente los
confunde. Tú no :)

Tu primer sitio web

Objetivos de aprendizaje:
 Entender la función del HTML para crear la estructura básica
de una página web.
 Conocer los principales elementos y etiquetas HTML.
 Aprender a darle dinamismo a una web utilizando JavaScript.
 Tener un primer acercamiento al mundo del código, creando tu
primera página web.
El texto a continuación es una traducción al español, con
ciertos ajustes, del capítulo 5 de JavaScript for kids, Nick
Morgan, 2015; y de Eloquent JavaScript, de Marijn Haverbeke,
2014.

HTML: HyperText Markup Language


La consola de JavaScript que hemos utilizando hasta ahora es
ideal para probar pequeños fragmentos de código. Sin embargo,
para crear programas reales, necesitaremos algo más flexible,
como una página web. En esta sección aprenderás cómo crear
una página web HTML básica y darle interacción con
JavaScript.

HTML (HyperText Markup Language) es el lenguaje utilizado


para crear la estructura de una página web. Para crear una
web, se empieza creando un documento en formato HTML. Esto es
muy parecido a crear un documento con formato word, excel o
powerpoint.

Un documento HTML simple se ve así (no te asustes si no


entiendes todo lo que dice, te lo explicaremos paso a paso
más abajo):
<!DOCTYPE html>
<html>
<head>
<title>Mi primera web</title>
</head>
<body>
<h1>¡Hola Mundo!</h1>
<p>Esta es mi primera web</p>
</body>
</html>

Al abrir este mismo documento HTML en un navegador (como


Chrome), se ve lo siguiente:

El navegador "lee" el archivo HTML (el texto y las etiquetas


que están adentro) y las presenta según las reglas del
lenguaje. Por ejemplo, los textos que están dentro de las
etiquetas <h1> </h1> son considerados encabezados o
titulares, mientras que los textos dentro de las
etiquetas <p> </p> son considerados párrafos. Por eso, el
texto ¡Hola Mundo! se visualiza mucho más grande que el
texto Esta es mi primera web.
Crea tu primera web
Como ya lo dijimos, la mejor manera de aprender es haciendo .
Por eso, es hora de que tú misma crees una web y aprendas
HTML.
Michelle te explica por qué necesitarás un editor de texto
para los ejercicios:
En el siguiente video, Michelle te guiará a través de los
siguientes pasos para que crees tu primera web:
1. Descarga Atom, un editor de texto: Descargar. Si tienes
problemas descargando Atom, puedes descargar otro editor de
texto llamado Sublime Text, hay versión para Mac y Windows.
Ten en cuenta que las explicaciones que te dará Michelle,
estarán en Atom pero tú podrás hacer lo m ismo en Sublime
Text. Descarga Sublime aquí
2. Crea un documento HTML llamado index.html
3. Agrega algunos elementos al documento HTML (por ejemplo: un
título y un párrafo)
4. Guarda el documento HTML
5. Abre el documento HTML en un navegador como Chrome

Etiquetas y elementos HTML


Los documentos HTML se componen de elementos. Salvo algunas
excepciones (por ejemplo <!DOCTYPE html>), los elementos
comienzan con una etiqueta de inicio y terminan con
una etiqueta de fin. Por ejemplo, en nuestro documento
tenemos el elemento p, que comienza con la etiqueta de
inicio <p> y termina con la etiqueta de finalización </p>. El
texto que se encuentra entre las etiquetas de apertura y de
cierre es el contenido del elemento.
El elemento p (párrafo) como ejemplo:

Hagamos un recorrido por todos los elementos de nuestro


documento:
1. El documento empieza con la etiqueta <!DOCTYPE html> (que
como vimos, no tiene inicio o cierre). Su función es hacerle
saber al navegador que interprete el documento como
HTML moderno, en contraposición a varios dialectos que
estaban en uso en el pasado.
2. Luego viene la etiqueta de apertura <html> (la etiqueta de
cierre </ html> está al final). Por estándar, todos los
documentos HTML deben tener un elemento html que "englobe"
todo lo demás.
3. Dentro del elemento html hay dos elementos: el head (cabeza
en Español) y el body (cuerpo en Español). El head contiene
información sobre el documento, y el body contiene el
documento en sí.
4. Dentro del elemento head está el elemento title (con su
etiqueta de inicio y de cierre), que contiene el título del
documento. Es por eso que al visualizar el archivo en el
navegador, el título en la pestaña del navegador dice: "Mi
primera web". Es importante que notemos que el
elemento title está contenido dentro del elemento head; el
cual, a su vez, está contenido dentro del elemento html.
5. Finalmente, tenemos el elemento body (entre su etiqueta de
inicio y de cierre) que contiene el contenido que se mostrará
en el navegador. En este caso, dentro del body tenemos dos
elementos adicionales: el h1 (encabezado) y el p(párrafo).
Existen muchos más elementos y etiquetas HTML, que aprenderás
en su momento. Por el momento, es hora de regresar a
JavaScript.
HTML y JavaScript
Es importante que entiendas que HTML no es un lenguaje de
programación; es un lenguaje de marcado de texto. Como hemos
visto, con HTML le damos una estructura a nuestra página. Sin
embargo, si queremos darle comportamiento o interacción a
nuestra web, necesitamos usar un lenguaje de programación. Y
el único lenguaje de programación para correr en los
navegadores web es JavaScript. Con JavaScript logramos que
las páginas web puedan responder a las acciones de usuario,
volviéndolas interactivas.
Para incluir JavaScript en un documento HTML puedes utilizar
el elemento script y colocar tu código JavaScript entre sus
etiquetas de inicio (<script type="text/javascript">) y
cierre (</script>), tal como lo muestra el siguiente ejemplo:

<!DOCTYPE html>
<html>
<head>
<title>Mi primera web</title>
</head>
<body>
<h1>¡Hola Mundo!</h1>
<p>Esta es mi primera web</p>

<script type="text/javascript">
alert('¡Hola Mundo!');
</script>

</body>
</html>

Muchas veces tu código JavaScript es tan extenso que no


quieres que esté ubicado en el mismo documento HTML. Para
eso, la solución es crear un nuevo documento, esta vez de
formato JavaScript - utilizando la extensión .js - y
"linkear" ambos documentos a través del mismo
elemento script, de la siguiente manera:

<script src="nombre-del-documento.js"></script>
El mismo elemento script tiene un "atributo" llamado src (de
source, que significa fuente en inglés), al cual se le puede
asignar la ruta de tu documento JavaScript.

Añádele interacción a tu web


¡Ahora te toca a ti! Continúa con Michelle siguiendo los
pasos para agregarle interacción a tu página web:
Los pasos a seguir son:
1. Agrega el elemento script al final del body de tu documento
HTML
2. Dentro del mismo HTML, entre las etiquetas de inicio y cierre
del elemento script, escribe una línea de código JavaScript
(por ejemplo, algo con alert(), document.write() o prompt())
3. Guarda tu documento HTML
4. Refresca la página de tu navegador donde estás viendo tu
documento HTML
5. Ahora crea un nuevo documento llamado app.js en la misma
carpeta donde está tu HTML
6. Añádele el atributo src al elemento script con la ruta de tu
archivo app.js
7. Pasa todo el código JavaScript del documento HTML al
documento JS
8. Refresca la página del navegador y confirma que todo funciona
exactamente igual que antes
Aquí el video de Michelle:

Valores, tipos de datos y operadores

Objetivos de aprendizaje:
 Entender qué se entiende por values (valores) en JavaScript.
 Conocer los diferentes data types (tipos de datos) en
JavaScript.
 Aprender cómo combinar y transformar valores con operadores
en JavaScript.
El texto a continuación se basa en gran medida, con ciertos
ajustes, en el capítulo 1 de Eloquent JavaScript,de Marijn
Haverbeke, 2014. Traducción en Español disponible gracias
a hectorip.

Vivimos en un mundo de Data


En el 2010, el entonces CEO de Google, Eric Schmidt,
mencionaba que cada dos días creamos tanta data como lo
hicimos desde los inicios de la civilización hasta el 2003.
Las compras que haces son data, tus notas en el colegio son
data, tu perfil de Facebook está minado de data. Tus
búsquedas en Google, las señales de GPS de tu celular, los
videos que miras y subes a YouTube, las imágenes que ves en
Instagram, los registros del clima, los corrreos electrónicos
... todo eso es data!
La data es crucial porque nos ayuda a tomar decisiones y a
entender el mundo que nos rodea. La data es información, la
información es conocimiento, y el conocimiento se traduce en
mejores decisiones. Desde decisiones simples, como elegir un
lugar para almorzar en base a los reviews de Yelp; hasta
decisiones complejas, como predecir si una mujer está
embarazada, según su historial de compra en un hipermercado .

Tipos de datos
Las computadoras son un gran recurso para trabajar con
grandes cantidades de datos. De hecho, en el mundo de l as
computadoras solo existen datos. Con las computadores podemos
leer data, modificar data y crear nueva data. Toda la data es
almacenada como secuencias largas de los famosos bits - esas
secuencias de unos y ceros que viste en Matrix.
Las computadoras manejan billones de bits. Para hacer más
fácil el manejo de grandes cantidades de bits, los podemos
dividir en "pedazos" que representan piezas de información.
En un entorno JavaScript, estos pedazos son
llamados values (valores en español). Cada value tiene
un data type (tipo de dato) que determina su rol. En
JavaScript existen cinco (5) tipos de datos primitivos:
1. numbers (números).
2. strings (cadenas).
3. booleans (booleanos).
4. undefined (indefinido).
5. null (nulo).
La data y los tipos de datos forman las bases de cualquier
lenguaje de programación. Nos permiten organizar información
y determinar cómo correr el programa. En esta lección
aprenderás a definir y manipular estos tipos de datos.

1. Numbers
Los values de tipo number son, sin sorpresa alguna, valores
numéricos. Es decir, pedazos de data que representan
información numérica se representan con el tipo number. Esto
incluye números positivos, negativos, enteros y decimales.
Además,el tipo de datos number tiene tres valores simbólicos:
+Infinity, -Infinity y NaN (no-un-número).
Veamos varios ejemplos. Abre tu consola (recuerda que lo
haces haciendo click con el botón derecho del mouse ->
inspect -> console) y escribe los siguientes números. Al
hacerlo, la consola te lo regresa el número de vuelta.
13
// returns > 13

-9.81
// returns > -9.81
También puedes hacer uso de la notación científica para
números muy grandes o muy pequeños, añadiendo una "e" de
"exponente", seguido por el exponente del número:
5e10
// returns > 50000000000

-2.998e8
// returns > -299800000

Operadores Aritméticos
Lo principal que se hace con los números es aritmética.
Sigamos explorando el comportamiento del tipo de
dato numbers en tu consola. Escribe el siguiente ejemplo en
tu consola y confirma que tienes el mismo resultado:
100 + 4 * 11
// returns > 144
Los símbolos + y * son llamados operators (operadores). El
primero representa la suma y el segundo la multiplicación. Al
poner un operador entre dos valores, se aplicará la operación
a esos valores y producirá un nuevo valor. Como ves, la
multiplicación ocurre primero. Pero como en matemáticas,
puedes cambiar esto encerrando en paréntesis la suma.
(100 + 4) * 11
// returns > 1144
Para la resta existe el operador -, y la división se puede
hacer con el operador /. Veamos más ejemplos (recuerda
hacerlos en tu consola también!):
12345 / 250
// returns > 49.38

1234 + 57 * 3 - 31 / 4
// returns > 1397.25

100 / 0
// returns > Infinity

100 / -0
// returns > -Infinity

1000 * Infinity
// returns > Infinity

0/0
// returns > NaN

Infinity - Infinity
// returns > NaN
También existe un operador aritmético más, que podrías no
reconocer inmediatamente. El símbolo % es usado para
representar la operación residuo. X % Y resulta en el residuo
de dividir X entre Y. Por ejemplo, 314 % 100 produce 14
(porque 100 multiplicado por 3 + 14 = 314), y 144 % 12 da 0
(porque 12 multiplicado por 12 + 0 = 144). Verás a menudo
este operador referido como módulo, aunque técnicamente
residuo es más preciso.
5 % 3
// returns > 2

7 % 2
// returns > 1

2. Strings
El siguiente data type básico son los strings. Es el tipo de
dato que utilzamos para representar texto. Se declaran al
poner el contenido entre comillas.
Abre tu consola y escribe lo siguiente:

"Hola, mi nombre es Michelle"


// returns > "Hola, mi nombre es Michelle"

'Soy desarrolladora web'


// returns > "Soy desarrolladora web"

"123"
// returns > "123"

Tanto las comillas simples como las dobles pueden ser usadas
para declarar strings, siempre y cuando coincidan al
principio y al final. Casi cualquier cosa puede colocarse
entre comillas, y JavaScript creará un string value de esa
cosa.
Existen un par de caracteres en los data types strings que
tienen un comportamiento especial. Por ejemplo, cuando una
diagonal invertida ("\") se encuentra dentro de un texto
entre comillas, indica que el carácter siguiente tiene un
significado especial. Esto se denomina escapar el carácter.
Cuando el carácter n sigue a una diagonal invertida, se
interpreta como una nueva línea. Similarmente, una t después
de la diagonal invertida significa un tab. Escribe los
siguientes textos en tu consola (recuerda siempre colocarlos
entre comillas, sean simples o dobles).

"Esta es la primera línea \n Y esta la segunda"


// returns > "Esta es la primera línea
// Y esta la segunda"

'Mi lenguaje favorito es \t JavaScript'


// retuns > "Mi lenguaje favorito es JavaScript"

Cuando una comilla es precedida por una diagonal invertida,


la comilla no terminará la cadena sino que será parte de
ella.

"Yo \"estudio\" en Laboratoria"


// returns > "Yo "estudio" en Laboratoria"

Existen, por supuesto, situaciones en las que querrás que una


diagonal invertida sea sólo eso en una cadena de texto, no un
código especial. Si dos diagonales invertidas están juntas,
se volverán una, y sólo eso quedará como resultado en el
valor de la cadena.

"Un carácter de nueva línea es escrito \"\\n\"."


// returns > "Un carácter de nueva línea es escrito " \n"."

Las cadenas de texto no pueden ser divididas numéricamente,


multiplicadas, o restadas, pero el carácter + puede ser usado
en ellas. No suma, sino que concatena; pega dos strings. La
siguiente línea produce el string "concatenar":

"con" + "cat" + "e" + "nar"


// returns > "concatenar"
Ten cuidado mezclando operaciones entre numbers y strings.
Por ejemplo, multiplicar un number por un string resulta en
NaN.

"hola" * 3
// returns > NaN

Hay más maneras de manipular strings, que veremos más


adelante.

Operadores Unarios
No todos los operadores son símbolos. Algunos son escritos
como palabras. Un ejemplo es el operador typeof, que produce
una cadena de texto que representa el tipo del valor que le
pasaste.

typeof 4.5
// returns > "number"

typeof "hola"
// returns > "string"

typeof NaN
// returns > "number"

typeof Infinity
// returns > "number"

Fíjate que verificamos que NaN e Infinity son del


tipo number (de valor simbólico), tal como lo mencionamos
anteriormente.

Los otros operadores que hemos visto operaban sobre dos


valores, pero typeof sólamente toma uno. Los operadores que
usan dos valores son llamados operadores binarios, mientras
que aquellos que sólo toman uno son llamados
operadores unarios.
El operador menos puede usar tanto como operador binario como
operador unario.

- (10 - 2)
// returns > -8

3. Booleans
A menudo, necesitarás un valor que simplemente distinga entre
dos posibilidades, como "sí" y "no" o "encendido" y
"apagado". Para esto, JavaScript tiene un tipo de
dato boolean, que tiene sólo dos valores: true (verdadero)
y false(falso).

Operadores comparativos
Realiza esta comparación en tu consola:

3 > 2
// returns > true

2 < 3
// returns > false

typeof (3 > 2)
// returns > "boolean"

typeof (2 > 3)
// returns > "boolean"

Los signos > y < son los símbolos tradicionales para "es
mayor que" y "es menor que", respectivamente. Estos son
operadores binarios (porque opera sobre dos valores).
Aplicarlos resulta en un valor de tipo boolean que indica si
son ciertos.
Los strings pueden ser comparados de la misma manera.

"Aardvark" < "Zoroaster"


// returns > true

La manera en que los strings son ordenadas es más o menos


alfabéticamente: las letras mayúsculas son siempre "menores"
que las minúsculas, así que "Z" < "a" es true, y los
caracteres no alfabéticos (!, -, y así por el estilo) son
también incluidos en el ordenamiento.La comparación real está
basada en el estándar Eloquent Unicode.

"Zeyla" < "ana"


// returns > true

"Zeyla" < "!na"


// returns > false

Otros operadores similares son >= (mayor o igual que), <=


(menor o igual que), == (igual que), y != (no es igual que).

"Itchy" == "Itchy"
// returns > true

"Itchy" != "Scratchy"
// returns > true

5 == 5
// returns > true

10 != "diez"
// returns > true

Sólo existe un valor en JavaScript que no es igual a sí


mismo, y este es NaN, que significa "no es un número".

NaN == NaN
// returns > false

La intención de NaN es representar el resultado de un cálculo


sin sentido y como tal, no es igual al resultado de cualquier
otro cálculo sin sentido.

Operadores Lógicos
Hay también algunas operaciones que pueden ser aplicadas a
los valores Booleans. JavaScript soporta tres operadores
lógicos: and, or y not. Estos pueden ser usados para
"razonar" con los Booleans.
El operador && representa la operación lógica and ("y"). Es
un operador binario, y su resultado es true (verdadero) sólo
si los dos valores dados son verdaderos. El
operador || denota la operación lógica or ("o"). Devuelve
verdadero si cualquiera de los dos valores dados es
verdadero. Not (Negación) es escrito como un símbolo de
admiración !. Es un operador binario que voltea el valor que
se le de; !true produce false y !false produce true. Veamos
unos ejemplos:

true && true


// returns > true

true && false


// returns > false

false && false


// returns > false

true || true
// returns > true

true || false
// returns > true

!true
// returns > false

!false
// returns > true

El último operador lógico del que aprenderás no es unario, ni


binario, sino ternario, opera en tres valores. Este es
escrito con un símbolo de interrogación y dos puntos, como
sigue:

true ? 1 : 2
// returns > 1

false ? 1 : 2
// returns > 2
Este es llamado el operador condicional (o algunas veces el
operador tenario dado que es el único operador de este tipo
en el lenguaje). El valor a la izquierda del signo de
interrogación "escoge" cuál de los otros dos valores
resultará. Cuando es verdadero, el valor central es escogido,
y cuando es falso, el valor de la derecha se da como
resultado.

4. Null y undefined
Existen dos valores especiales, escritos null y undefined,
que son usados para denotar la ausencia de un valor
significativo. Son valores en sí mismos, pero no poseen
ninguna información. Muchas operaciones en el lenguaje que no
producen un valor con significado (lo verás después)
producen undefinedsimplemente porque tienen que producir
algún valor.
La diferencia en el significado entre undefined y null es un
accidente del diseño de JavaScript, y no importa la mayoría
del tiempo.

Conversión automática de tipo


Cuando un operador es aplicado al tipo "incorrecto" de valor,
JavaScript convertirá silenciosamente el valor en el tipo de
dato que espera, usando un conjunto de reglas que a menudo no
son lo que tú quieres o esperas. Esto es llamado coerción de
tipo. Mira estos ejemplos:

8 * null
// returns > 0

"5" - 1
// returns > 4

"5" + 1
// returns > 51

"cinco" * 2
// returns > NaN

false == 0
// returns > true

El null en la primera expresión se vuelve 0, y el "5" en la


segunda expresión se convierte en 5 (de string a number). Aún
así, en la tercera expresión, + intenta hacer concatenación
de strings antes de una suma numérica, así que el 1 es
convertido en "1" (de number a string). Cuando algo que no se
corresponde con un número de manera obvia (como "cinco" o
undefined) es convertido a un número, el valor resultante es
NaN. Las siguientes operaciones aritméticas sobre NaN
seguirán produciendo NaN. Por eso, en la cuarta expresión,
"cinco" * 2 retorna NaN.

En el caso de la quinta expresión, cuando comparamos valores


que tienen tipos de dato diferentes, JavaScript usa un
complicado y confuso conjunto de reglas para determinar qué
hacer. En la mayoría de los casos, sólo trata de convertir
uno de los valores al tipo de dato del otro valor. Sin
embargo, cuando null o undefined están en cualquier lado de
la operación, resulta verdadero sólo en el caso de qu e los
dos lados sean null o undefined.

Siguiendo con la quinta expresión, las reglas para convertir


cadenas y números a Booleanos dicen que 0, NaN y la cadena
vacía ("") cuentan como false, mientras que todos los demás
valores cuentan como true. Debido a esto, las siguientes
expresiones retornan true:

false == 0
// returns > true

"" == 0
// returns > true
Para casos en el que no quieres que ocurra ninguna conversión
automática de tipos, existen dos operadores extra: === y ! ==.
El primero prueba si un valor es precisamente igual a otro, y
el segundo si no es precisamente igual. Por lo tanto, al
cambiar de == a === las mismas expresiones anteriores,
tenemos el resutado contrario: false:

false === 0
// returns > false

"" === 0
// returns > false

También podría gustarte