70

Nunca tinha visto antes a utilização desta diretiva, mas quase todos os plugins jQuery mais maduros a utilizam.

Gostaria de saber quando e como utilizá-la e qual a sua finalidade.

9
  • 2
    use strict força o Javascript a usar regras mais restritas pro seu código. Funciona bem se você sabe o que está fazendo. É uma boa prática sempre que você não tem que manter código ruim. 29/01/2014 às 15:44
  • Seria algo como o HTML strict x transitional? Se você tiver um HTML bem feito e escrito você deve usar o strict, mas se você precisar de um pouco mais de flexibilidade em quebrar determinadas regras você usa o transitional. Conseguiria dar um exemplo onde um código JS funcionaria sem o uso dessa diretiva, mas não funcionaria utilizando a mesma? 29/01/2014 às 15:47
  • 1
    Por exemplo, o use strict não permite que você crie variáveis globais acidentalmente. Por exemplo, se fizeres a = 5 dentro de uma function antes de declarar a com var, sem o use strict você criará uma variável global a. Com o use strict, isso causará um erro, porque a não estava definida. 29/01/2014 às 15:50
  • @PhilippeGioseffi: Na verdade, HTML strict e transitional fazem (praticamente) a mesma coisa do ponto de vista do Browser. A diferença que importa é entre documentos sem doctype (renderizados em quirks mode) vs documentos com algum doctype (renderizados segundo o padrão HTML). É por isso que o doctype recomendado hoje em dia é um simples <!doctype html>, sem número de versão.
    – hugomg
    1/02/2014 às 20:25
  • Não sou bem um especialista em HTML, @missingno. Mas pelo que vi o "use strict" também não afeta largamente o uso do JS sem a diretiva, acaba sendo quase a mesma coisa. 3/02/2014 às 13:03

6 Respostas 6

83

Como outros já disseram, o strict mode é um modo mais rigoroso de interpretação da linguagem, que proíbe certas práticas que sempre foram permitidas, mas não são recomendadas (como a criação de variáveis globais implícitas, já mencionadas em outras respostas). Como simplesmente proibir incondicionalmente esse tipo de prática quebraria códigos legados, foi decidido criar a diretiva "use strict"; para ativar o modo estrito.

Existem duas maneiras de se utilizar o "use strict":

  • No topo do arquivo, a diretiva aplica o modo estrito para o arquivo todo.

  • Como a primeira linha de código de uma função, a diretiva aplica o modo estrito somente dentro da função (incluindo outras funções eventualmente declaradas dentro dela).

O grande benefício de se o usar strict mode é reduzir a chance de existirem no código bugs difíceis de localizar (como um conflito de nome ao se criar uma global implícita, ou a existência de duas chaves iguais em objeto literal).

