Javascriptのメニュー再帰関数のバグ

//現在jsfiddle http://jsfiddle.net/0ht35rpb/45/Javascriptのメニュー再帰関数のバグ

私はJSONのナビゲーションツリーをループにしようとしています - 人は、特定のページに移動するとき、それはその代替言語のカウンターパートを見つけるようにします。

// JSON

{ 
    "langs" : [ 
     { 
      "lang" : "de", 
      "lines" : { 
       "menu" : [ 
        { 
         "title" : "Anleitung", 
         "link"  : "/de/anleitung" 
        }, 
        { 
         "title" : "Funktionen", 
         "link"  : "/de/funktionen" 
        }, 
        { 
         "title" : "Dienstleistungen", 
         "link"  : "/de/dienstleistungen", 
         "children" : [ 
          { 
           "title" : "Geistiges Eigentum", 
           "link" : "/de/dienstleistungen/geistiges-eigentum" 
          }, 
          { 
           "title" : "Compliance", 
           "link" : "/de/dienstleistungen/compliance" 
          }, 
          { 
           "title" : "Investment- und Beteiligungsrecht", 
           "link" : "/de/dienstleistungen/beteiligungsrecht" 
          }, 
          { 
           "title" : "Mergers & Acquisitions", 
           "link" : "/de/dienstleistungen/mergers-and-acquisitions" 
          }, 
          { 
           "title" : "Immobilienrecht", 
           "link" : "/de/dienstleistungen/immobilienrecht" 
          }, 
          { 
           "title" : "Internet- und Datenschutzrecht", 
           "link" : "/de/dienstleistungen/internetrecht" 
          }, 
          { 
           "title" : "Gesellschaftsrecht", 
           "link" : "/de/dienstleistungen/gesellschaftsrecht" 
          }, 
          { 
           "title" : "Handelsrecht", 
           "link" : "/de/dienstleistungen/handelsrecht" 
          }, 
          { 
           "title" : "Arbeitsrecht", 
           "link" : "/de/dienstleistungen/arbeitsrecht" 
          }, 
          { 
           "title" : "Bankrecht", 
           "link" : "/de/dienstleistungen/bankrecht" 
          }, 
          { 
           "title" : "Vertragsrecht", 
           "link" : "/de/dienstleistungen/vertragsrecht" 
          }, 
          { 
           "title" : "Wettbewerbsrecht", 
           "link" : "/de/dienstleistungen/wettbewerbsrecht" 
          } 
         ] 
        }, 
        { 
         "title" : "Beliebte Projekte", 
         "link"  : "/de/beliebte-projekte", 
         "children" : [ 
          { 
           "title"  : "Compliance", 
           "link"  : "/de/beliebte-projekte/compliance", 
           "children" : [ 
            { 
             "title"  : "Haftungsrisiken für Geschäftsführern", 
             "link" : "/de/beliebte-projekte/compliance/haftungsrisken-geschaeftsfuehrern" 
            }, 
            { 
             "title"  : "Compliance-Prüfung KMU", 
             "link" : "/de/beliebte-projekte/compliance/compliance-pruefung-kmu" 
            } 
           ] 
          } 
         ] 
        } 
       ], 
       "sign_in" : "Login" 
      } 
     }, 
     { 
      "lang" : "en", 
      "lines" : { 
       "menu" : [ 
        { 
         "title" : "How it works", 
         "link"  : "/en/how-it-works" 
        }, 
        { 
         "title" : "Features", 
         "link"  : "/en/features" 
        }, 
        { 
         "title" : "Services", 
         "link"  : "/en/services", 
         "children" : [ 
          { 
           "title" : "Intellectual property", 
           "link" : "/en/services/intellectual-property" 
          }, 
          { 
           "title" : "Compliance", 
           "link" : "/en/services/compliance" 
          }, 
          { 
           "title" : "Investment law", 
           "link" : "/en/services/investment-law" 
          }, 
          { 
           "title" : "Mergers & Acquisitions", 
           "link" : "/en/services/mergers-and-acquisitions" 
          }, 
          { 
           "title" : "Real estate law", 
           "link" : "/en/services/real-estate-law" 
          }, 
          { 
           "title" : "Internet law and data privacy", 
           "link" : "/en/services/internet-law" 
          }, 
          { 
           "title" : "Company law", 
           "link" : "/en/services/company-law" 
          }, 
          { 
           "title" : "Trade law", 
           "link" : "/en/services/trade-law" 
          }, 
          { 
           "title" : "Labour law", 
           "link" : "/en/services/labour-law" 
          }, 
          { 
           "title" : "Bank law", 
           "link" : "/en/services/bank-law" 
          }, 
          { 
           "title" : "Contract law", 
           "link" : "/en/services/contract-law" 
          }, 
          { 
           "title" : "Competition law", 
           "link" : "/en/services/competition-law" 
          } 
         ] 
        }, 
        { 
         "title" : "Popular Projects", 
         "link"  : "/en/popular-projects", 
         "children" : [ 
          { 
           "title"  : "Compliance", 
           "link"  : "/en/popular-projects/compliance", 
           "children" : [ 
            { 
             "title"  : "Haf eng", 
             "link" : "/en/popular-projects/compliance/haf-eng" 
            }, 
            { 
             "title"  : "Compliance eng", 
             "link" : "/en/popular-projects/compliance/compliance-eng" 
            } 
           ] 
          } 
         ] 
        } 
       ], 
       "sign_in" : "Sign in" 
      } 
     } 
    ] 
}

