O truncamento de texto é uma técnica usada para lidar com conteúdo que transborda seu contêiner, escondendo a parte extra e substituindo-a por reticências (...). Aqui estão as maneiras de implementar isso em CSS, JavaScript e PHP.

Truncamento de Texto com CSS

overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;

Truncamento de Texto com JavaScript

let paragrafo = "Este é um exemplo de texto que será truncado se for muito longo.";
if (paragrafo.length > 45) {
    let textoTruncado = paragrafo.substring(0, 45 - 3) + '...'; // Subtrai 3 para adicionar as reticências
    console.log(textoTruncado); // Exibe o texto truncado
}

Truncamento de Texto com PHP

$string = "Este é um exemplo de texto que será truncado.";
$textoTruncado = mb_strimwidth($string, 0, 15, "...");
echo $textoTruncado; // Exibe: "Este é um e..."

Type Conversion, ou Typecasting, refere-se à mudança de um tipo de dado para outro. A conversão implícita ocorre quando o compilador ou o tempo de execução automaticamente transformam os tipos de dados. Além disso, o código fonte pode explicitamente demandar uma conversão para acontecer.

Conversão de uma String para Number

O método global Number() converte uma variável (ou um valor) em um número.

Uma string numérica (como “3.14”) é convertida em um número (como 3.14).

Uma string vazia (como “”) é convertida em 0.

Uma string não numérica (como “John”) se converte em NaN.

Number("3.14")
Number(Math.PI)
Number("")
Number("")

Métodos Numéricos

Conversão de Números em Strings

O método toString() é o método interno de um objeto Number que permite a mudança de qualquer valor do tipo Number para um tipo String.

Para utilizar é fácil, basta chamar o método em um valor do tipo Number.

let num = 15;
var str = num.toString();
console.log(num); // 15
console.log(str); // "15"

Sistema que são válidos para a conversão:

• Sistema binário (de base 2), que têm dois algarismos – 0 e 1
• Sistema ternário (de base 3), que têm três algarismos – 0, 1 e 2
• Sistema quaternário (de base 4), que têm quatro algarismos – 0, 1, 2 e 3
• E assim por diante até o sistema Hexatridecimal (de base 36), que tem a combinação dos números arábicos (de 0 a 9) com as letras latinas de A até Z

Utilizando o método toString(), podemos fazer também a conversão de um número decimal para obter um valor em binário.

Da seguinte maneira:

var str = (5).toString(2);
console.log(str); // "101"

Assim como podemos fazer a utilização de parâmetros radix:

Number.toString(radix);

O parâmetro “radix” refere-se à base númerica utilizada na interpretação de uma string como um número inteiro.

Por padrão, o método toString() converte um número para sua representação em base 10. No entanto, você pode usar o parâmetro para converter o número em uma base diferente.

let numero = 10;
console.log(numero.toString()); // Saída: "10" (em base 10)
console.log(numero.toString(2)); // Saída: "1010" (em base 2, binária)
console.log(numero.toString(8)); // Saída: "12" (em base 8, octal) 
console.log(numero.toString(16)); // Saída: "a" (em base 16, hexadecimal)

Também podemos converter uma Array para uma String utilizando o método:

let arr = [ "Tok", "Digital" ];
let str = arr.toString();

console.log(str); // "Tok,Digital"

Tal como booleanos:

let bool = true;
let str = bool.toString();

console.log(str); // "true"

O Operador Unary

Um operador unário trabalha em um operando e são eles:

Unário Mais + 
que converte um operando em um número.

let a = 10;
a = +a; // 10

Unário Menos - 
que converte um operando em um número e nega o valor depois dele.

let a = 10;
a = -a; // -10

Se o valor é um número, o operador unário plus não causa efeito algum, no entanto o operador unário minus torna o valor negativo.

Caso você aplique os operadores unários plus ou o minus em um valor não numérico, ele realiza a mesma conversão que a função Number().

let s = "10";
console.log(+s); // 10

Nesse exemplo, s é uma string. Entretanto, quando colocamos o operador unário plus na frente dele, a string s é convertida em um número.

A seguir podemos ver que o operador unário converte valores booleanos em números, false em 0 e true em 1.

let verdadeiro = true;
let falso = false;
console.log(+verdadeiro); // 1
console.log(+falso); // 0

