Melhor açúcar sintático javascript

Question

Aqui estão algumas jóias:

literais:

var obj = {}; // Object literal, equivalent to var obj = new Object();
var arr = []; // Array literal, equivalent to var arr = new Array();
var regex = /something/; // Regular expression literal, equivalent to var regex = new RegExp('something');

Padrões:

arg = arg || 'default'; // if arg evaluates to false, use 'default', which is the same as:
arg = !!arg ? arg : 'default';

Claro que sabemos funções anônimas, mas ser capaz de tratá-los como literais e executá-los no local (como um fecho) é grande:

(function() { ... })(); // Creates an anonymous function and executes it

Pergunta:? O outro grande açúcar sintático está disponível em javascript

Answer 1

Obter a data e hora atual como milissegundos:

Date.now()

Por exemplo, em tempos a execução de uma seção de código:

var start = Date.now();
// some code
alert((Date.now() - start) + " ms elapsed");

Answer 2

teste de associação de objetos:

var props = { a: 1, b: 2 };

("a" in props) // true
("b" in props) // true
("c" in props) // false

Answer 3

Em Mozilla (e supostamente IE7) você pode criar uma constante XML usando:

var xml = <elem></elem>;

Você pode substituir variáveis, bem como:

var elem = "html";
var text = "Some text";
var xml = <{elem}>{text}</{elem}>;

Answer 4

Usando funções anônimas e um fecho para criar uma variável privada (ocultamento de informações) eo get associado / métodos definidos:

var getter, setter;

(function()
{
   var _privateVar=123;
   getter = function() { return _privateVar; };
   setter = function(v) { _privateVar = v; };
})()

Answer 5

A capacidade de estender tipos JavaScript nativos via herança prototípica.

String.prototype.isNullOrEmpty = function(input) {
    return input === null || input.length === 0;
}

Answer 6

Use === para comparar o valor e tipo:

var i = 0;
var s = "0";

if (i == s)  // true

if (i === s) // false

Answer 7

cordas Multi-line:

var str = "This is \
all one \
string.";

Uma vez que você não pode recuar as linhas subseqüentes sem também adicionando o espaço em branco na seqüência, as pessoas geralmente preferem concatenar com o plus operador. Mas este não fornecer uma boa aqui documentar capacidade.

Answer 8

Redimensionar o comprimento de um Array

propriedade de comprimento é um não somente leitura . Você pode usá-lo para aumentar ou diminuir o tamanho de uma matriz.

var myArray = [1,2,3];
myArray.length // 3 elements.
myArray.length = 2; //Deletes the last element.
myArray.length = 20 // Adds 18 elements to the array; the elements have the empty value. A sparse array.

Answer 9

Repetindo uma string como "-" um número específico de vezes por alavancar o método join em uma matriz vazia:

var s = new Array(repeat+1).join("-");

Os resultados em "---" quando repita == 3.

Answer 10

Como o operador padrão, || é o operador de guarda, &&.

answer = obj && obj.property

em oposição a

if (obj) {
    answer = obj.property;
}
else {
    answer = null;
}

Answer 11

var tags = {
    name: "Jack",
    location: "USA"
};

"Name: {name}<br>From {location}".replace(/\{(.*?)\}/gim, function(all, match){
    return tags[match];
});

callback para texto de substituição é apenas útil.

Answer 12

Getters e setters :

function Foo(bar)
{
    this._bar = bar;
}

Foo.prototype =
{
    get bar()
    {
        return this._bar;
    },

    set bar(bar)
    {
        this._bar = bar.toUpperCase();
    }
};

Dá-nos:

>>> var myFoo = new Foo("bar");
>>> myFoo.bar
"BAR"
>>> myFoo.bar = "Baz";
>>> myFoo.bar
"BAZ"

Answer 13

Este não é um exclusivo javascript, mas salva como três linhas de código:

check ? value1 : value2

Answer 14

Um pouco mais sobre o exemplo de levik:

var foo = (condition) ? value1 : value2;

Answer 15

O Array # forEach em Javascript 1.6

myArray.forEach(function(element) { alert(element); });

Answer 16

