Introducción a Dart | Aprende los conceptos básicos de Dart antes de empezar con Flutter.

Introducción a Dart

Aprende los conceptos básicos de Dart antes de empezar con Flutter.

Hola mundo en Dart

En esta clase haremos nuestra primera escritura de código en lenguaje Dart y no te preocupes si no entiendes algo, vamos a ir abordando todos los temas y desglosando todos los conceptos para que todo quede claro, ya que en la clase pasada recibí muchos comentarios del tipo (no entiendo nada), solo me queda decirte tranquilo y vamos paso a paso.
14:13 | 0


En esta clase haremos nuestra primera escritura de código en lenguaje Dart y no te preocupes si no entiendes algo, vamos a ir abordando todos los temas y desglosando todos los conceptos para que todo quede claro, ya que en la clase pasada recibí muchos comentarios del tipo (no entiendo nada), solo me queda decirte tranquilo y vamos paso a paso.

Lo primero que vamos a hacer es ingresar a la siguiente url: https://dartpad.dev/

DartPad es un sitio web que nos permite probar código escrito en Dart en la nube sin necesidad de tener un compilador local corriendo, el validará las acciones y rutinas de nuestro código y nos mostrará en una consola (ventana derecha) el resultado. Es un entorno ideal para experimentar, jugar y sobre todo aprender, tranquilo puedes probar todo lo que quieras no vas a romper nada.

Una vez que entramos a DartPad puede que tengamos un código en el panel del editor que para ese caso vamos a borrar ya que vamos a escribir todo el código de cero para ir mirando cada una de las líneas que vamos a escribir.

Ahora vamos a ver que tenemos en este DartPad. 

  • Lo primero es el panel izquierdo en el cual vamos a escribir nuestro código, esta es nuestra área de trabajo donde pondremos las instrucciones de nuestro programa.
  • En el costado derecho tenemos dos paneles, el de arriba es la consola, el lugar que mostrará el output o salida de nuestro programa, es decir donde veremos que es lo que nuestro programa hace, y debajo de él tenemos un panel de documentación que nos mostrará información importante sobre algunos elementos para entender más sobre el lenguaje Dart. 
  • Por último tenemos el botón de “RUN” cuya función es simplemente ejecutar el código que tenemos escrito en nuestro programa.

Si hemos borrado todo el contenido del código y presionamos el botón RUN en la consola se nos mostrará un error:

Error compiling to JavaScript:
Warning: Interpreting this as package URI, 'package:dartpad_sample/main.dart'.
Error: No 'main' method found.
Error: Compilation failed.

No te preocupes por esto, como te decía vamos a hacerlo paso a paso para comprender todos los conceptos. aunque si debes tener en cuenta al aprender a programar que debes fijarte en los errores siempre que tengas uno ya que la mayoría de lenguajes de programación te indican cómo corregirlos. En este caso el error nos indica Error: No 'main' method found, lo que quiere decir que necesitamos una función o método main, por ahora no te preocupes sobre que es una función porque lo explicaremos a su debido momento.

Ahora simplemente vamos a crear nuestra función main escribiendo el siguiente código:

main() {
}

Ahora al presionar el botón RUN veremos que el error ha desaparecido.

Dart al igual que muchos otros lenguajes de programación, en especial los que están basados en POO (Programación Orientada a Objetos) requieren una función principal (main) por donde se empezará a ejecutar el programa, esta es la función que acabamos de crear. Sin embargo nuestra función main actualmente no tiene ningún contenido, es decir no tiene ninguna instrucción así que nuestro programa no hace nada, las instrucciones de nuestro programa se ubicaran dentro de las llaves de la función y serán ejecutadas en orden consecutivo.

Una función dentro de dart debe retornar algo y se acostumbra definir antes de el nombre de la función de qué tipo será la respuesta de dicha función, sin embargo ya que esta es la entrada de nuestro programa no debe retornar nada específicamente así que usamos la palabra reservada “void” para indicar que no hay respuesta o está vacía.

void main() {
}

Aun así nuestro código no esta haciendo nada más que ejecutar un programa vacío, así que ahora vamos a hacer que nuestro programa haga algo y lo primero que haremos será hacerlo imprimir información en nuestro consola, a esto se le llama un Hola mundo o Hello World en inglés, y basta con usar la siguiente instrucción dentro de nuestra función main.

void main() {
  print("Hola Mundo");
}

Ahora tras presionar RUN veremos en nuestra consola aparecer el mensaje Hola Mundo.

Como vimos con la función print podemos imprimir contenido en nuestra consola, pero ¿qué pasa si tenemos un código o una anotación que queremos hacer en nuestro código pero que no se ejecute? para eso tenemos los comentarios, en la mayoría de lenguajes de programación se definen dos formas de hacer comentarios simples, por un lado tenemos los comentarios de una línea que se hacen simplemente poniendo dos slashs o barras inclinadas al inicio del comentario (cuando son de un solo renglón) y por otro lado los comentarios de múltiples líneas que se hacen iniciando con un slash y asterisco y se terminan con asterisco slash de la siguiente manera:

void main() {
  /*
   Soy un comentario
   multilinea
  */

  // soy un comentario de una sola línea
  print("Hola Mundo");
}

Noten que al presionar RUN esto no afecta a la ejecución del programa, es decir que los comentarios son solo ayudas o anotaciones que hacemos en el código pero no afectan al funcionamiento del programa, es decir que son ignorados al momento de compilar y/o ejecutar.

Por último vamos a hacer un pequeño ejercicio con una variables, y si no entiendes tranquilo en la siguiente clase explicaremos esto en detalle.

Vamos a crear una variable usando la palabra reservada “var” y le asignamos el identificador “nombre” con el valor de tu nombre así:

var nombre = "Kalvin Manson";

y luego vamos a cambiar la línea que se encarga de imprimir contenido en pantalla por esta expresión:

print("Hola " + nombre);

Al presionar RUN veremos en nuestra consola “Hola Kalvin Manson”, y podemos ver que en la variable nombre hemos almacenado el valor “Kalvin Manson” y luego lo hemos unido a la palabra “Hola” para imprimirlo en la consola.En programación a esta “unión” de variables se le llama CONCATENAR. Y aunque la forma más típica de los lenguajes es usar un . o un signo +, Dart nos ofrece otra forma de concatenar de una manera más amigable usando el signo $ de esta manera:

print("Hola $nombre");

Esto es suficiente por ahora y nos vamos a la siguiente clase en la que profundizaremos en el uso de variables y empezaremos a conocer los tipos de datos.