私のJS機能ように/ EN /サービスfetchFooterUrlsで

（）など CURRENTURLエン CURRENTLNGを想像

この場合

- ["/ ja/services"、 "/ de/dienstleistungen"] このコードが倒れている配列を返したい第3レベルのナビゲーションカウンタパーツを手に入れようとしている。 ["/ ja/popular-projects/compliance/compliance-eng"、 "/ de/beliebte-projekte/compliance/compliance-pruefung-kmu"]

getUrl (pairUrl, currentLng, enMenu, deMenu, obj) { 
    for (let k in obj) { 
     if (!obj.hasOwnProperty(k)) continue 
     if (obj[k].link === pairUrl) { 
     if (currentLng === 'de') { 
      return enMenu[k].link // get en link equivlant 
     } else { 
      return deMenu[k].link // get de link equivlant 
     } 
     } else { 
     if (obj[k].hasOwnProperty('children') && obj[k].children.length > 0) continue 
     this.getUrl(pairUrl, currentLng, enMenu[k].children, deMenu[k].children, obj[k].children) 
     } 
    } 
    } 
    // 
    getLanguagePair (currentLng, pairUrl) { 
    // 'find url in json tree' 
    var enMenu = linkTreeObject.langs[1].lines.menu 
    var deMenu = linkTreeObject.langs[0].lines.menu 

    let obj = {} 
    // find position in tree 
    if (currentLng === 'de') { 
     obj = deMenu 
    } else { 
     obj = enMenu 
    } 

    return this.getUrl(pairUrl, currentLng, enMenu, deMenu, obj) 
    } 

    fetchFooterUrls() { 
    let deUrl = '' 
    let enUrl = '' 

    if (CURRENTLNG === 'de') { 
     deUrl = CURRENTURL 
     enUrl = this.getLanguagePair(CURRENTLNG, this.props.location.pathname) 
    } else { 
     enUrl = CURRENTURL 
     deUrl = this.getLanguagePair(CURRENTLNG, this.props.location.pathname) 
    } 
    return [enUrl, deUrl] 
    }

//このスニペットを作成しようとしました - モデレータはここで解決しますか？ jsfiddleを更新しました

