Funciones

Name: Funciones
Uploaded: 2018-08-30T20:55:00+00:00
Duration: 8 min 20 s
Description: Las funciones son fracciones de código reutilizable. En esta clase aprenderemos a definir e invocar nuestras funciones. Para definir una función utili

Clase 7 de 55 • Fundamentos de JavaScript 2018

Clase anteriorSiguiente clase

Resumen

Las funciones son fracciones de código reutilizable. En esta clase aprenderemos a definir e invocar nuestras funciones. Para definir una función utilizaremos la palabra reservada ““function””.

Delimitamos el cuerpo de la función usando llaves { }. Los parámetros de la función son variables que se pasan a la función escribíendolos entre paréntesis ()

Definir funciones nos sirve para reutilizar código. JavaScript es un lenguaje interpretado, esto quiere decir que intentará ejecutar el código sin importar si los parámetros que le pasemos a la función estén invertidos o incluso incompletos.

Diego Andrés Rojas González

student•

Si quieres saber el tipo de dato de tu variable puedes usar la función definida

typeof()

Carlos Ariel Chávez Maciel

student•

Buen aporte. Gracias.

Samuel Garcia

student•

Genial 😃

Lissette Johana Garzón Cortés

student•

Notas de la clase

/**
 * Las funciones son pedazos de codigo 
 * reutilizables 
 * 
 * Para declarar una funcion se emplea la 
 * palabra reservada function
 * 
 * function nombreFuncion (parametros)
 * {
 *    cuerpo de la funcion, cod reutilizable
 * }
 */

 var nombre = 'Sacha', edad = 28

 function imprimirEdad(){
    console.log(`${nombre} tiene ${edad} años`)
 }

 imprimirEdad()

 function imprimirEdad2(n, e){
    console.log(`${n} tiene ${e} años`)
 }
 imprimirEdad2(nombre, edad)
 imprimirEdad2('Paula', 54)
 imprimirEdad2('Carlos', 23)
 
 //Si una función la creamos con parametros
 //Pero no se los enviamos, no va a salir error
 //Intentará imprimir pero pondrá undefined en los
 //parametros que no ingresemos. Esto debido a
 // que js es debilmente tipado
 imprimirEdad2('Caro')
 imprimirEdad2()

Elián Dashiel Estévez Espinal

student•

¡Gracias!

Roberto Alessandro Castro Montoya

student•

Gracias

Joseph Williams Zamora Sampson

student•

Es importante recalcar la diferencia y la importancia de la comilla invertida comparada con la comilla simple. En general la comilla invertida nos permite mas eficiencia al tener que concatenar varias lineas de codigo o concatenar texto con variables. Por ejemplo: Comilla simple

function imprimirEdad(n,e){
    console.log(n + ' tiene '+ e + ' años')
}

Comilla invertida

function imprimirEdad(n,e){
    console.log(`${n} tiene ${e} años`)
}

Para agregar variables dentro de las comillas simplemente se utiliza la siguiente expresion ${variable}

Espero les sirva

Carlos Franco Benitez

student•

Gracias por tu aporte compañero ¡ No habia terminado de entender la diferencia entre ambos hasta que vi tu ejemplo. <3

Victor Andres Castillo Zambrano

student•

gracias

Matias Bloisi

student•

Para aquellos que no puedan utilizar la comilla invertida, pueden hacerlo con ALT + 96 `

Leandro Videla

student•

Hola! Deje un pequeño pero muy útil aporte.

Hay algo que se llamo “Parámetros por defecto”, y consiste en definir un valor de un parámetro por defecto. De esta manera cuando no suministremos algún parámetro a la función no vamos a tener un “undefined”. Les dejo el código:

var nombre = 'Sacha', edad = 28

function imprimirEdad(n, edad = 25){
	console.log(`${n} tiene ${e} años`)
}

imprimirEdad(nombre) // Sacha tiene 25 años

Alberto Camarena

student•

Buen aporte, solo hay un pequeño error en tu código al momento de poner como parámetro por defecto que la edad sea 25 pues escribiste “edad” y debió haber sido “e” como la variable que se imprimirá. De ese modo si no se escribe el parámetro “e” nuestro string pondrá 25 años por defecto y de ponerse este tendrá el valor de la variable.

var nombre = 'Sacha', edad = 28;

function imprimirEdad (n, e = 25){
	console.log(`${n} tiene ${e} años`);
}

imprimirEdad(nombre); //Sacha tien 25 años
imprimirEdad(nombre,edad); //Sacha tiene 28 años

Carlos Augusto Sánchez Seminario

student•

Hola a todos, tengo una consulta. ¿Alguien sabe como hacer las comillas invertidas con el teclado?.

Edgar Ivan Garrido

student•

Alt + 96 = `, código ascii

