Skip to content

Latest commit

 

History

History
454 lines (350 loc) · 12.1 KB

File metadata and controls

454 lines (350 loc) · 12.1 KB

shieldsIO shieldsIO shieldsIO

WideImg

Máster en Programación FullStack con JavaScript y Node.js

JS, Node.js, Frontend, Backend, Firebase, Express, Patrones, HTML5_APIs, Asincronía, Websockets, Testing

Clase 9

String

Propiedades:

  • .length() Devuelve la longitud:
var cadena = "Fictizia";

console.log("Fictizia tiene " + cadena.length + " caracteres.");

console.log("Una cadena vacia tiene " + ''.length + " caracteres.");

Métodos:

  • .fromCharCode() Devuelve una cadena creada mediante una secuencia Unicode:
	console.info("Es es el año 2016 ("+ String.fromCharCode(8559,8559,8553,8548,8544) + ")");
  • .anchor() Crea un ancla HTML:
	document.body.innerHTML = "Contenidos".anchor("contenidos"); 
	// "<a name="contenidos">Contenidos</a>"
  • .charAt() Devuelve el carácter específico:
var cadena="Fictizia";
console.log("El carácter(posición) 3 es '" + cadena.charAt(3) + "'")
  • .charCodeAt() Devuelve el valor Unicode:
var cadena="Fictizia";
console.log("El carácter(posición) 3 es '" + cadena.charAt(3) + "', en unicode ("+cadena.charCodeAt(3)+")")
  • .concat() Combina el texto de dos o más cadenas:
var cadena1 = "Oh ";
var cadena2 = "qué maravillosa ";
var cadena3 = "mañana'.";
var combinacion = cadena1.concat(cadena2,cadena3);
console.log(combinacion); // devuelve "Oh qué maravillosa mañana'."
  • .indexOf() Devuelve el índice o -1:
"Mundo Web".indexOf("Web") // 6
"Mundo Web".indexOf("web") // -1
  • .lastIndexOf() Devuelve el índice de la última coincidencia o -1:
"Fictizia".lastIndexOf("i"); // 6
"Fictizia".lastIndexOf("f"); // -1
  • .link() Crea un enlace:
var textoActivo="Nuestro Curso"
var url="http://www.fictizia.com/formacion/curso_javascript"
document.body.innerHTML = "Haga click para volver a " + textoActivo.link(url);
  • .slice() Devuelve una cadena nueva con una sección de otra:
var cadena = "Fictizia";
console.log(cadena.slice(5)); // zia
console.log(cadena.slice(0, 5)); // Ficti
console.log(cadena.slice(3, -1)); // tizi
  • .split() Divide una cadena usando un separador:
function dividirCadena(cadenaADividir,separador) {
   var arregloDeCadenas = cadenaADividir.split(separador);
   console.log('<p>La cadena original es: "' + cadenaADividir + '"');
   console.warn('<br>El separador es: "' + separador + '"');
   console.log("<br>El arreglo tiene " + arregloDeCadenas.length + " elementos: ");

   var elementos = "";
   for (var i=0; i < arregloDeCadenas.length; i++) {
      elementos += arregloDeCadenas[i] + " / ";
   }

   console.info(elementos);

}

var cadenaVerso = "Lorem Ipsum es simplemente el texto de relleno de las imprentas y archivos de texto. Lorem Ipsum ha sido el texto de relleno estándar de las industrias desde el año 1500";
var cadenaMeses = "Jan,Feb,Mar,Apr,May,Jun,Jul,Aug,Sep,Oct,Nov,Dec";

var espacio = " ";
var coma = ",";

dividirCadena(cadenaVerso, espacio);
dividirCadena(cadenaVerso);
dividirCadena(cadenaMeses, coma);
  • .substr() Devuelve los caracteres de una cadena comenzando en la localización especificada, y en el número de caracteres especificado.:
var cadena = "Fictizia";
console.log("(0,5): "    + cadena.substr(0,5)); // Ficti
console.log("(5,3): "    + cadena.substr(5,3)); // zia
  • .substring() Devuelve un subconjunto:
var cadena = "Fictizia";
console.log("(0,5): "    + cadena.substring(0,5)); // Ficti
  • .toLocaleLowerCase() Devuelve todo en minúsculas con las características locales:
console.log('FICTIZIA'.toLocaleLowerCase()); // 'fictizia'
  • .toLocaleUpperCase(Devuelve todo en mayúsculascon las características locales) **:
console.log('fictizia'.toLocaleUpperCase()); // 'FICTIZIA'
  • .toLowerCase() Devuelve todo en minúsculas:
console.log('FICTIZIA'.toLowerCase()); // 'fictizia'
  • .toUpperCase() Devuelve todo en mayúsculas:
console.log('fictizia'.toUpperCase()); // 'FICTIZIA'
  • .trim() Elimina espacios vacios al principio y final de la cadena:
console.log('  Fictizia '.trim()); // 'Fictizia'

Arrays

  • Creando un array:

    var arreglo = [];
    arreglo = [1, "platano", "piscina", "manzana", true];
  • Usando el Índice:

    arreglo[1];
  • Cambiar un valor del Índice:

    arreglo[0] = "fresa";
    arreglo[4] = "pera";
    arreglo[2] = "limón";
  • delete sobrescribe a undefined

    delete arreglo[0];
  • Elementos vacios:

    arreglo[0] = undefined;

Propiedades

  • Índice total:

    	arreglo.length;
  • Usando el Índice total en un bucle:

    var numeros = [1, 2, 3, 4, 5];
    for (var i = 0; i < numeros.length; i++) {
      numeros[i] *= 10;
    }

