JavaScript スコープ外へのデータの受け渡し

Question

addEventListenerを設定した場合のスコープ外へのデータの受け渡しができず困っております。
内容としては
①2つの変数があり初期値はNULLである
②addEventListenerで特定の要素がクリックされた時に関数が呼ばれ、その関数内である結果を2つの変数に代入する処理を行う
③代入された2つの変数を別の処理に使用する
という流れなのですが②から③への2つの変数の受け渡しができません...

let resultList = null;
let resultData = null;

target.addEventListener("click", ()=>{
   sampleFunction(resultList, resultData);
//sampleFunctionの中である結果をresultListとresultDataに代入する処理を行う
});

sampleFunction(list, data){
//例
list = [1,2,3];
data = [4,5,6];
}

let sum1 = 0;
let sum2 = 0;
//sampleFunctionの結果が反映されたresultListを使用したい
resultList.forEach(list => {
  sum1 += list;
});
//sampleFunctionの結果が反映されたresultDataを使用したい
resultData.forEach(data => {
  sum2 += data;
});

Answer 1

スコープにあわせた変数の宣言をすればよいのでは？
またnullを配列におきかえるなら最初は空配列の方がよいでしょう

Comments

[yambejp]

<script>
window.addEventListener('DOMContentLoaded', ()=>{
let resultList = [];
let resultData = [];
document.querySelector('#hoge').addEventListener("click", ()=>{
sampleFunction();
});

function sampleFunction(){
resultList = [1,2,3];
resultData = [4,5,6];
}
document.querySelector('#fuga').addEventListener("click", ()=>{
let sum1 = 0;
let sum2 = 0;
resultList.forEach(list => {
sum1 += list;
});
resultData.forEach(data => {
sum2 += data;
});
console.log([sum1,sum2]);
});
});
</script>
<div id="hoge">hoge</div>
<div id="fuga">fuga</div>

[hiroki88]

ご回答頂きましてありがとうございます。
初心者なものですみませんがスコープにあわせた変数の宣言という部分をもう少し詳細に教えて頂いてもよろしいでしょうか？
またこちらのコードの場合引数に代入したい変数を渡さなくてもいいのでしょうか?

[yambejp]

その前に、動作的には上記でよいのでしょうか？
最初にfugaを押す→結果[0,0]
hogeを押すと更新され
もう一度fugaを押す→結果[6,15]

動作が違うなら解説しても無駄なので、ただしい動作を例示ください

[hiroki88]

動作は上記のもので大丈夫ですし、実現したいこともこちらで合っております

[yambejp]

了解です。
jsの場合、上位のスコープ（グローバルを含む）で宣言された変数は
下位のスコープで参照できるし、値を投入すれば変更も可能ということです。

window.addEventListenerのコールバック内で宣言された
resultList とresultDataは、同じスコープ内で宣言されたsampleFunction
関数から参照、書き換えされています。

[yambejp]

もちろん、変数の競合など起こしやすいつくりなので、各スコープごとに
きっちり変数は宣言したほうがよいですし、スコープに変数を持ち込むなら
引数で渡してください。
コールバックのように書式がガチガチの場合は、任意の変数名でわたしたり
戻したりは難しいです

[hiroki88]

ご丁寧な説明ありがとうございます。
対処の変数と関数を同じスコープに持ってくることで参照、書き換えを可能にしているんですね。
おっしゃる通り競合などバグが起きやすいかと思いますので使用は最小限にしたいと思います。
ありがとうございます。