Curso Javascript Parte I

Saludos, apartir de hoy me voy a dar a la tarea de publicar un curso de JavaScript, en este curso tratare de cubrir de manera secilla todos los aspectos básicos de JS. Lo que te permitira al final crear sitios web con JS. Estoy considerando que no tienes conocimientos de JavaScript pero si debes de tener conocimientos, básicos de HTML. Si no los tienes puedes mirar el curso de HTML en mi blog.

Ahora comencemos con un poco de historia para ponerlos en contexto:

LOS QUE’s Y PORQUE’s de  JavaScript?

Lo que conocemos como World Wide Web o WWW comenzó como un servicio para compartir documentos e información entre universidades y centros de investigación, para este propósito se crea un lenguaje que les permitía crear documentos de texto con formato y enlazar otros documentos que estuvieran también en el WWW, a este lenguaje se le llamo de Hiper-texto o HTML (Hiper text markup language). Este lenguaje necesitaba ser interpretado para mostrarlo al usuario final, para ello surgieron los navegadores o browsers (ya que en el transporte solo se transmite texto, ósea las instrucciones para renderear la página), uno de los primeros fue Netscape.

Estas “paginas” al inicio no podían hacer otra cosa más que mostrar información escrita y enlazarse con otras páginas. Poco después se incorporaron al estándar de HTML controles y formularios, los cuales permitían construir páginas con las que el usuario pudiera interactuar, aunque fuera solo para mandar información al servidor ya que el browser en muchos sentidos era una “terminal tonta”, ya que no podía incluirse ninguna programación del lado del cliente.

Pero fue un programador de Netscape quien diseña un lenguaje basado en ScriptEase, el cual adapta al navegador Netscape 2.0 y le llama LiveScript. La idea principal detrás de LiveScript fue permitir manipular de manera dinámica los objetos HTML del lado del cliente, sin necesidad de hacer una petición al servidor y esperar a regenerar la página para tomar decisiones, como verificar la información que el usuario escribía en un formulario. Debido al éxito Netscape y Sun Microsystems se unen para extender el lenguaje y de ahí nace JavaScript.

Netscape 3.0 se lanza como el primer navegador integrado con la primer versión de JavaScript, el cambio de nombre fue meramente comercial (estaba de moda la palabra Java al parecer). En la misma época Microsoft lanza su IE 3.0 con el JScript que fue una copia de la implementación de Netscape, con el que el cual comparte algunas similitudes pero no es igual. Es por esto que algunas sentencias cambian de navegador en navegador.

En 1997, Netscape decide estandarizar el lenguaje y lo manda al ECMA European Computer Manufacturers Association, el cual crea el primer lenguaje estándar y le nombra ECMAScript. Actualmente casi todos los navegadores cumplen con este estándar. De hecho lo que conocemos hoy como JavaScript no es más que la implementación que realizó la empresa Netscape del estándar ECMAScript.

ENTONCES COMO DEFINIMOS A JAVASCRIPT?

JavaScript (abreviado comúnmente JS) es un lenguaje de programación interpretado, dialecto del estándar ECMAScript. Se define como orientado a objetos, basado en prototipos, imperativo, débilmente tipado y dinámico.

Vamos a analizar cada propiedad mencionada de JS:

  • Primero, JavaScript es un lenguaje de programación basado en la estructura y forma de C y C++, pero a diferencia de este es un lenguaje interpretado, esto quiere decir que hay un intérprete el cual es necesario para ejecutarse, es decir, no esta compilado si no que se compila y ejecuta cuando se requiere.

Cuando se hace un programa en JAVA, C, C++, etc. El paso inmediato anterior a ejecutar ese programa es compilar y enlazar el código, en este paso el código de lenguaje humano se interpreta (se traduce) a lenguaje de máquina, o a un lenguaje intermedio el cual se pueda ejecutar en el sistema operativo actual. JavaScript por el contrario no se compila, el programa se distribuye en lenguaje humano (Java) y es solo al momento de usarlo cuando el intérprete lee el código, lo traduce y lo ejecuta al mismo tiempo.

  • Segundo, es un lenguaje que sigue el estándar ECMAScript, creado con el proposito principal de hacer validaciones y manipular dinamicamente los objetos del browser del lado del cliente.
  • Tercero, es un lenguaje orientado a Objetos; si bien se dice que JS es un lenguaje orientado a objetos, este emplea el paradigma conocido como  programacion sin clases o basado en prototipos. La programación basada en prototipos es un estilo de programación orientada a objetos en la que las clases no están presentes y la reutilización de comportamiento (conocido como herencia en otros lenguajes) se lleva a cabo a través de un proceso de decoración de objetos existentes que sirven de prototipos.

 