Operadores de incremento e decremento

Inspirado na linguagem de programação C, o conceito de incremento possui um significado sugestivo: aumentar um valor existente em 1 unidade. Da mesma forma, o decremento realiza o oposto, diminuindo o valor em 1 unidade. Esses operadores podem ser aplicados como prefixos ou sufixos, e sua escolha afeta o momento em que a operação é realizada em relação à avaliação da expressão.

Incremento prefixo e sufixo ++
que adiciona um ao seu operando.

let inc = 9;
++inc;
console.log(inc); // 10

No exemplo acima o operador de incremento como prefixo adiciona sobre o valor de inc, 1 unidade a mais.

Decremento prefixo e sufixo -- 
que subtrai um do seu operando.

let dec = 10;
--dec;
console.log(dec); // 9 

O incremento e decremento agora atuando como sufixo funciona da mesma maneira que utilizado como prefixo. A única diferença é que ao invés da operação ser executada depois da resolução, utilizando o sufixo, a operação é executada antes mesmo da resolução.

Prefixo:

let i = 10, j = 20;
let op = i-- + j;
console.log(op); // 30
console.log(op); // 9

Sufixo:

i = 10;
let op = --i + j;
console.log(op); // 29
console.log(i); // 9

Quando você usa o operador de incremento ou decremento como sufixo (i-- ou i++), a operação é realizada após a resolução da expressão. Isso significa que, no caso de i--, o valor de i é usado na expressão, e então i é decrementado.

console.log(op); // 30 
console.log(op); // 9

Por outro lado, quando você usa o operador como prefixo (--i ou ++i), a operação é realizada antes da resolução da expressão. Portanto, no caso de --i, i é primeiro decrementado e, em seguida, o valor de i decrementado é usado na expressão.

console.log(op); // 29 
console.log(i); // 9

Tabela de Conversão de Tipos JavaScript

Os softwares lidam frequentemente com uma grande quantidade de dados, os quais podem assumir uma variedade de formas e propósitos. Cada tipo de dado possui suas características específicas como o uso e implementações subjacentes. Possuem também conceitos abstratos que permitem organizar e classificar os dados com base em seus valores e nas operações que podem ser realizadas sobre eles.

Por exemplo, considere o tipo de dado int, amplamente utilizado em diversas linguagens de programação. Matematicamente, sabemos que os números inteiros variam de infinito negativo até o infinito positivo, incluindo todos os números inteiros entre esses extremos. No entanto, no contexto das máquinas, os números inteiros são finitos, limitados a uma faixa específica.

Existem situações em que um tipo de dado representa um único valor sem possibilidade de realizar operações sobre ele. Em outros casos, um tipo de dado pode representar um conjunto quase infinito de valores (limitado pela memória disponível), com suporte a uma ampla gama de operações.

Dinamismo

JavaScript é reconhecido por ser uma linguagem dinâmica, apresentando tipos também dinâmicos. Ao contrário de algumas linguagens, as variáveis em JavaScript não estão rigidamente vinculadas a um tipo específico de valor. Na verdade, uma variável pode receber e, posteriormente, reatribuir valores de qualquer tipo:

let x = 42; // x Agora é um número
x = "Ola"; // x Agora é uma string
x = true; // x Agora é um booleano

Embora as coerções implícitas sejam convenientes em muitos casos, elas podem ocasionalmente gerar bugs sutis, especialmente quando as conversões ocorrem em momentos inesperados ou na direção contrária à esperada (por exemplo, de string para número, em vez de número para string). Para symbol e BigInts, o JavaScript proibiu intencionalmente certas conversões implícitas de tipo.

Tipos Primitivos

Os tipos primitivos em JavaScript são fundamentais para o funcionamento da linguagem. Entre eles, temos os objetos de wrapper, que são objetos que fornecem funcionalidades adicionais e métodos em torno dos tipos primitivos correspondentes. Por exemplo, o objeto String fornece métodos como toUpperCase() e substring(), que são úteis para manipulação de strings.

Quando tentamos acessar propriedades em valores primitivos, o JavaScript automaticamente converte o valor primitivo em um objeto wrapper correspondente, permitindo o acesso à propriedade desejada. No entanto, é importante notar que acessar propriedades em valores null ou undefined resulta em uma exceção TypeError, que pode ser tratada usando o operador de encadeamento opcional (?.).

