Capítulo 7 - Cadenas de texto

Información

Uno de los grandes cambios que llegaron con ECMA6 son las plantillas de cadenas de texto. Que nos permiten almacenar un texto con espacios, tabulaciones, saltos de líneas... y además nos aporta postprocesado e interpolación de expresiones.

Propiedades

.length()

Devuelve la longitud de la cadena, lo que resulta muy importante ya que podremos utilizar bucles para recorrer cada una de las letras...

var cadena = "JavaScript, ¡Inspírate!";
console.log("JavaScript, ¡Inspírate! tiene " + cadena.length + " caracteres.");
console.log("Una cadena vacía tiene " + ''.length + " caracteres.");

Métodos

Hacemos una recopilación simplificada de los métodos más utilizados, aunque existen muchos más.

.toLowerCase()

Devuelve todo en minúsculas.

console.log('¡INSPÍRATE!'.toLowerCase());

.toUpperCase()

Devuelve todo en mayúsculas.

console.log('¡inspírate!'.toUpperCase());

.fromCharCode()

Devuelve una cadena creada mediante una secuencia Unicode.

console.info("Es el año 2016 ("+ String.fromCharCode(8559,8559,8553,8548,8544) + ")");

.anchor()

Crea un link interno (ancla) HTML.

document.body.innerHTML = "Contenidos".anchor("contenidos");
// "<a name="contenidos">Contenidos</a>"

.charAt()

Devuelve el carácter específico.

var cadena = "JavaScript, ¡Inspírate!";
console.log("El carácter(posición) 3 es '" + cadena.charAt(3) + "'")

.charCodeAt()

Devuelve el valor Unicode.

var cadena = "JavaScript, ¡Inspírate!";
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 la posición del elemento si es capaz de localizarlo o -1 en caso contrario.

"Mundo Web".indexOf("Web") // 6
"Mundo Web".indexOf("web") // -1

.lastIndexOf()

Devuelve la ultima localización del elemento si es capaz de encontrarlo o -1 en caso contrario.

"JavaScript, ¡Inspírate!".lastIndexOf("c"); // 16
"JavaScript, ¡Inspírate!".lastIndexOf("b"); // -1

.link()

Crea un enlace.

var textoActivo="JavaScript, ¡Inspírate!"
var url="https://leanpub.com/javascript-inspirate/"
document.body.innerHTML = "Haga click para volver a " + textoActivo.link(url);

.trim()

Elimina espacios vacíos al principio y al final de la cadena.

console.log('    ¡inspírate! '.trim()); // ¡Inspírate!

.slice()

Devuelve una cadena nueva con una sección de otra.

var cadena = "JavaScript, ¡Inspírate!";
console.log(cadena.slice(12));      // ¡Inspírate!
console.log(cadena.slice(0, 10));   // JavaScript
console.log(cadena.slice(13, -1));  // Inspírate

.split()

Divide una cadena usando un separador y retorna un array.

var cadenaMeses = "Jan,Feb,Mar,Apr,May,Jun,Jul,Aug,Sep,Oct,Nov,Dec";
var meses = cadenaMeses.split(",");
console.log("Los meses son un Array?", Array.isArray(meses))

.substr()

Devuelve los caracteres de una cadena, comenzando en la localización especificada, y en el número de caracteres especificado.

var cadena = "JavaScript, ¡Inspírate!";
console.log("cadena.substr(12, 12):", cadena.substr(12, 12));
console.log("cadena.substr(0,10):", cadena.substr(0, 10));

.substring()

Devuelve un subconjunto.

var cadena = "JavaScript, ¡Inspírate!";
console.log("(0,5): "    + cadena.substring(0,10));

Información

Como puedes ver existen muchos métodos similares para retornar partes de una cadena. Sin embargo cada uno tiene matices que los hacen diferentes. Te recomiendo leer Using Slice(), Substring(), And Substr() in Javascript de Ben Naden.