Métodos

  • .push() Añadir elemento al índice:

    arreglo.push("nuevo");
  • .pop() Eliminar el último elemento del índice:

    	arreglo.pop();
  • .shift() Eliminar el primer elemento:

    	arreglo.shift();
  • .splice() Borrar:

    	var manzana = arreglo.splice(3, 1);
  • .map():

    var arreglo = ["plátano", "fresa", "lima", "manzana"];
    var resultado = arreglo.map(function (elemento){return elemento + " modificado!"});
    console.log(resultado);
  • .isArray():

    	var arreglo = [1,2,3]
    	
    	// true
    	Array.isArray([1]);
    	Array.isArray(arreglo);
    	
    	// false
    	Array.isArray();
    Array.isArray({});
    Array.isArray(null);
    Array.isArray(undefined);
  • .concat() Retorna un nuevo Array con los Arrays especificados concatenados:

    • Dos Arrays:
    	var arreglo = ['a', 2, true];
    	var arreglo2 = [1, 2, 4];
    
    	var nuevaArray = arreglo.concat(arreglo2);
    
    console.log(nuevaArray); 
    • Múltiples Arrays:
    	var arreglo = ['a', 2, true];
    	var arreglo2 = [1, 2, 4];
    	var otroArreglo = ['abc', 1, false]
    
    	var nuevaArray = arreglo.concat(arreglo2, [5.25, 100], otroArreglo);
    
    console.log(nuevaArray);
  • .every() verifica si todos los elementos en el arreglo pasan la prueba implementada por la función dada:

    function tamañoValido(elemento, indice, arreglo) {
      return elemento >= 10;
    }
    [12, 5, 8, 130, 44].every(tamañoValido);   // false
    [12, 54, 18, 130, 44].every(tamañoValido); // true    
  • .filter() Crea un nuevo array con aquellos elementos que cumplan la condición:

    function tamañoValido(elemento) {
      return elemento >= 10;
    }
    var filtrados = [true, 134, 10, 0, null, "Hola"].filter(tamañoValido);
  • .forEach() Se ejecuta la función por cada elemento del array:

    function logger(element, index, array) {
        console.log("array[" + index + "] = " + element);
    }
    [2, 5, 9].forEach(logger);
  • .indexOf() Devuelve la posición donde se escuentra el elemento o -1 si no lo encuentra:

    var array = [2, 5, 9];
    var index = array.indexOf(9); // 2
    var index = array.indexOf(12); // -1
  • .join() Une todos los elementos en una cadena:

    var array = ['dato1', 2, , 'masDatos'];
    var datosJuntos = array.join();      // 'dato1,2,masDatos'
    var datosJuntos2 = array.join('');    // 'dato12masDatos'
    var datosJuntos3 = array.join(' + '); // 'dato1 + 2 + masDatos'
  • .lastIdexOf() Devuelve la posición del último elemento que coincide o -1 si no lo encuentra:

    var array = [7, 1, 3, 7];
    array.lastIndexOf(7); // 3
    array.lastIndexOf(2); // -1
  • .reduce() Nivel Avanzado ♦️ Aplica una función a un acumulador y a cada valor de un vector para reducirlo a un único valor:

    // SIN REDUCE
    var lista = [0,-3,1,2,4,6]
    var acumulacion = 0;
    
    for (let i = 0; i < lista.length; i++) {
        acumulacion += lista[i];
    }
    console.log(acumulacion); // 10
    
    // CON REDUCE
    var lista = [0,-3,1,2,4,6]
    var acumulacion = lista.reduce(function(valorAnterior, valorActual, indice, vector){
      return valorAnterior + valorActual;
    });
    console.log(acumulacion); // 10
  • .reduceRight() Nivel Avanzado ♦️ Aplica una función a un acumulador y a cada valor (de dcha. a izq.) de un vector para reducirlo a un único valor:

    var reduceRight = [0,-3,1,2,4,6].reduce(function(valorAnterior, valorActual, indice, vector){
      return valorAnterior + valorActual;
    });
    console.log(reduceRight); // 10
  • .reverse() Invierte el orden de un Array:

    var miArray = ['uno', 2, true, 'más datos...'];
    miArray.reverse(); 
    console.log(miArray) // ["más datos...", true, 2, "uno"]
  • .slice() Devuelve un nuevo Array con un segmento determinado del Array original:

    var frutas = ['Platano', 'Naranja', 'Limón', 'Manzana', 'Mango'];
    var citricos = frutas.slice(1, 3);
    console.info(citricos);
  • .some() Verifica si alguno de los elementos en el arreglo pasan la prueba implementada por la función dada::

    function tamañoValido(elemento, indice, arrreglo) {
      return elemento >= 10;
    }
    [12, 5, 8, 130, 44].some(tamañoValido);   // true
    [12, 54, 18, 130, 44].some(tamañoValido); // true
  • .sort() **:

    var frutas = ['Platano', 'Naranja', 'Limón', 'Manzana', 'Mango'];
    frutas.sort(); // ["Limón", "Mango", "Manzana", "Naranja", "Platano"]
    
    var miArray = ['uno', 2, true, 'más datos...'];
    miArray.sort(); // [2, "más datos...", true, "uno"]
  • .toLocalString() Retorna como string (configuración regional) todos los elementos:

    var numero = 1337.89;
    var fecha = new Date();
    var miArray = [numero, fecha, 'más datos'];
    
    var arrayConvertida = miArray.toLocaleString(); 
    console.log(arrayConvertida);     
  • .toString() Retorna una cadena de texto con todos los nombres:

    var amigos = ['Luis', 'Carlos', 'Marco', 'Eduardo'];
    console.log(amigos.toString());
  • .unShift() Añade nuevos elementos al principio del array y devuelve la longitud actualizada:

    var miArray = [1, 2];
    
    miArray.unshift(true, "otros datos...");
    console.log(miArray);

Ejercicios

1 - Diseña un algoritmo que cuente las veces que aparece una determinada letra en una frase.

	function cuantasVeces (letra, texto) {
        
        var totalVeces = 0;
        var seleccionTexto = texto.split("");
        
        for (var i = 0; i <= seleccionTexto.length; i++) {
            
            if (seleccionTexto[i] === letra){
                totalVeces++
            };
            
        };
        
        return {
            letra: letra, 
            totalVeces: totalVeces, 
            texto: texto
        }
    }

var nombreVar = cuantasVeces ("h", "hola");


if(nombreVar.totalVeces > 0){
    console.log("Tenemos resultados....")
}

console.log("Se repite "+nombreVar.letra+" "+nombreVar.totalVeces+" veces... en "+nombreVar.texto)

Nivel Medio ♠️ Arreglos avanzados

	var arreglo1 = ["plátano", "fresa", "lima", "manzana"];
var arreglo2 = ["entrante", "primero", "segundo", "postre"];

var juntandoArreglos = [arreglo1, arreglo2];

function testArreglos () {
    console.log(juntandoArreglos[0][0]);
    console.log(juntandoArreglos[1][3]);
};

Tiempo para proyecto personal

img_promo