vuoto funzione Javascript? Cosa significa?

Question

Così la versione breve, quello che non capisco è questa riga di codice:

(new Function("paper", "window", "document", cd.value)).call(paper, paper); 

La versione lunga, guarda queste funzioni:

window.onload = function() { 
      var paper = Raphael("canvas", 640, 480); 
      var btn = document.getElementById("run"); 
      var cd = document.getElementById("code"); 

      (btn.onclick = function() { 
       paper.clear(); 
       paper.rect(0, 0, 640, 480, 10).attr({fill: "#fff", stroke: "none"}); 
       try { 
        (new Function("paper", "window", "document", cd.value)).call(paper, paper); 
       } catch (e) { 
        alert(e.message || e); 
       } 
      })(); 
     }; 

Questo codice è da Raffaello parco giochi, che significa che implementa la biblioteca di Raffaello. Quindi la singola riga di codice nella parte superiore che non capisco (è all'interno dell'espressione try/catch), supponiamo di copiare il codice inserito dall'utente che è memorizzato all'interno di cd.value nella funzione. Ma come è possibile?

È possibile visitare la pagina qui: http://raphaeljs.com/playground.html

Answer 1

Ti capire cosa fa new Function()? È simile a eval() in quanto richiede una stringa di codice javascript - utilizza quella stringa per definire una funzione. Così la linea che hai postato sarebbe equivalente a fare:

(function(paper,window,document){ 
    /* the code in the cd.value string goes here */ 
}).call(paper,paper);

Maggiori informazioni: https://developer.mozilla.org/en/Core_JavaScript_1.5_Reference/Objects/Function

Answer 2

La funzione costruttore di classe

functionName = new Function("function code should be written here");

Questo costrutto valuta il codice come una stringa, ed è molto più lento rispetto l'assegnazione di funzioni anonime. Dovrebbe essere utilizzato solo nei luoghi in cui è effettivamente necessario.

La funzione di classe costruttore con parametri

functionName = new Function("varName","varName2","etc.","function code");

Sembra cd.value() fornisce una stringa con codice javascript che sta per essere analizzato e compilato. Più tardi lo chiami ...

Dovresti controllare come appare il codice in cd.value.

Answer 3

E 'fondamentalmente la creazione di un nuovo oggetto funzione con un corpo dinamico ... il modo migliore che posso spiegare è come questo:

function (paper, window, document) where {} = cd.value; 

Ecco una risorsa per saperne di più: http://www.permadi.com/tutorial/jsFunc/index.html

Answer 4

La funzione Function crea una nuova istanza funzione con l'ultimo parametro, come il codice della funzione.

Così fa fondamentalmente la stessa:

eval("function(paper,window,document){"+cd.value+"}").call(paper, paper); 

Procedimento call chiama semplicemente la funzione con gli elementi nella paper array per argomenti.

Answer 5

Gli argomenti a Function sono i parametri denominati della funzione e quindi il corpo della funzione. In questo caso, hai un elemento il cui id è code e l'attributo value su quell'elemento è un codice JavaScript.Si consideri che avete questo codice HTML da qualche parte nel documento:

<textarea id="code"> 
    var a = "foo"; 
    var b = "bar"; 

    alert(a+b); 
</textarea> 

Ora, il tuo esempio di codice, se eseguito contro questo elemento code, creerebbe la seguente funzione:

function(paper, window, document) { 
    var a = "foo"; 
    var b = "bar"; 

    alert(a+b); 
} 

È possibile dare un'occhiata a the Mozilla Development Center's docs on Function per ottenere una spiegazione più completa su come funziona l'oggetto Function.