var ejemplo= prototipoEjemplo {}; //Este es el prototipo actualmente esta vacio.
//se crean miembros propiedades y metodos en el prototipo
prototipoEjemplo={
  regExParaNombre:"", //define regex para la validación del nombre
  regExParaTelefono:"",// define regex para validación del teléfono
validaNombre: function ValidaNombre(){
    // Hace algo con el nombre que usted ingresa a la variable reExParaNombre
    // usando "this.regExParaNombre"
   }
}
  • Cuarta, es un lenguaje imperativo, pues necesitas escribir paso a paso que debe hacer la maquina para llegar al resultado esperado. En la programación imperativa se describe paso a paso un conjunto de instrucciones que deben ejecutarse para variar el estado del programa y hallar la solución, es decir, un algoritmo en el que se describen los pasos necesarios para solucionar el problema.
  • Quinta, es un lenguaje dévilmente tipado por que, no controla los tipos de las variables que se declaran, de este modo, es posible usar variables de cualquier tipo en un mismo escenario. Por ejemplo, una función puede recibir como parámetro un valor entero, cadena de caracteres, flotante, etc.
//Ejemplos, en JS el siguiente código en válido:
var a=3; //es un entero
var txt='hola mundo'; // es un string
var resp= txt+a; // el resultado es un string 

var a=3; //es un entero
var b=44.66; // es un float
var resp= a+b; // el resultado es un float
  • Y Finalmente, es un lenguaje dinámico, pues es posible modificar y extender cualquier objeto en tiempo de ejecución.
//Ejemplo:
var obj=new Caja(); //El prototipo Caja no contiene originalmente
                    //el miembro nombre del cajero
obj.NombreCajero = ‘Jose’; // Se agrega dinámicamente al objeto obj
//el miembro NombreCajero

 

Hasta aquí la primera parte de este curso. Espero sus sugerencias y comentarios.

Happy coding.

Traductor de Números Arábigos a Texto Chino en C#

Este articulo es una versión actualizada para .Net del script de Perl hecho por Erik Peterson.

En China, si bien muchos han adoptado el sistema de numeración arábigo que es mundialmente reconocido, también se sigue usando el sistema el sistema nativo de caracteres chinos. El sistema tradicional es igualmente un sistema de base 10, pero tiene importantes diferencias en la forma en que son representados los números.(ver tabla) El sistema chino tiene representación para los números del 0 al 9. Adicionalmente se puede representar al cero como un simple circulo. La pronunciación romanizada estándar de los caracteres usados en china se llama “pinyin”. El hànyǔ pīnyīn , literalmente ‘deletreo [fonético] de la lengua de los han (chino mandarín), normalmente llamado pinyin es el sistema de transcripción fonética oficial del chino mandarín (hànyǔ). En lugar de utilizarse los caracteres chinos (que, en general, no dan información acerca de la pronunciación), se usan letras del alfabeto latino para escribir fonéticamente las palabras chinas. Este sistema ayuda a los extranjeros a aprender la pronunciación a través de libros de texto y también es utilizado para introducir texto en caracteres chinos en teclados QWERTY a través de programas específicos para ello.

0 1 2 3 4 5 6 7 8 9 10 100 1000 10000 100000000
Hanyu Pinyin ling yi er san si wu liu qi ba jiu shi bai quian wan yi

Once en Chino es “diez uno”. Doce es “diez dos”, y así sucesivamente. Veinte seria “Dos diez”, mientras que veintiuno es “dos diez uno” (2*10+1) y así hasta 99. Cien se escribe tal cual. 101 seria “uno cien cero uno”, 111 seria “uno cien uno diez uno”. Note que para representar el once solo es “diez uno” y no “uno diez uno”, pero cuando se usa en un número largo (como 111), se debe agregar un uno extra. Para representar números por arriba de mil es algo similar, donde dices cuantos miles tienes, cuantas centenas, y después decenas y unidades. La excepción de esto es el cero. Cuando el número es un cero (excepto al final), necesitas decir “cero”, pero solo una vez para dos o más ceros consecutivos. Así, por ejemplo, mil y uno (1001) seria “uno mil cero uno”, donde el cero representa al cero en decenas y centenas.

Para la implementación del algoritmo en .Net, primero declararemos dos enumeraciones para manejar los tipos de  salida que podemos manejar, por default manejaremos la representación tradicional, solo si lo solicita el usuario, haremos la conversión a la representación en Pinyin.

public enum OutputType { Traditional, Pinyin };

Ahora declararemos variables constantes que nos ayudarán a contener los caracteres que representan al punto decimal y al signo negativo:

private const string MINUS = “負”;
private const string DECIMAL = “點”;