A seguir obj || {Default: true} sintaxe:

chamando a função com este: Olá (neededOne && neededTwo && needThree) se um parâmetro é indefinido ou falsa, então ele irá chamar Olá (false), por vezes útil

Answer 17

Na análise de situações com um conjunto fixo de componentes:

var str = "John Doe";

Você pode atribuir os resultados diretamente em variáveis, utilizando a "atribuição desestruturação" synatx:

var [fname, lname] = str.split(" ");
alert(lname + ", " + fname);

O que é um pouco mais legível do que:

var a = str.split(" ");
alert(a[1] + ", " + a[0]);

Como alternativa:

var [str, fname, lname] = str.match(/(.*) (.*)/);

Note que esta é uma característica 1,7 Javascript. Então, isso é Mozilla 2.0+ e Chrome 6+ navegadores, neste momento.

Answer 18

Imediatamente Chamado Seta função:

var test = "hello, world!";
(() => test)(); //returns "hello, world!";

Answer 19

Eu esqueci:

(function() { ... }).someMethod(); // Functions as objects

Answer 20

Criar um literal objeto anônimo com simplesmente: ({})

Exemplo: necessidade de saber se os objetos têm o método valueOf:

var hasValueOf = !! ({}). ValueOf

Bonus açúcar sintático: a dupla-não '!!' para converter praticamente qualquer coisa em um booleano de forma muito sucinta.

Answer 21

Eu adoro ser capaz de eval () uma string JSON e voltar uma estrutura de dados totalmente preenchido. Eu odeio ter que escrever tudo pelo menos duas vezes (uma vez para o IE, novamente por Mozilla).

Answer 22

A atribuição de palavras-chave usadas com freqüência (ou quaisquer métodos) para as variáveis ??simples como isto

  var $$ = document.getElementById;

  $$('samText');

Answer 23

classe Date de JavaScript fornecendo uma semi- "Fluent Interface". Isto faz-se por não ser capaz de extrair a parte de data de uma classe Data diretamente:

var today = new Date((new Date()).setHours(0, 0, 0, 0));

Não é uma totalmente Fluent Interface porque o seguinte só vai nos dar um valor numérico que não é realmente um objeto Data:

var today = new Date().setHours(0, 0, 0, 0);

Answer 24

Padrão fallback:

var foo = {}; // empty object literal

alert(foo.bar) // will alert "undefined"

alert(foo.bar || "bar"); // will alert the fallback ("bar")

Um exemplo prático:

// will result in a type error
if (foo.bar.length === 0)

// with a default fallback you are always sure that the length
// property will be available.
if ((foo.bar || "").length === 0) 

Answer 25

Aqui está um que eu só descobri: verificação nulo antes de chamar função:

a = b && b.length;

Este é um menor equivalente a:

a = b ? b.length : null;

A melhor parte é que você pode verificar uma cadeia de propriedade:

a = b && b.c && b.c.length;

Answer 26

Eu amo como é simples para o trabalho com listas:

var numberName = ["zero", "one", "two", "three", "four"][number];

E hashes:

var numberValue = {"zero":0, "one":1, "two":2, "three":3, "four":4}[numberName];

Na maioria das outras línguas este seria código bastante pesado. valor padrão também são adoráveis. Por exemplo relatórios código de erro:

var errorDesc = {301: "Moved Permanently",
                 404: "Resource not found",
                 503: "Server down"
                }[errorNo] || "An unknown error has occurred";

Answer 27

int para string elenco

var i = 12;
var s = i+"";

Answer 28

element.innerHTML = "";  // Replaces body of HTML element with an empty string.

Um atalho para apagar todos os nós filho do elemento.

Answer 29

string Converter para número inteiro inadimplente a 0 se imposible,

0 | "3" //result = 3
0 | "some string" -> //result = 0
0 | "0" -> 0 //result = 0

Pode ser útil em alguns casos, principalmente quando 0 é considerado como mau resultado

Answer 30

Template literais

var a = 10;
var b = 20;
var text = `${a} + ${b} = ${a+b}`;

então o texto variável será como abaixo!

10 + 20 = 30