2015-04-04 12 views
6

hey ragazzi sono nuovo di JS e fondamentalmente sto imparando nuove cose ogni giorno, sto solo imparando cose come, come aggiornare dinamicamente un array e roba, comunque, di solito cerco di raccogliere snippet JS puliti della rete e debuggale, finché non capisco cosa significa veramente. ecco un frammento che ho trovato oggi:comprensione Doppia dichiarazione di ritorno è Javascript

var array1 = [ 
        { tagId: 1, tagName: 'tag 1' }, 
        { tagId: 2, tagName: 'tag 2' }, 
        { tagId: 3, tagName: 'tag 3' }, 
        { tagId: 4, tagName: 'tag 4' } 


     ]; 

     var array2 = [ 
        { tagId: 1, tagName: 'tag 1' }, 
        { tagId: 2, tagName: 'tag 2' }, 
        { tagId: 8, tagName: 'tag 8' } 
      ]; 

     var array3 = [ 
        { tagId: 1, tagName: 'tag 1' }, 
        { tagId: 0, tagName: 'tag 0' }, 
        { tagId: 9, tagName: 'tag 3' }, 
        { tagId: 12, tagName: 'tag 12' }, 
        { tagId: 13, tagName: 'tag 3' }, 
        { tagId: 14, tagName: 'tag 2' }, 
        { tagId: 6, tagName: 'tag 6' }, 
      ]; 


var a4 = common(array1, array2, array3) 
console.log(a4); 

function common(/*…*/) { 
    var a = arguments; 
    res = a[0] 
    for (var i = 1; i < a.length; i++) { 
     res = res.filter(function (el) { 
      return a[i].filter(function (el2) { 
       return el2.tagId === el.tagId 
      }).length 
     }) 
    } 
    return res 
} 

fondamentalmente i soli frammento attraverso array con valori letterali oggetto in loro e li filtra fuori. ora, ecco la mia domanda. essendo un novizio di JS, ho trovato il caso interessante di vedere un sacco di codice JS usare l'istruzione return in rapida successione, o meglio uno dopo l'altro, spesso sono nidificati, questo è un caso molto interessante per me, perché di solito io Immagino che una sola dichiarazione di ritorno dovrebbe essere tutto ciò che serve.

in ogni modo, di nuovo al mio esempio e quello che la mia difficoltà è davvero, se si vede il codice all'interno del common function, u'll vedere il codice qui sotto:

res = res.filter(function (el) { 
       return a[i].filter(function (el2) { 
        return el2.tagId === el.tagId 
       }).length 
      }) 

che davvero non riesco a capire le dichiarazioni doppio ritorno . quello che ho capito è, return el2.tagId === el.tagId restituisce vero o falso e tornare

a[i].filter(function (el2) { 
         return el2.tagId === el.tagId 
        }).length 

restituisce la lunghezza, e penso che dovrebbe essere un intero, ma che cosa è l'ordine di esecuzione ritorno ?? chi è return el2.tagId === el.tagId tornando a ?? .

Sono sempre perplesso quando vedo la dichiarazione di doppio reso, qualcuno può spiegarmi questo per favore?

jsfiddle here.

MODIFICA :: prova ad essere un po 'elaborato nella tua risposta.

Grazie.

Alex-Z.

risposta

3

Questi ritorni "double" sono nidificati all'interno di funzioni anonime; non stanno tornando dallo stesso contesto.

lavoro esterno:

return el2.tagId === el.tagId 

restituisce un valore booleano da una funzione anonima all'interno del metodo di a[i]filter():

a[i].filter(function (el2) { 
    return el2.tagId === el.tagId 
}) 

La lunghezza del risultato di tale espressione viene restituita entro una funzione anonima all'interno del metodo filter() di res:

res = res.filter(function (el) { 
    return a[i].filter(function (el2) { 
    return el2.tagId === el.tagId 
    }).length 
}) 

Nota: la proprietà length del risultato viene convertita in un valore booleano entro il filter().

filter() è un metodo del prototipo Array, si costruisce un nuovo array composto da elementi per i quali la funzione anonima fornito restituisce vero (vedi MDN: Array.prototype.filter)

+0

!! scusa per essere un dolore nel posto sbagliato, ho qualche altra domanda, puoi spiegare l'intenzione degli autori di aggiungere il '.length' alla fine della prima dichiarazione di ritorno ?? –

+0

se tu fossi il compilatore JS, come interpreteresti 'res = res.filter (function (el) { return a [i] .filter (function (el2) { return el2.tagId === el.tagId }). length) }), come gestiresti il ​​codice, a che punto si verificherà la coercizione? e cosa vorresti eventualmente tornare a ris. –

+0

Il mio obiettivo era quello di spiegare questo, decostruendo l'espressione. Hai letto i documenti su 'array.filter()'? C'è una parte particolare della valutazione che non è chiara? – joemfb

2

Javascript segue il paradigma funzionale.Pensa alle funzioni come a diversi corpi di codice. Ad esempio, i due sotto sono equivalenti.

var sum = 0; 
[1,2,3].filter(function(el) { 
    return el > 2 ? true : false; 
}); 

è lo stesso di

var moreThan2 = function(el) { 
    return el > 2 ? true : false; 
} 

[1,2,3].filter(moreThan2); 

Javascript utilizza le funzioni per creare pezzi consolidati della logica. In molti codici, gli sviluppatori javascript utilizzano funzioni anonime che non vengono assegnate a una variabile.

modifiche

function common(/*…*/) { 
    var a = arguments, 

     filterListForTagsWithMoreThanOneMatchingElement = function(el) { 
      function findTagsWithSameTag(el2) { 
       return el2.tagId === el.tagId; 
      } 
      return a[0].filter(findTagsWithSameTag).length; 
     }, 

    res = a[0] 
    for (var i = 1; i < a.length; i++) { 
     res = res.filter(filterListForTagsWithMoreThanOneMatchingElement); 
    } 
    return res 
} 

Una cosa da notare circa il codice è che la funzione filtro ha una funzione interna che si basa sulla chiusura. La chiusura è l'ambito creato dalla nuova funzione.

Sembra che tu sia curioso dell'aspetto funzionale di javascript. Vorrei raccomandare un libro chiamato eloquent javascript. A differenza di molti libri javascript, cerca di concentrarsi maggiormente sul lato funzionale di javascript. Entra più in profondità di quanto possa in questa domanda.

+0

puoi modificare il mio esempio per spiegare, usando le funzioni anonime VS usando le variabili? molto interessantePoint btw. Grazie . –

+0

grazie, andrà anche se la risposta, grazie per la raccomandazione anche. :) –

Problemi correlati