ahora declareremos el array digits que contiene la representación de cada numero del 0 al 9 en ese orden.

private string[] digits = new string[] { “零”, “一”, “二”, “三”, “四”, “五”, “六”, “七”, “八”, “九” };

Ahora declararemos un array que contiene la representación de cada posición decimal hasta los miles y otro que contiene la representación a partir de mil hasta billones, esto será para cumplir con las reglas gramaticales que vimos anteriormente en la representación antes y después de los miles:

private string[] beforeWan = new string[] { “十”, “百”, “千” };

private string[] afterWan = new string[] { “”, “萬”, “億”, “兆”, “京” };

A continuación emplearemos un diccionario en cual contendrá la equivalencia de cada numeral chino en su representación en pinyin, el cual emplearemos al final si el outputType es igual a pinyin.

private Dictionary<string, string> trad2pinyin = new Dictionary<string, string>
{{“負” , “fu”},   {“點” , “dian”},  {“零” , “ling”},  {“一” , “yi”},
{“二” , “er”},  {“三” , “san”},  {“四” , “si”},  {“五” , “wu”}, {“六” , “liu”},
{“七” , “qi”}, {“八” , “ba”}, {“九” , “jiu”}, {“十” , “shi”}, {“百” , “bai”},
{“千” , “qian”},  {“萬” , “wan”}, {“億” , “yi”}, {“兆” , “zhao”},  {“兩” , “liang”}};

Deliberadamente he omitido el carácter de tono, lo tendrán que investigar……😉

Ahora declararé el método de conversión, el cual recibe un double y un OutputType

public string NumberToWords(double enumber, OutputType outputType = default_outputtype)
{

}

Primero verificaremos que el número que nos pasan no es igual a cero, en caso contrario regresaremos el carácter de cero y terminaremos la función. Después verificaremos si es un número negativo, en ese caso habilitaremos una bandera y tomaremos el valor absoluto del numeral.

          if (enumber == 0)
{
return digits[0];
}

            if (enumber < 0)
{
negative = 1;
enumber = enumber * -1;
}

ahora verificaremos si el número tiene una parte decimal, si la tiene colocaremos el valor del decimal en una variable y el valor entero en otra, después analizaremos el número entero y sacaremos el valor de cada posición decimal dentro del array “powers”, este array puede ser un array fijo o ponemos emplear un ArrayList.

if (enumber.ToString().Contains(“.”))
{
remainder = enumber.ToString().Split(‘.’)[1];
enumber = double.Parse(enumber.ToString().Split(‘.’)[0]);
}

while (System.Math.Pow(TEN, power) <= enumber)
{
value = (enumber % (System.Math.Pow(TEN, (power + 1))) / System.Math.Pow(TEN, power));
powers[power] = value;
enumber -= enumber % System.Math.Pow(TEN, (power + 1));
power++;
}

Finalmente recorreremos el array “powers” para ir formando la representación de caracteres chinos empleando el array de digits para extraer la representación de cada cifra.

for (int i = 0; i < power; i++)
{
if ((i % 4) == 0)
{
if (powers[i] != 0)
{
inzero = 0;
canaddzero = 1;
cnumber = string.Format(“{0}{1}{2}”, digits[(int)powers[i]], afterWan[i / 4], cnumber);
}
else
{
if (((i + 3 < power) && powers[i + 3] != 0) ||
((i + 2 < power) && powers[i + 2] != 0) ||
((i + 1 < power) && powers[i + 1] != 0))
{
cnumber = string.Format(“{0}{1}”, afterWan[i / 4], cnumber);
canaddzero = 0;
}
}
}
else
{
if (powers[i] != 0)
{
inzero = 0;
canaddzero = 1;
if (power == 2 && i == 1 && powers[i] == 1)
{
cnumber = beforeWan[(i % 4) – 1] + cnumber;
}
else
{
cnumber = digits[(int)powers[i]] + beforeWan[(i % 4) – 1] + cnumber;
}
}
else
{
if (canaddzero == 1 && inzero == 0)
{
inzero = 1;
cnumber = digits[(int)powers[i]] + cnumber;
}
}
}
}

Finalmente verificamos la bandera de número negativo y la representación de los números fraccionarios.

if (remainder != “”)
{
cnumber += DECIMAL;
for (int i = 0; i < remainder.Length; i++)
{
cnumber += digits[int.Parse(remainder.Substring(i, 1))];
}
}

if (negative == 1)
{
cnumber = MINUS + cnumber;
}

si el OutputType es Pinyin, haremos la conversión empleando el array, de otra forma mandamos la salida al usuario:

string result = string.Empty;