Preparei uma tradução livre e adaptada do Anexo C da especificação da linguagem, que resume as restrições existentes no strict mode:

  • Os identificadores implements, interface, let, package, private, protected, public, static, e yield são palavras reservadas quando utilizados no strict mode.

  • Literais numéricos nunca são considerados octais, nem mesmo quando começam com zero. O mesmo vale para octais escapados em strings, como '\012' (que os browsers modernos nem suportam mais, mesmo fora do strict mode)

  • Tentar atribuir um valor a uma variável que não existe no escopo atual não cria mais uma propriedade no objeto global (ou seja, não cria mais uma variável global). Em vez disso, lança uma exceção do tipo ReferenceError. Além disso, não é possível atribuir para propriedades que tenham o atributo {[[Writable]]:false}, nem para um accessor sem setter definido ({[[Set]]:undefined}), nem para propriedades de objetos cuja propriedade interna [[Extensible]] seja false. Em todos esses casos será lançado um TypeError.

  • Não é possível redefinir eval, nem utilizá-lo com ++ ou --.

  • Se você tentar acessar arguments.caller ou arguments.callee em uma função, será lançado um TypeError.

  • Argumentos nomeados de funções não compartilham valores dinamicamente com as propriedades equivalentes indexadas numericamente. Por exemplo, em function foo(bar) { arguments[0] = 10; }, bar mantém o valor passado na chamada e não assume o valor 10.

  • O mesmo é válido no caso inverso: em function foo(bar) { bar = 10; }, arguments[0] mantém o valor passado na chamada e não assume o valor 10.

  • Se houver mais de uma propriedade com o mesmo nome em um objeto literal, um SyntaxError é lançado.

  • Os identificadores "eval" e "arguments" não podem ser utilizados como nomes de parâmetros de funções que definam getters ou setters em objetos literais (mesmo que o código externo não esteja em strict mode, mas o corpo do getter/setter esteja).

  • O eval em strict mode não pode instanciar variáveis ou funções no escopo de quem chama eval. O código passado ao eval irá criar um novo escopo, onde essas variáveis serão instanciadas.

  • Em strict mode, não há coerção de this para objeto. Em casos onde this for null ou undefined, ele não será convertido para o objeto global. Por exemplo: em function f(){ console.log(this) }; f();, this é undefined em strict mode, e não o objeto global (em browsers, window). Além disso, se um valor primitivo for passado como this, ele não será convertido ao wrapper equivalente.

  • O operador delete lança um SyntaxError quando utilizado em itens não deletáveis como variáveis, funções e argumentos. Por exemplo: delete variavel, delete funcao e function(foo) { delete foo; }.

  • O operador delete lança um TypeError se a propriedade a ser deletada tiver o atributo { [[Configurable]]:false }.

  • Se você tentar declarar uma variável com o nome de "eval" ou "arguments", será lançado um SyntaxError.

  • O uso de with lança um SyntaxError.

  • Numa cláusula catch não é possível utilizar "eval" ou "arguments" como nome da exceção; isso é um SyntaxError.

  • Os identificadores "eval" e "arguments" não podem ser utilizados como nomes de parâmetros de funções; isso é um SyntaxError.

  • Funções não podem ter múltiplos parâmetros com o mesmo nome; isso é um SyntaxError.

  • É proibido às implementações estenderem o significado das propriedades "caller" e "arguments" de instâncias de funções para além do que consta da especificação.

  • É um SyntaxError tentar utilizar "eval" ou "arguments" como nome de função ou parâmetro, assim como tentar forçar isso por meio do construtor Function.

2
  • 2
    Muito elucidativa a explicação, vale muito esse mais um por já citar adições da nova versão. 3/02/2014 às 13:02
  • 2
    Obrigado, @PhilippeGioseffi. E vou tentar melhorar mais a resposta, acho um pouco confusa ainda porque fiz com pressa.
    – bfavaretto
    3/02/2014 às 13:29
20

Javascript é uma linguagem dinâmica e que não foi planejada pras dimensões em que é usada hoje em dia. Então ela tem alguns probleminhas. Por exemplo a declaração de variáveis, se você utilizar uma variável sem var antes, ela se tornará uma variável global, então você pode estar sobrescrevendo um valor que pode estar sendo usado por alguma outra função em algum outro lugar. Esse tipo de coisa causa erros que são muito difíceis de encontrar.

Esse tipo de comportamento é "natural" da linguagem e quebraria um monte de bibliotecas existentes caso fosse tirado da linguagem agora.

O "use strict" serve pra tentar amenizar esses problemas, navegadores que reconhecem essa diretiva vão emitir erros quando encontram código que é javascript válido mas que é potencialmente problemático, como o caso de usar variáveis sem declarar com var. Navegadores antigos que não reconhecem simplesmente ignoram a diretiva.

E como o "use strict" pode ser usado em blocos de código, você pode utilizar dentro das suas novas funções sem precisar refatorar todas suas bibliotecas antigas.

Exemplo de uso:

y = 2;//funciona sem problemas porque esta fora do bloco
function foo() {
  "use strict";
  x = 1;//emite erro em navegadores suportados
}

Referência: http://ejohn.org/blog/ecmascript-5-strict-mode-json-and-more/

7

'use strict' é usado para expor as exceções do seu código javascript, vendo os erros mais detalhadamente