Ivan Sevilla

student•

Alt Gr + "la tecla donde esta la comila"

Dany Daniel Carrillo Jara

student•

<
/* 	Funcion: Devuelve las 4 operaciones 
	basicas, redondeando en un decimal 
	la division.
	@Autor: Dany
*/
function operaciones(n1,n2){
	console.log( ` Suma: ${n1+n2} ` )
	console.log( ` Resta: ${n1-n2} ` )
	console.log( ` Multiplicacion: ${n1*n2} ` )
	console.log( ` Division: ${Math.round((n1/n2)*100)/100} ` )
}
>

Willy David Da Conceicao Lozada

student•

SUPER APUNTES - SIEMPRE ES BUENO TENER UNOS BUENOS APUNTES EN 5 MESES O 2 AÑOS IGUAL ESTÁN ALLI: ![](

Carlos Roberto Villatoro Barrios

student•

Practicando todo lo aprendido.....

Carlos hernandez rivas

student•

hola ,muchas gracias me ayudo mucho tu aporte .

Aarón Sánchez

student•

Actualmente en JavaScript ECMAScript 6 podemos definir la función de forma de flecha que es la forma que actualmente se esta escribiendo JavaScript para ver sus beneficios pueden leer aqui es similar solo es practica para aprender su sintaxis nueva para definir funciones:

Ejemplo:

// Funcion de flecha
const imprimirEdadFlecha = (nombre, edad) => {
    console.log(`${nombre} tiene ${edad} años.`)
}

imprimirEdadFlecha('Alejandro', 20);

Heydy Mayumy Carrasco Huaccha

student•

Gracias x el aporte (y)

Daniel Páez

student•

Mis apuntes

/*


funciones son pedazos de codigo reutilizablke
*/

//Imprimiendo algo en la consola
console.log("inicializando archivo");

var  nombre = "Danielito" , edad = 18;

//Definiendo mi función
function imprimirEdad( n,e ) {
	//Dentro del parámetro coloco que variables va a recibir
 	 
 	 //Concatenando variables usando EcmaScript 6
 	console.log(`${n} tiene ${e} años`); 

}

//Con nombre y edad hago referencia a las variables globales fuera de la función
imprimirEdad(nombre,edad);
imprimirEdad("Amanda",12);
imprimirEdad("Betsabet",2018-1979);
imprimirEdad(35,"Tomás")


/*
Las funciones sirven para reutilizar còdigo
Javascript no espera que las cosas siempre esten definifas
*/

/*
Repaso
¿Que aprendi?
A crear una funcion que es un bloque de codigo reutilizable
A pasar parametros a la funcion
La manera tan debilmente tipada en que se trabaja la función en javascript
¿Que logre?
Crear una función que me devuelva una frase con mi edad y nombre
¿Que podre lograr?
Escribir menos codigo para lograr programar más de manera dinamica segun las variables proporcionadas
*/

Denis Cordero

student•

En mi caso me gusta utilizar las llaves de esta forma

function imprimirEdad(n, e)
{
    console.log(`${n} tiene ${e} años`)
} ```

Constantino Celis Peñaranda

student•

Cómo es que se llama esa práctica de usar las llaves?

Iván Hernández Castelán

student•

@konstanti se llama Template String, se pueden usar a partir de ECMA 6, y no sólo sirven para jalar variables también podrías hacer expresiones dentro de los corchetes, por ejemplo:

let uno = 1, dos = 2;

console.log(`La suma de 1 más 2 es igual a: ${uno+dos}`);

LEIDY DAZA

student•

Funciones declarativas vs Funciones de expresiones en JavaScript

Jonatan Padilla

student•

Una funcion esta compuesta por:

El nombre de la función function name
Argumentos o parametros de la función.(a, b)
y las sentecionas o procedimientos que definen la función. estas encerradas en llaves {}

Miguel Alejandro Alarcon Alarcon

student•

ya, solucionado, estaba colocando el imprimirEdad () dentro de las {}, hay que tener ojo con eso.

Erik Elyager

student•

Me da gusto que lo hayas resuelto, así es como más se aprende 💪, sólo te pido que trates de mantener todo en una sola discusión. Si ya preguntaste algo y encuentras más información al respecto o solucionaste tu problema, trata de crear un comentario en esa discusión que ya tienes para mantener todo en un mismo lugar.

Gracias por compartir y no dudes nunca en preguntar.

Ángel David Vargas Hernández

student•

Para los que utilizan Visual Studio Code y no quieran compilar en el navegador les recomiendo instalar la herramienta llamada Code Runner, con esa herramienta solo seleccionar el bloque de código que quieran compilar y el entorno lo realizara.

Diego Fernando Berrio Meza

student•

MCJohanny Dilan Maturana Cogollo

student•

Viejo porque la letra se ve así luminosa?

Jose Fernando Gallego Cardona

student•

Cuál es este tema? que se ve iluminada la letra?

Alejandro Giraldo Londoño

student•

RESUMEN:

En esta clase vimos sobre funciones y su sintáxis básica. TIP:Si bien está bien usar las herramientas para desarrollador de google, existe un pluggin dentro de VSCode llamado Code Runer (herramienta my completa), lo que permite es ejecutar fragmentos de código que selecciones. El comando rápdio para ejecutar tu selección es ctrl+alt+n (windows).

En el siguiente código se resume lo visto en clase con comentarios.

//Las funciones son pedazos de código reutilizables, definidas por la palbra reservada function (parámetro1,parmetro2...) y { aquí se pone el código }

var name = &quot;Alejandro-sin&quot;, edad=30

function imprimirDatos (){
    console.log(`${name} tiene ${edad} años`)
};

imprimirDatos() // Hay que llamar a la función para que se ejectue

var name = &quot;Alejandro-sin&quot;, edad=30

function imprimirDatos (n,e){ // Al pasarle parámetros me va a permitir recibir cualquier nombre y edad
    console.log(`${n} tiene ${e} años`)
};
imprimirDatos(name,edad)

// JS es un lenguaje interpretado, intentará ejecutar las cosas a medida que le decimso qué. Sin importar como nombrasemos los parámetros dentro de la función. Js intentará ejecutarla. JS no se fija en que las viariiables sean obligatorias, o que x parámetro sea exclusivamente de un tipo.

Sebastian Castañeda Garcia

student•

Me encanta concatenar de esta forma:

<var nombre = "Sacha", edad = 28

function imprimirEdad(nombre, edad) {
  console.log(`${nombre} tiene ${edad} años`)
}

imprimirEdad("Sebastián", 16)>

Pedro Marcano

student•

Una cosa interesante de los template strings, que descubrí poco antes de arrancar este curso, es esto:

console.log(`${nombre} tiene ${edad} año${edad!== 1 ? 's' : ''}`);```

No tendría mucho sentido si pones más de 1 año, pero de todos modos ponte de edad 0 ó 1 y compara lo que pasa.

Funciones

Introducción al curso

¡Alto! Tenemos una nueva versión de este curso para ti

Bienvenidos al Curso de Fundamentos de JavaScript

Repositorio de este curso de fundamentos de JS

Primeros pasos en JavaScript

Variables

Variables: Strings

Variables: Números

Funciones

El alcance de las funciones

Objetos

Desestructurar objetos

Parámetros como referencia o como valor

Comparaciones en JavaScript

Estructuras de Control y Funciones

Condicionales

Funciones que retornan valores

Arrow functions

Estructuras repetitivas: for

Estructuras repetitivas: while

Estructuras repetitivas: do-while

Condicional múltiple: switch

Arrays

Introducción a arrays

Filtrar un array

Transformar un array

Reducir un array a un valor

Programación Orientada a Objetos en JavaScript

Cómo funcionan las clases en JavaScript

Modificando un prototipo

El contexto de las funciones: quién es this

La verdad oculta sobre las clases en JavaScript

Clases en JavaScript

Asincronismo

Funciones como parámetros

Cómo funciona el asincronismo en JavaScript

Cómo funciona el tiempo en JavaScript

¿Qué pasó con swapi.co?

Callbacks

Haciendo múltiples requests

Manejando el Orden y el Asincronismo en JavaScript

Manejo de errores con callbacks

Promesas

Promesas Encadenadas

Múltiples promesas en paralelo

Async-await: lo último en asincronismo

Juego de HTML

Comenzando el juego

Generando una secuencia de números

Iluminando la secuencia de colores

Obteniendo el input del usuario

Agregando la verificación del color elegido

Agregando los estados finales del juego

Conclusiones del curso

Complementos

Diferencias entre var, let y const

Memoización: ahorrando cómputo

¿Hace cuántos días naciste?

Funciones recursivas

Entiende los closures de JavaScript

Estructuras de datos inmutables

Cambiando de contexto al llamar a una función

¿Cuándo hace falta poner el punto y coma al final de la línea?