var linkTreeObject ={ 
    "langs" : [ 
     { 
      "lang" : "de", 
      "lines" : { 
       "menu" : [ 
        { 
         "title" : "Anleitung", 
         "link"  : "/de/anleitung" 
        }, 
        { 
         "title" : "Funktionen", 
         "link"  : "/de/funktionen" 
        }, 
        { 
         "title" : "Dienstleistungen", 
         "link"  : "/de/dienstleistungen", 
         "children" : [ 
          { 
           "title" : "Geistiges Eigentum", 
           "link" : "/de/dienstleistungen/geistiges-eigentum" 
          }, 
          { 
           "title" : "Compliance", 
           "link" : "/de/dienstleistungen/compliance" 
          }, 
          { 
           "title" : "Investment- und Beteiligungsrecht", 
           "link" : "/de/dienstleistungen/beteiligungsrecht" 
          }, 
          { 
           "title" : "Mergers & Acquisitions", 
           "link" : "/de/dienstleistungen/mergers-and-acquisitions" 
          }, 
          { 
           "title" : "Immobilienrecht", 
           "link" : "/de/dienstleistungen/immobilienrecht" 
          }, 
          { 
           "title" : "Internet- und Datenschutzrecht", 
           "link" : "/de/dienstleistungen/internetrecht" 
          }, 
          { 
           "title" : "Gesellschaftsrecht", 
           "link" : "/de/dienstleistungen/gesellschaftsrecht" 
          }, 
          { 
           "title" : "Handelsrecht", 
           "link" : "/de/dienstleistungen/handelsrecht" 
          }, 
          { 
           "title" : "Arbeitsrecht", 
           "link" : "/de/dienstleistungen/arbeitsrecht" 
          }, 
          { 
           "title" : "Bankrecht", 
           "link" : "/de/dienstleistungen/bankrecht" 
          }, 
          { 
           "title" : "Vertragsrecht", 
           "link" : "/de/dienstleistungen/vertragsrecht" 
          }, 
          { 
           "title" : "Wettbewerbsrecht", 
           "link" : "/de/dienstleistungen/wettbewerbsrecht" 
          } 
         ] 
        }, 
        { 
         "title" : "Beliebte Projekte", 
         "link"  : "/de/beliebte-projekte", 
         "children" : [ 
          { 
           "title"  : "Compliance", 
           "link"  : "/de/beliebte-projekte/compliance", 
           "children" : [ 
            { 
             "title"  : "Haftungsrisiken für Geschäftsführern", 
             "link" : "/de/beliebte-projekte/compliance/haftungsrisken-geschaeftsfuehrern" 
            }, 
            { 
             "title"  : "Compliance-Prüfung KMU", 
             "link" : "/de/beliebte-projekte/compliance/compliance-pruefung-kmu" 
            } 
           ] 
          } 
         ] 
        } 
       ], 
       "sign_in" : "Login" 
      } 
     }, 
     { 
      "lang" : "en", 
      "lines" : { 
       "menu" : [ 
        { 
         "title" : "How it works", 
         "link"  : "/en/how-it-works" 
        }, 
        { 
         "title" : "Features", 
         "link"  : "/en/features" 
        }, 
        { 
         "title" : "Services", 
         "link"  : "/en/services", 
         "children" : [ 
          { 
           "title" : "Intellectual property", 
           "link" : "/en/services/intellectual-property" 
          }, 
          { 
           "title" : "Compliance", 
           "link" : "/en/services/compliance" 
          }, 
          { 
           "title" : "Investment law", 
           "link" : "/en/services/investment-law" 
          }, 
          { 
           "title" : "Mergers & Acquisitions", 
           "link" : "/en/services/mergers-and-acquisitions" 
          }, 
          { 
           "title" : "Real estate law", 
           "link" : "/en/services/real-estate-law" 
          }, 
          { 
           "title" : "Internet law and data privacy", 
           "link" : "/en/services/internet-law" 
          }, 
          { 
           "title" : "Company law", 
           "link" : "/en/services/company-law" 
          }, 
          { 
           "title" : "Trade law", 
           "link" : "/en/services/trade-law" 
          }, 
          { 
           "title" : "Labour law", 
           "link" : "/en/services/labour-law" 
          }, 
          { 
           "title" : "Bank law", 
           "link" : "/en/services/bank-law" 
          }, 
          { 
           "title" : "Contract law", 
           "link" : "/en/services/contract-law" 
          }, 
          { 
           "title" : "Competition law", 
           "link" : "/en/services/competition-law" 
          } 
         ] 
        }, 
        { 
         "title" : "Popular Projects", 
         "link"  : "/en/popular-projects", 
         "children" : [ 
          { 
           "title"  : "Compliance", 
           "link"  : "/en/popular-projects/compliance", 
           "children" : [ 
            { 
             "title"  : "Haf eng", 
             "link" : "/en/popular-projects/compliance/haf-eng" 
            }, 
            { 
             "title"  : "Compliance eng", 
             "link" : "/en/popular-projects/compliance/compliance-eng" 
            } 
           ] 
          } 
         ] 
        } 
       ], 
       "sign_in" : "Sign in" 
      } 
     } 
    ] 
}; 



    getUrl (pairUrl, currentLng, enMenu, deMenu, obj) { 
    for (let k in obj) { 
     if (!obj.hasOwnProperty(k)) continue 
     if (obj[k].link === pairUrl) { 
     if (currentLng === 'de') { 
      return enMenu[k].link // get en link equivlant 
     } else { 
      return deMenu[k].link // get de link equivlant 
     } 
     } else { 
     if (obj[k].hasOwnProperty('children') && obj[k].children.length > 0) continue 
     this.getUrl(pairUrl, currentLng, enMenu[k].children, deMenu[k].children, obj[k].children) 
     } 
    } 
    } 
    // 
    getLanguagePair (currentLng, pairUrl) { 
    // 'find url in json tree' 
    var enMenu = linkTreeObject.langs[1].lines.menu 
    var deMenu = linkTreeObject.langs[0].lines.menu 

    let obj = {} 
    // find position in tree 
    if (currentLng === 'de') { 
     obj = deMenu 
    } else { 
     obj = enMenu 
    } 

    return this.getUrl(pairUrl, currentLng, enMenu, deMenu, obj) 
    } 