Esses objetos de wrapper são úteis para fornecer funcionalidades adicionais aos tipos primitivos, tornando mais fácil e conveniente trabalhar com eles em JavaScript.

Na maioria das vezes, um valor primitivo é representado diretamente no nível mais baixo da implementação da linguagem.

Null

Em JavaScript, null não é uma referência a um objeto inexistente ou um endereço de memória nulo que não aponta para nenhum local válido na memória do sistema como em algumas outras linguagens. Ele é apenas um valor especial que representa “nada”, “vazio” ou “valor desconhecido”.

let age = null;

Undefined

O valor undefined cria um tipo próprio assim como null e tem como significado “valor não atribuído”, ou seja, se uma variável for declarada, mas não atribuída, então seu valor será undefined:

let age;

alert(age); // exibe "undefined"

O código acima afirma que age é um valor undefined.

É possível também atribuir explicitamente undefined a uma variável:

let age = 100;

// change the value to undefined
age = undefined;

alert(age); // "undefined"

Mas não é recomendado o seu uso. O comum é a utilização do null para atribuir um valor “vazio” ou “desconhecido a uma variável, enquanto undefined é reservado como valor padrão para coisas não atribuídas.

O código acima afirma que age é um valor undefined.

Boolean

O tipo booleano possui apenas dois valores: verdadeiro e falso. Este tipo é comumente usado para armazenar valores sim/não: verdadeiro significa “sim, correto” e falso significa “não, incorreto”.

let verificaNome = true; // sim, nome verificado
let verificaIdade= false; // não, idade não verificada

Os valores booleanos também se aplicam a comparações:

let ehMaior = 4 > 1;

alert( ehMaior ); // sim, o resultado afirma que 4 é maior que 1.

O código acima afirma que variável let é um valor booleano.

Number

O tipo de dado Number representa números, tanto inteiros quanto de ponto flutuante. Esses números podem ser usados em uma variedade de operações matemáticas, como adição, subtração, multiplicação e divisão, entre outras.

let n = 123;
n = 12.345;

Além dos números regulares, o tipo “number” também inclui valores especiais:

• Infinity: O infinito na matemática representa um valor especial maior que qualquer número. Podemos obtê-lo como resultado da divisão por zero:

Obtendo pelo resultado com a divisão por “0”:

alert( 1 / 0 ); 

Referenciando diretamente:

alert( Infinity ); 

• Infinity: Similar ao “Infinity”, mas negativo.

• NaN (Not-a-Number): Representa um erro computacional e é retornado quando uma operação matemática é indefinida ou incorreta.

Por exemplo:

alert( "sou string" / 2 ); // NaN, tal divisão é incorreta pois não se pode dividir string por number

O código acima afirma que a divisão está para NaN.

Se um valor NaN estiver envolvido em qualquer parte de uma expressão matemática, ele propagará o resultado como NaN. No entanto, uma exceção é a operação "NaN ** 0", que retorna 1.

BigInt

O tipo “Number” tem limitações em relação à representação segura de números inteiros. Embora seja capaz de armazenar números inteiros consideravelmente grandes, como até 1,7976931348623157 * 10^308, há um ponto onde a precisão é comprometida. Especificamente, números inteiros maiores que (2^53-1) ou menores que -(2^53-1) não podem ser representados com precisão dentro do tipo number.

Em termos práticos, isso significa que valores inteiros ímpares além do limite de (2^53-1) não podem ser armazenados como “number”. Embora para muitos casos de uso, o intervalo entre -(2^53-1) e (2^53-1) seja suficiente, certas aplicações como criptografia demandam a capacidade de lidar com números inteiros realmente grandes.

Para atender a essa necessidade, o JavaScript introduziu o tipo BigInt, que permite representar números inteiros de comprimento arbitrário. Um valor BigInt é criado anexando o sufixo “n” ao final de um número inteiro:

// o "n" no final significa que é um BigInt
const bigInt = 1234567890123456789012345678901234567890n;

Sendo assim, podemos trabalhar com números inteiros muito grandes sem perder a precisão necessária para aplicações críticas.

String

