JavaScriptで関数に呼び出されるパラメータは、参照ではなく値です.

なぜ彼は仕事ができますか?そして彼はどのように仕事ができますか?なぜ彼は仕事ができますか?

function getLogger(arg){
   function logger(){
     console.log(arg)
   }
    return logger
}

let fruit='raspberry'
const logFruit=getLogger(fruit)

logFruit() // 'raspberry'
fruit='peach'
logFruit()// 'raspberry'                peach             

まず、上のコードブロックの実行に何があったかを説明します.私はflutの変数を作って、彼に'rasberry'を与えました.その後、この関数に渡して、作成して戻ってきます.名前をloggerといいます.呼出されるとflutという変数の函数が印刷されます.この関数を初めて呼び出して、私達はコンソールが私達が期待している'rapberry'の値をプリントアウトするのを見ることができます.
しかし、私がflut変数に「peach」の値を再割り当てしてから、再度、logger関数を呼び出した時.しかし、コンソールのロゴから出たデータは私が割り当てたばかりの新しい値ではなく、以前に初めて与えられた値です.
この問題を解決できます.get Loggerという関数を再度呼び出して新しいloggerを得ることができます.

const LogFruit2=getLogger(fruit)
logFruit2()  // 'peach'

しかし、なぜ変数の値を変えて、新しいlogger関数を得てから、最新の値を出すことができますか?
理由はJavaScriptでパラメータ付きの関数を呼び出した時です.このパラメータはvalue転送として扱われます.参照ではありません.ここではどのように動作しているかをコードで簡単に説明します.

function getLogger(arg){
  function logger(){
    console.log(arg)
  }
  return logger
}

get Logger関数が呼び出されると、このログガーの関数が作成されます.彼は新しい関数を作成したとき、このすべてのアクセス可能な変数が閉じられた状態を形成するように見えます.このフラグ関数が存在する限り、彼は彼の親レベル関数または他のモジュールレベルの変数にアクセスするという意味です.
このため、どの変数のロゴ関数が作成されてからアクセスできますか?この例を見てみますと、flut、get Logger、arg、loggerにアクセスできます.これらの変数はコードがなぜこのように動作するのかに重要な役割を果たしています.彼らは同じ値ですが、argとflutが挙げられていることが分かります.
ただ、二つの変数は同じ値を与えられているので、同じ変数であるとは限りません.以下は簡単な例です.この概念について:

let a=1
let b=a
console.log(a,b) // 1,1
a=2
console.log(a,b) //2 1

変数bは変数aの値を指していますが、変数aを変えてみても、変数bのポインタの向きは変わりません.これは変数bをa自身に向けることができないからです.変数bの値を変数aに向けただけです.
私は変数がコンピュータのメモリ領域を指すポインティングマークと考える傾向があります.ですから、let a=1を書いたら、実は:こんにちは、JavaScriptエンジンは、この値を1として記憶するためのメモリを作りたいです.そして、メモリ位置に対応するポインタaを作成しました.しかし、let b=aを書くと、jsエンジンに相当します.今はbというポインタを作成して、aポインタと同じメモリ領域を指したいです.つまり、関数を呼び出すと、jsエンジンは関数のための新しい変数を作成します.上記の例では、get Loggerを呼び出して、Jsエンジンは基本的に次のように操作しました.

let arg = fruit

したがって、私たちが後でflutに対してpeachを再割り当てしたとき、彼らはargパラメータに対して全く異なる変数であるため、何の影響もありません.
制限の一つとしても機能の一つとしても、これは彼の働き方です.この二つの変数をリアルタイムで相互に更新したいなら、以下のようにすることができます.私たちは、ポインタを変更する代わりに、変数の位置を変更することができます.

let a={current:1}
let b=a
console.log(a.current,b.current) //1 1
a.current=2
console.log(a.current,b.current) //2 2

上記の例では、aに値を再割り当てするのではなく、変数aが指す値を変更します.また、ちょうど変数bは同じオブジェクトを指すので、彼らは一緒に更新します.したがって、このソリューションを利用して、logger関数のlogs値の問題を解決できます.

function getLastestLogger(argRef){
  function logger(){
    console.log(argRef)
  }
  return logger
}
const fruitRef={current:'raspberry'}
const latestLogger=getLastestLogger(fruitRef)

latestLogger()// 'raspberry'

fruitRef.current='peach'
latestLogger() //'peacch'

このRefのサフィックスは、単語の略語、つまり変数の値を参照するためのものであり、他の値を参照するためのものである(ただし、私たちの例では、currentはオブジェクトの属性にすぎない).
結論
これは利害関係の問題ですが、JavaScriptの仕様基準はより伝達値に傾いています.しかし、この解決方法はそれほど面倒ではありません.本当に必要がある時は(これは非常に稀です.可変性とダイナミック性でプログラムが理解しにくくなります.)
最後に書く
この文章は外国人と開発エンジニアとしての文章を翻訳します.原文の住所