console.log(getLanguagePair("en", "/en/how-it-works"))

出典

2017-05-19 The Old County

駄目だったので、私はif (!obj.hasOwnProperty(k)) continueをremvoedあなたはES5ブラウザでES6コードを実行しようとしていますか？ –

http://jsfiddle.net/0ht35rpb/45/ –

@criz - http://jsfiddle.net/0ht35rpb/50/ –

。 else部分の再帰関数呼び出しに関連するエラーがありました。 http://jsfiddle.net/gaganshera/0ht35rpb/51/

はあなたの再帰関数に問題がある

if (!obj[k].hasOwnProperty('children') || obj[k].children.length <= 0) continue; 
var ret = getUrl(pairUrl, currentLng, enMenu[k].children, deMenu[k].children, obj[k].children); 
if(typeof ret != 'undefined') return ret;

var linkTreeObject = { 
 
    "langs": [{ 
 
    "lang": "de", 
 
    "lines": { 
 
     "menu": [{ 
 
     "title": "Anleitung", 
 
     "link": "/de/anleitung" 
 
     }, { 
 
     "title": "Funktionen", 
 
     "link": "/de/funktionen" 
 
     }, { 
 
     "title": "Dienstleistungen", 
 
     "link": "/de/dienstleistungen", 
 
     "children": [{ 
 
      "title": "Geistiges Eigentum", 
 
      "link": "/de/dienstleistungen/geistiges-eigentum" 
 
     }, { 
 
      "title": "Compliance", 
 
      "link": "/de/dienstleistungen/compliance" 
 
     }, { 
 
      "title": "Investment- und Beteiligungsrecht", 
 
      "link": "/de/dienstleistungen/beteiligungsrecht" 
 
     }, { 
 
      "title": "Mergers & Acquisitions", 
 
      "link": "/de/dienstleistungen/mergers-and-acquisitions" 
 
     }, { 
 
      "title": "Immobilienrecht", 
 
      "link": "/de/dienstleistungen/immobilienrecht" 
 
     }, { 
 
      "title": "Internet- und Datenschutzrecht", 
 
      "link": "/de/dienstleistungen/internetrecht" 
 
     }, { 
 
      "title": "Gesellschaftsrecht", 
 
      "link": "/de/dienstleistungen/gesellschaftsrecht" 
 
     }, { 
 
      "title": "Handelsrecht", 
 
      "link": "/de/dienstleistungen/handelsrecht" 
 
     }, { 
 
      "title": "Arbeitsrecht", 
 
      "link": "/de/dienstleistungen/arbeitsrecht" 
 
     }, { 
 
      "title": "Bankrecht", 
 
      "link": "/de/dienstleistungen/bankrecht" 
 
     }, { 
 
      "title": "Vertragsrecht", 
 
      "link": "/de/dienstleistungen/vertragsrecht" 
 
     }, { 
 
      "title": "Wettbewerbsrecht", 
 
      "link": "/de/dienstleistungen/wettbewerbsrecht" 
 
     }] 
 
     }, { 
 
     "title": "Beliebte Projekte", 
 
     "link": "/de/beliebte-projekte", 
 
     "children": [{ 
 
      "title": "Compliance", 
 
      "link": "/de/beliebte-projekte/compliance", 
 
      "children": [{ 
 
      "title": "Haftungsrisiken für Geschäftsführern", 
 
      "link": "/de/beliebte-projekte/compliance/haftungsrisken-geschaeftsfuehrern" 
 
      }, { 
 
      "title": "Compliance-Prüfung KMU", 
 
      "link": "/de/beliebte-projekte/compliance/compliance-pruefung-kmu" 
 
      }] 
 
     }] 
 
     }], 
 
     "sign_in": "Login" 
 
    } 
 
    }, { 
 
    "lang": "en", 
 
    "lines": { 
 
     "menu": [{ 
 
     "title": "How it works", 
 
     "link": "/en/how-it-works" 
 
     }, { 
 
     "title": "Features", 
 
     "link": "/en/features" 
 
     }, { 
 
     "title": "Services", 
 
     "link": "/en/services", 
 
     "children": [{ 
 
      "title": "Intellectual property", 
 
      "link": "/en/services/intellectual-property" 
 
     }, { 
 
      "title": "Compliance", 
 
      "link": "/en/services/compliance" 
 
     }, { 
 
      "title": "Investment law", 
 
      "link": "/en/services/investment-law" 
 
     }, { 
 
      "title": "Mergers & Acquisitions", 
 
      "link": "/en/services/mergers-and-acquisitions" 
 
     }, { 
 
      "title": "Real estate law", 
 
      "link": "/en/services/real-estate-law" 
 
     }, { 
 
      "title": "Internet law and data privacy", 
 
      "link": "/en/services/internet-law" 
 
     }, { 
 
      "title": "Company law", 
 
      "link": "/en/services/company-law" 
 
     }, { 
 
      "title": "Trade law", 
 
      "link": "/en/services/trade-law" 
 
     }, { 
 
      "title": "Labour law", 
 
      "link": "/en/services/labour-law" 
 
     }, { 
 
      "title": "Bank law", 
 
      "link": "/en/services/bank-law" 
 
     }, { 
 
      "title": "Contract law", 
 
      "link": "/en/services/contract-law" 
 
     }, { 
 
      "title": "Competition law", 
 
      "link": "/en/services/competition-law" 
 
     }] 
 
     }, { 
 
     "title": "Popular Projects", 
 
     "link": "/en/popular-projects", 
 
     "children": [{ 
 
      "title": "Compliance", 
 
      "link": "/en/popular-projects/compliance", 
 
      "children": [{ 
 
      "title": "Haf eng", 
 
      "link": "/en/popular-projects/compliance/haf-eng" 
 
      }, { 
 
      "title": "Compliance eng", 
 
      "link": "/en/popular-projects/compliance/compliance-eng" 
 
      }] 
 
     }] 
 
     }], 
 
     "sign_in": "Sign in" 
 
    } 
 
    }] 
 
}; 
 

 
function getUrl(pairUrl, currentLng, enMenu, deMenu, obj) { 
 
    for (let k in obj) { 
 
    if (!obj.hasOwnProperty(k)) continue 
 
    if (obj[k].link === pairUrl) { 
 
     if (currentLng === 'de') { 
 
     return enMenu[k].link // get en link equivlant 
 
     } else { 
 
     return deMenu[k].link // get de link equivlant 
 
     } 
 
    } else { 
 
     if (!obj[k].hasOwnProperty('children') || obj[k].children.length <= 0) continue; 
 
     var ret = getUrl(pairUrl, currentLng, enMenu[k].children, deMenu[k].children, obj[k].children); 
 
     if(typeof ret != 'undefined') return ret; 
 
    } 
 
    } 
 
} 
 

 

 
function getLanguagePair(currentLng, pairUrl) { 
 
    // 'find url in json tree' 
 
    var enMenu = linkTreeObject.langs[1].lines.menu 
 
    var deMenu = linkTreeObject.langs[0].lines.menu 
 

 
    let obj = {} 
 
    // find position in tree 
 
    if (currentLng === 'de') { 
 
    obj = deMenu 
 
    } else { 
 
    obj = enMenu 
 
    } 
 

 
    return getUrl(pairUrl, currentLng, enMenu, deMenu, obj) 
 
} 
 

 
//works 
 
