if I print whole array it works, but if i try to output its first index or any index, there no output or error sometimes

Question

im reading a txt file from reader object onload and it reads fine but i want to save specific results in an array to later traverse on but it doesn't work with array index given like arr[0], here is my code;

function loadData(item) {
    let finalString = new Array();
    let reader = new FileReader();
    var header_read = false, status_index = 0;
    reader.onload = function (progressEvent) {
        var lines = this.result.split("\n");
        for (var line = 0; line < lines.length - 1; line++) {
            var tmpArray = lines[line].split("\t");
            if(line === 0){
                const isStatus = (element) => element.toLowerCase() === 'status';
                var cur_index = tmpArray.findIndex(isStatus); 
            }else{
                finalString.push(tmpArray[cur_index]);
            }
        }
    };
    reader.readAsText(item);
    for(let try1 in finalString){
        console.log(finalString[try1]);
    }
}

I've tried many things all around the internet but nothing seems so work for me

You are not handling the fact that reading is _async_ correctly here. By the time you try to loop over the contents of finalString there at the end, that array has not been populated with anything yet. — CBroe, Nov 30 '22 at 14:17
[console.log() shows the changed value of a variable before the value actually changes](https://stackoverflow.com/q/11284663) — VLAZ, Nov 30 '22 at 14:19

Salketer · Answer 1 · 2022-11-30T14:41:29.700

0

finalString is an array, you are using the for-in construct which is used for objects... You better use for-of.

let finalString = new Array();
function loadData(item) {
    let reader = new FileReader();
    var header_read = false, status_index = 0;
    reader.onload = function (progressEvent) {
        var lines = this.result.split("\n");
        for (var line = 0; line < lines.length - 1; line++) {
            var tmpArray = lines[line].split("\t");
            if(line === 0){
                const isStatus = (element) => element.toLowerCase() === 'status';
                var cur_index = tmpArray.findIndex(isStatus); 
            }else{
                finalString.push(tmpArray[cur_index]);
            }
        }
        for(let str of finalString){
            console.log(str);
        }
    };
    reader.readAsText(item);
}
console.log(finalString); // EMPTY
setTimeout(()=>{
    console.log(finalString); // Waited 2 seconds, should be OK.
},2000);

As @adiga pointed out, you also need to make sure you log the variable from the onload function since before that, the variable will not contain the result yet.

edited Nov 30 '22 at 14:41

answered Nov 30 '22 at 14:16

Salketer

14,263
2
30
58

it only works for console.log(finalString), every other method ive tried but no output – Hamza-ally Nov 30 '22 at 14:20
@Hamza-ally This answer will not fix your issue. You need to do this looping side the `onload` handler. after the `for(var line = 0; ...) {}` block. – adiga Nov 30 '22 at 14:22
@adiga is right! I overlooked that part... The console.log is gonna be executed before the variable is incremented... I edited the answer. – Salketer Nov 30 '22 at 14:26
yes it work in the handler but is there any other way to make it work outside its scope – Hamza-ally Nov 30 '22 at 14:37
Yes, if you define the variable outside the scope. But even then, you'll need to console.log once the onload has ran... I've edited to show this. – Salketer Nov 30 '22 at 14:40
well onload works one up for suggestions – Hamza-ally Nov 30 '22 at 15:04

if I print whole array it works, but if i try to output its first index or any index, there no output or error sometimes

1 Answers1