(Re) Aprendendo Javascript da maneira certa

PREFÁCIO

Na época em que aprendi codificação pela primeira vez, consumi conhecimento do que pode ser mais bem descrito como algo aleatório. Minha educação em javascript tipifica essa experiência. Na maioria das vezes, eu copiava e colava código e alterava o nome de uma variável aqui ou um elemento DOM ali para conseguir o que queria. O resto do código pode muito bem ter sido escrito em fenício.

Agora que estou programando profissionalmente, descobri que esses atalhos estão me alcançando. Quando eu estava na escola, a melhor maneira de aprender um assunto era tomando notas abundantes. No momento, estou fazendo um curso de reddit sobre como aprender Javascript corretamente. O teste que estou usando para o curso é Javascript Profissional para Desenvolvedores da Web e Javascript Eloquent. Como adendo, estou adicionando coisas que me fizeram humm e coisas que acho interessantes, mágicas e misteriosas. Isso me faz sentir como uma criança grande, aprendendo tudo de novo.

Semana 1

<script type=”text/javascript”>
//<![CDATA[
function compare(a, b) {
if (a < b) {
alert(“A is less than B”);
} else if (a > b) {
alert(“A is greater than B”);
} else {
alert(“A is equal to B”);
}
}
//]]>
</script>

Aahh, então é isso que a seção CDATA significa. Se você tem javascript embutido e deseja que sua página seja um documento XHTML válido, você deve incluí-lo como abaixo. Alguns navegadores não eram totalmente compatíveis com XHTML, então outras medidas tiveram que ser tomadas e é por isso que você vê a tag de comentário js. Criar sites costumava ser um assunto doloroso!

function doSomething(){
“use strict”;
//function body
}

Os pontos-e-vírgulas ajudam no desempenho porque os analisadores tentam corrigir erros de sintaxe inserindo ponto-e-vírgulas. Além disso, reduzir o código js é quase impossível sem eles. Pode ser por isso que tivemos tantos problemas de javascript difíceis de rastrear em nosso site de produção quando tudo funcionava bem em nosso local. D’oh!

Sempre use blocos de código, mesmo para instruções if de uma linha. Se você está minimizando o código, o espaço extra não importa

function test(){
var message = “hi”; //local variable
}
test();
alert(message); //error!

VS

function test(){
message = “hi”; //global variable
}
test();
alert(message); //”hi”

Diferença muito sutil, mas poderosa. Isso é importante para fechamentos como recall. O escopo da variável Javascript é estranho. No entanto, variáveis ​​globais realmente não devem ser definidas em uma função se você puder evitar.

var message = “hi”,
    found = false,
    age = 29;

Embora variáveis ​​não inicializadas recebam automaticamente um valor de
indefinido, é aconselhável sempre inicializar as variáveis. Dessa forma, quando typeof
retornar “undefined”, você saberá que é porque uma determinada variável não foi
declarada ao invés de simplesmente não foi inicializada.

Ao definir uma variável que posteriormente contém um objeto, é aconselhável inicializar a variável como nula ao invés de qualquer outra coisa.

Palavras sábias

var num3 = parseInt(“10”, 10); //10 - parsed as decimal

Sempre inclua 10 como o segundo argumento para analisar como decimal

label: statement
Here’s an example:
start: for (var i=0; i < count; i++) {
alert(i);
}

*In this example, the label start can be referenced later by using the break or continue statement.* 

var qs = location.search.substring(1);
var hostName = location.hostname;
var url = location.href;
Here, the location object is used on every line. This code can be rewritten using the with
statement as follows:
with(location){
var qs = search.substring(1);
var hostName = hostname;
var url = href;
}

function doAdd() {
if(arguments.length == 1) {
alert(arguments[0] + 10);
} else if (arguments.length == 2) {
alert(arguments[0] + arguments[1]);
}
}
doAdd(10); //20
doAdd(30, 20); //50