9

Qual é a diferença entre new Function e eval, já que os dois parecem fazer a mesma coisa?

Exemplo com eval:

eval('1 + 1'); // 2

Exemplo com new Function:

new Function('', 'return (1+1)')() // 2

2 Respostas 2

7

Elas não fazem a mesma coisa:

eval() avalia uma string como uma expressão JavaScript dentro do escopo atual e pode acessar variáveis locais.

new Function parseia o código para um objeto de função, que pode ser chamado. Ele não pode acessar as variáveis locais, porque o código é executado em um escopo separado.

O que isso quer dizer? Rode esse código:

function testEval() {
    var a = 'original';
    eval("(a = 'alterado')");
    console.log(a);
}

function testNewFunction() {
    var a = 'original';
    new Function("(a = 'alterado')")();
    console.log(a);
}

testEval()
testNewFunction()

Quando usamos eval o valor da variável a é alterado. Quando usamos new Function ela permanece inalterado.

4
  • Acho que você se enganou quanto ao escopo de variáveis, pode dar um exemplo onde o Function não acessa as variáveis que o eval consegue?
    – KaduAmaral
    29/07/2015 às 20:08
  • A grande diferença é essa de escopo mesmo.
    – bfavaretto
    29/07/2015 às 21:05
  • @bfavaretto a grande diferença é que Function retorna uma função, e eval não pode retornar uma função, retorna o resultado de uma expressão.
    – KaduAmaral
    30/07/2015 às 2:09
  • Sim @KaduAmaral, mas Function é muito mais útil (e mais usado) pra criar um eval global do que para criar instâncias de função a serem usadas mais tarde.
    – bfavaretto
    30/07/2015 às 2:18
5

eval

O método eval() avalia código JavaScript representado como uma string. MDN

Function

The Function constructor creates a new Function object. In JavaScript every function is actually a Function object. – MDN

Tradução livre:

O construtor Function cria um novo objeto de função anonima. No Javascript todas as funções atualmente são um objeto de função.


A documentação se auto-explica, basicamente o eval executa uma expressão, statement e etc. Já o construtor Function cria um novo objeto de função com direito a todo o seu prototype.

Exemplos:

var a = new Function('', 'return (1+1)');
var b = eval("2 + a()");
var c = b + a();
var d = new Function("p", "return a() + b + c + p");
var e = eval("d(10) - 20");

console.log(a())   // 2
console.log(b)     // 4
console.log(c)     // 6
console.log(d(10)) // 22
console.log(e);    // 2

No site do W3Schools possui esse exemplo na sessão do construtor Function:

var myFunction = new Function("a", "b", "return a * b");
var x = myFunction(4, 3);

E logo após diz o seguinte seguido de outro exemplo:

You actually don't have to use the function constructor. The example above is the same as writing:

var myFunction = function (a, b) {return a * b};
var x = myFunction(4, 3);

A frase diz o seguinte (tradução livre):

Atualmente você não precisa usar o construtor de funções. O exemplo abaixo tem o mesmo efeito.

2
  • O undescore.js usa o new Function :) na criação de templates 29/07/2015 às 20:59
  • 1
    Bacana @WallaceMaxters, na verdade acho que eu nunca tinha visto o new Function. Sou novo com Javascript, não é do meu tempo... kkkkk
    – KaduAmaral
    29/07/2015 às 21:04

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 .