São sequências de caracteres, que podem incluir letras, números, símbolos e espaços. Podendo ser definidas utilizando aspas simples (”), aspas duplas (“”) ou acento grave (“).

// Aspas simples
alert('hello');

// Aspas duplas
alert("hello");

// Backticks
alert(`hello`);

Não há alguma diferença em usar aspas duplas ou simples no JavaScript, porém o uso de Backticks é marcado com uma “funcionalidade estendida”. Eles nos permitem incorporar variáveis ​​e expressões em uma string envolvendo-as em ${…}.

let nome = "John";

// incorporando uma variável
alert( `Olá, ${nome}!` ); // Olá, John!

// incorporando uma expressão
alert( `O resultado é: ${1 + 2}` ); // O resultado é 3

O código acima afirma que a soma da adição é 3.

A expressão dentro de ${…} é avaliada e o resultado é incorporado à string. Dentro desses delimitadores, você pode colocar qualquer coisa: desde variáveis como nome, expressões aritméticas ou algo mais complexo. É importante notar que essa funcionalidade de incorporação só está disponível dentro de crases (“); outras formas de citação sendo aspas simples ou duplas, não possuem essa capacidade, como abordado anteriormente.

Symbol

É um tipo de dado especial utilizado para criar identificadores únicos para objetos. Enquanto os tipos primitivos como strings e números, podem conter apenas uma única entidade, os objetos são usados para armazenar coleções de dados e entidades mais complexas.

Quando se trata de Symbol, sua principal característica é sua unicidade. Cada elemento criado é único, o que significa que dois elementos nunca serão iguais, mesmo que tenham a mesma descrição. Isso os torna úteis para criar propriedades de objetos que devem ser exclusivas e não entrar em conflito com outras propriedades.

No entanto, os detalhes sobre o tipo de dado em questão geralmente são discutidos após uma compreensão completa de objetos, pois ambos são frequentemente utilizados em conjunto para criar propriedades especiais. Essas propriedades podem ser acessadas e manipuladas de forma distinta das propriedades tradicionais de objetos.

O operador typeof é útil para determinar o tipo de dado de uma variável ou expressão. Quando aplicado, o typeof retornará 'symbol', o que permite identificar facilmente se um valor é ou não um symbol. Isso é útil em situações em que é necessário processar valores de diferentes tipos de maneira distinta ou realizar verificações rápidas de tipo.

typeof undefined // "undefined"

typeof 0 // "number"

typeof 10n // "bigint"

typeof true // "boolean"

typeof "foo" // "string"

typeof Symbol("id") // "symbol"

typeof Math // "object"  (1)

typeof null // "object"  (2)

typeof alert // "function"  (3)

O resultado de typeof null ser um “object” é oficialmente reconhecido como um erro a muito tempo do typeof.

Mas seu uso não ocasionará problemas com o código por si só, apenas quando houver divergência na verificação de tipos. Isso porque, “computacionalmente” falando, null não deveria ser um object mas sim um tipo primitivo próprio. Este é um dos bugs mais famosos do JavaScript, que não teve como ser consertado em versões posteriores pela particularidade do JavaScript de ser uma linguagem interpretada no lado “cliente” da requisição.

Portanto, concluímos “Tipos de dados” imaginando uma caixa de ferramentas. Cada ferramenta na caixa tem um propósito específico e é armazenada de uma maneira particular.

Para cada tipo podemos dizer que:

1. Number: São como chaves inglesas e parafusos. Por exemplo, você tem a chave inglesa número 10 e o parafuso número 8.
2. Strings: São como etiquetas ou rótulos em suas ferramentas e usados para identificar ou descrever algo. Por exemplo, você pode ter uma etiqueta com o nome da marca ou algum tipo de rótulo fornecendo informações sobre a ferramenta.
3. Booleanos: Imagine que você tem um interruptor em cada ferramenta que pode estar ligado (true) ou desligado (false). Por exemplo, você pode ter um interruptor na sua parafusadeira que, quando ativado, permanece em true, e quando desativado, permanece em false.
4. Null e Undefined: Às vezes, em sua caixa de ferramentas, você pode ter espaços vazios onde deveria haver uma ferramenta, mas ainda não está lá (undefined). Ou você pode ter uma gaveta que está totalmente vazia (null), sem ferramentas dentro dela.