Exemplo

    function isStrictMode(){
      return !this;
    } 
    //retorna falso, uma vez que "this" se refere ao objeto global e '!this' se torna falso

    function isStrictMode(){   
      "use strict";
       return !this;
   } 
  //retorna verdadeiro, pois no modo estrito, a palavra-chave "this" não se refere ao objeto global, ao contrário JS tradicionais. Então, aqui, "this" é nulo e '!this' se torna verdade.
6
  • 1
    Poderia exemplificar? 29/01/2014 às 15:48
  • O link é bom, inclusive inclui link para dizer quais browsers suportam ou não essa diretiva. Não poderei usar aqui, pois sou obrigado a escrever código que rode nos IEs 7 e 8 que não suportam esta diretiva. 29/01/2014 às 15:58
  • 1
    Embora seja uma resposta interessante, ela cobre muito pouco do que a diretiva faz.
    – utluiz
    29/01/2014 às 16:28
  • @utluiz pelo que vi quase todo mundo exemplifica da mesma maneira, falando sobre variáveis globais e não globais através da utilização da declaração da variável com var. 29/01/2014 às 16:32
  • @Philippe Exemplificar é uma coisa. Entretanto, a resposta não diz, por exemplo, que o modo scrict afeta diretamente o modo como o script é executado pela engine. Não estou dizendo que a resposta está ruim ou errada, apenas incompleta.
    – utluiz
    29/01/2014 às 16:35
5

O JavaScript foi originalmente desenhado para ser fácil de aprender por programadores inexperientes. E portanto fizeram do JavaScript uma linguagem em que é permitido fazer todo o tipo de asneiras - o compilador raramente se queixa. Penso que toda a gente já percebeu que é preferível que o compilador nos avise dos erros que cometemos, em vez de silenciosamente ignorar os erros. O "strict mode" muda semântica do JavaScript para um modo mais estrito, em que situações de provável erro são rejeitas pelo compilador. Exemplo:

var length = 1;
...
lenght = 2;  // "length" mal escrito - em JavaScript normal
             // uma nova variável global chamada "lenght" é
             // criada
'use strict';
var length = 1;
...
lenght = 2;  // "length" mal escrito - em "strict mode" uma
             // excepção é lançada

É importante frisar que o "strict mode" muda a semântica do programa. Um programa que funcionava correctamente sem "strict mode", pode deixar de funcionar com o "strict mode" activo. Para além disso o "strict mode" não é suportado por todos os browsers, e portanto é necessário ter cuidado pois código que funciona correctamente com o "strict mode" activo, pode não funcionar em browsers que não suportam o "strict mode".

3

O "use strict" é uma diretiva em que você está diz para o compilador não permitir que você cometa falhas no seu código que não são consideradas erros pelo interpretador, porém podem te causar dores de cabeça. Por exemplo, o Javascript te permite utilizar uma variável sem ser declarada, ou redefinir a variável arguments dentro de funções:

O código abaixo é considerado válido sem o uso da diretiva "use strict":

function f() {
  var arguments = [];
}

x = 0;

Porém, se utilizado "use strict":

"use strict";

function f() {
  var arguments = []; // SyntaxError: Variable name may not be eval or arguments in strict mode
}

x = 0; // ReferenceError: x is not defined
1
  • Me ajudou à achar a diferença do modo estrito e do modo não-estrito... Obrigado!
    – user37626
    13/09/2016 às 22:02
3

O Caio Gondim escreveu um artigo a respeito muito bom no Loop Infinito que diz o seguinte:

O strict mode é uma nova feature do ECMAScript 5 que permite fazer que o código JavaScript rode em um modo mais rigoroso. Neste modo, a engine de JavaScript tem seu comportamento modificado, gerando erros que antes eram silenciados e, até mesmo, proibindo o uso de certas partes da linguagem que são tidas como problemáticas, nos forçando assim a escrever um código de melhor qualidade e ajudando a capturar bugs mais precocemente.

Lá no artigo ele também exemplifica como utilizar. Sugiro dar uma olhada.

http://loopinfinito.com.br/2013/07/16/javascript-strict-mode/

Você deve fazer log-in para responder a esta pergunta.

Esta não é a resposta que você está procurando? Pesquise outras perguntas com a tag .