switch (outputType)
{
case OutputType.Traditional:
result = cnumber;
break;

case OutputType.Pinyin:
for (int j = 0; j < cnumber.Length; j++)
{
result += trad2pinyin[cnumber.Substring(j, 1)] + ” “;
}
break;

}

return result;

Espero que les sea de utilidad esta función, feliz código….. espero sus comentarios.

Convertir Fecha Serial de Excel a DateTime C#

En Excel los valores de fecha y hora se guardan como un número que representa
el número de días desde 1900-Ene-01, más el componente fraccional que representa
la fracción de 24 horas del día (ddddd.ttttt). Esto es conocido como fecha
serial.

La porción entera del número, que representa la fecha como el número de días
que han transcurrido desde 1900-Ene-01. En este caso el número 1 representaría el
1-Ene-1900. Cabe notar que el cero no representa el 31-Dic-1899. En Excel existe
un error ya que en su comportamiento cree que existe 29-Feb-1900, siendo que
1900 no es año bisiesto, así que todas las fechas posteriores a esta de hecho
tienen un día de más.

A continuación expongo una pequeña función para convertir la fecha serial de
excel a un objeto DateTime de .Net en C#.  Como se observa en en la cuarta línea
se restan 2 días por que excel comienza su cuenta en cero y uno más para
corregir el error de consideración del año bisiesto 1900.

public static DateTime ExcelSerialDateToDateTime(int nFechaExcel)

{
if (nFechaExcel == 0) return new DateTime(1900, 1,
1);
if (nFechaExcel == 60) return new DateTime(1900, 3,
1);
if (nFechaExcel < 60) nFechaExcel++;

nFechaExcel = nFechaExcel – 2;

DateTime oFechaOrigen = new DateTime(1900, 1, 1);

return oFechaOrigen.AddDays(nFechaExcel);
}

Saludos

Microsoft lanza Office Live Workspace

Office Live Workspace, es una exención de MS Office para web, en donde puedes subir documentos, presentaciones, etc y compartirlos o trabajar en ellos desde cualquier lugar. Puedes ver el video informativo. Podrás almacenar más de 1000 documentos den tu espacio, enviar e-mail, enviar invitaciones y tareas y sincronizar contactos de Outlook. Todo con una interfaz basada en explorador sin descargar ningún programa. Muy buena idea…..

Computadora para invidentes.

Si, por fin, una computadora que facilitará la experiencia a todas aquellas personas una visión deficiente. SIAFU, consiste en un panel plano que le permite al usuario una completa interacción con el tacto. La superficie emplea un material conceptual llamado magneclay o líquido magnético. Este material le permite cambiar de forma empleando electromagnetismo, creando en la superficie símbolos braille e inclusive imágenes  3D en relieve.

La tecnología detrás de SIAFU, magneclay es un compuesto basado en aceite sintético que tiene una estructura molecular difusa, pero que puede ser reformada un sin fin de veces al hacer actuar cargas eléctricas y magnéticas. La estructura se mantendrá firme tanto como duren actuando las cargas eléctricas, permitiéndole al usuario tocar e interactuar con las formas adquiridas sin deformarse.

La superficie de SIAFU puede formar un teclado braille de 9 teclas y le permite al usuario revisar que está escribiendo. Además cuenta con un micrófono intercostruido, que le da al usuario una alternativa para ingresar texto o comandos, mediante un avanzado software de reconocimiento de voz.

Fuente

Café y PC para llevar.

La Yuno PC , es un nuevo concepto en computadoras portátiles que le ayuda a salir en la mañana sin estar amarrado a su PC de escritorio. Todo acomodado en un termo para tu bebida preferida. Este gadget tiene una pantalla táctil e incorpora las alertas más importantes como clima, noticias, tráfico, y más…Tambien puedes mostrar tus fotos favoritas como fondo. Asi puedes disfrutar una mañana sin estress y altamente cafeinatada….😉

Una ventana al mundo

La tecnología esta avanzando de una manera vertiginosa. Algunos nuevos
artefactos parecen sacados de una novela de ciencia ficción. Como este
dispositivo ultra-conectado diseñado por el residente Japones Mac Funamizu. El
dispositivo que aun no tiene nombre, parece una pequeña ventana transparente que
reconoce cualquier cosa que se mire a través de ella. Incorporando una
cámara/escaner, GPS y conexión a internet, podrá buscar información de casi
cualquier cosa que se mire, solo enfoca cualquier cosa: un edificio, un auto,
una pieza de arte y la imagen de analizará y buscará información relacionada en
un gran número de sitios de internet como Wikipedia, Google o Google earth.
Necesitas buscar la definición de una palabra en un líbro? Solo necesitas
enfocarlo y tocarlo, para que el dispositivo busque en varios diccionarios en
línea. Realmente una ventana al mundo.