javascriptでは同じ名前の関数が複数定義されても特にエラーなどは発生しない。
その場合は後に宣言した側の内容が利用される。
console.log( "first:" + f() ); // → first: f2 ●関数は巻き上げられるので、ここで呼んでも問題ない document.addEventListener("DOMContentLoaded", () => { console.log( "onload: " + f() ); // → onload: f2 }); function f() { return "f1"; } function f() { return "f2"; }
ただしそれはコードの後ろに書いた方『ではなく』、後に評価された方が利用されるという意味なので、以下のような場合はコードでは上に出てくるものが利用される。
console.log( "first:" + f() ); // → first: f2 document.addEventListener("DOMContentLoaded", () => { console.log( "onload: " + f() ); // → onload: f3 ●イベント実行時に、イベントハンドラ内のf()が評価されるのでf3になる function f() { return "f3"; } }); function f() { return "f1"; } function f() { return "f2"; }
動作は現時点のchrome,firefoxで確認したが、これが正式な仕様なのかブラウザ実装なのかは不明。