console.log(getLanguagePair("en", "/en/how-it-works")) 
 
console.log(getLanguagePair("en", "/en/popular-projects")) 
 
console.log(getLanguagePair("de", "/de/anleitung")) 
 
console.log(getLanguagePair("de", "/de/beliebte-projekte")) 
 

 

 
//fail 
 
console.log(getLanguagePair("en", "/en/services/compliance")) 
 
console.log(getLanguagePair("en", "/en/popular-projects/compliance")) 
 
console.log(getLanguagePair("en", "/en/popular-projects/compliance/compliance-eng"))

出典

2017-05-19 11:01:14 gaganshera

それを修正しました - これは他の答えと同じですか？ –

私はこれを他の答えの前に書きました。私は同じことが分かりません – gaganshera

エラーが同じだったので、私も答えが似ていると確信しています:) – gaganshera

にそれを変更しました。 ファースト・ファンクション・コールのURLと一致しない場合は、再帰的にファンクションをコールしますが、を返すと、が返されません。この例では

function get_10_recursive(number){ 
    if(number>=10) return 10; 
    else return get_10_recursive(number++); 
}

数が10よりも小さい場合、それはリターンの文に遭遇するまで、関数が再帰的に呼び出され、この後、それはスタックをたどると、あなたに正しい結果を返します。 3行目のreturn文を削除すると、コードも実行されますが、最初の呼び出しの結果のみが返されます。これは未定義です。

返り値をforループ内に置くと、ループが中断され、次の文字列をチェックしないので、関数呼び出しの結果を次の場所に格納する必要があります。一時変数を返し、真実である場合にのみ返します（別名未定義）。

あなたのgetURL関数は次のように次のようになります。

function getUrl(pairUrl, currentLng, enMenu, deMenu, obj) { for (var k in obj) { if (obj[k].link === pairUrl) { if (currentLng === 'de') { return enMenu[k].link; // get en link equivlant } else { return deMenu[k].link; // get de link equivlant } } else { if (obj[k].hasOwnProperty('children')){ var tmp = getUrl(pairUrl, currentLng, enMenu[k].children, deMenu[k].children, obj[k].children); if(tmp) return tmp; // check if it found the match successfully } } } }

PS：それは

出典

2017-05-19 11:04:10

これは他の答えと同じです - 他の回答は私の問題を解決しました –

ありがとうございます - 私のベーコンを保存しました –

はいです。おそらく私たちは同時にそれを書きました –

Javascriptのメニュー再帰関数のバグ

答えて

関連する問題