なぜ場所を渡すことはできません.引数として再ロードする

名前を付けましょうblockUser このように見える

const blockUser = (afterBlock = window.location.reload) => {
  // Some code to block the user
  afterBlock()
}

この機能についての興味深いことはafterBlock デフォルトはwindow.location.reload . ユーザーがブロックされた後に、基本的にページを再読み込みします.しかし、必ずしもでなく.したがって、引数.
私たちのかなりの機能を使用します

blockUser()

おむつ

Firefoxは私たちにより説明的なエラーを与えます.

なぜ、これは起こりますか？

location.reload 必要ですthis はlocation . JavaScript関数を使用している場合this は関数が呼び出されたスコープにバインドされます.
我々が呼ぶならばwindow.location.reload() 直接、その後、Reload関数はLocationオブジェクトを通して呼び出されます.しかし、私たちが行うと言うことができます:

const test = window.location.reload
test()

我々はまだ同じエラーを得るでしょう.
何が起こっているかを見るために、我々自身の再ロード機能をつくろうとしましょう.

const fakeWindow = { location: { reload: function() { console.log(this) } } }
fakeWindow.location.reload()

// Re-assigning
let test = fakeWindow.location.reload
test()

おっとthis reload関数を変数に代入するときには、もはや同じではありません.Firefoxのエラーを覚えている場合、reload関数はLocation . 変数に代入すると、Window .

どうやってそれを修正できますか？

修正プログラムはかなり簡単です、あなただけの再割り当ての周りの機能をラップすることができます.

const blockUser = (afterBlock = () => window.location.reload()) => {
  // Some code to block the user
  afterBlock()
}
const test = () => window.location.reload()

今すぐ動作!😄

ボーナス

我々が我々を定義するならば、何が起こるかについて推測することができますfakeWindow オブジェクトは少し異なる?

const fakeWindow = { location: { reload: () => { console.log(this) } } }
fakeWindow.location.reload()

あなたは、実際のプロジェクトで、この問題に遭遇したことがありますか?コメントであなたの考えや経験をドロップします.ボーナスセクションで質問に答えるのを忘れないでください