###質問
JavaScriptで
・ディレクトリ内のファイルを列挙し、配列化する再帰関数xがあり、
・その配列をログに表示する関数yがあります
これを逐次的に処理させたいのでpromiseなどを自学していますが、再帰処理が含まれる場合どうすればよいかわかりません。
###わからないところ
1.どの関数に、どうやってpromiseを使えばよいかわからない
2.そもそもpromiseがあまり理解できない
3.学習用に再帰のない関数でpromiseを使って試した時はできた。だが再帰処理になるとわからなくなる
3に関して、なぜ再帰だとわからないのか、というと、学習時はreturn new Promiseという形で、promiseをリターンしていたので、再帰の場合どう扱われるか、途端にわからなくなります
###該当コード
HTML
1<div id="dropzone"> 2 <button class="btn btn-primary btn-block" id="cover" data-toggle="collapse" data-target="#collapseSample1"> 3 ここにファイルを 4 <br> 5 ドロップしてください 6 </button> 7</div>
CSS
1#dropzone { 2 text-align: center; 3 width: 1000px; 4 height: 70px; 5 margin: 10px; 6 padding: 10px; 7 border-radius: 10px; 8 } 9 10#cover{ 11 position: absolute; 12 margin: 200px 400px; 13 width: 1000px; 14 height: 70px; 15 }
このコードは、ブラウザからドラッグ&ドロップでディレクトリを取得した時に動くコード
JavaScript
1document.getElementById("dropzone") 2.addEventListener("dragover", function (event) { 3 event.preventDefault(); 4}, false); 5 6document.getElementById("dropzone") 7.addEventListener("drop", function (event) { 8 let items = event.dataTransfer.items; 9 let results = []; 10 event.preventDefault(); 11 for (let i = 0; i < items.length; i++) { 12 let item = items[i].webkitGetAsEntry(); 13 scanFiles(item, results); 14 } 15 setTimeout(() => viewLog(results), 500); 16}
再帰関数x、この処理をし、results(再帰関数xにはtmpObjectで値が渡っている)にしっかり値が入った後に、関数yを実行したい
JavaScript
1function scanFiles(entry, tmpObject) { 2 switch (true) { 3 case (entry.isDirectory) : 4 let entryReader = entry.createReader(); 5 entryReader.readEntries(function (entries) { 6 for (let i = 0, len = entries.length; i < len; i++) 7 scanFiles(entries[i], tmpObject); 8 }); 9 break; 10 case (entry.isFile) : 11 tmpObject.push({"fileName": entry.name, "fullPath": entry.fullPath}); 12 break; 13 default : 14 break; 15 } 16}
関数y
JavaScript
1function viewLog(results) { 2 console.log(results); 3}
回答1件
あなたの回答
tips
プレビュー