Array different length in console.log at Javascript?

Question

Hellloo, it my first time find this in js i am trying to put every data that is in the file into an array. And when I checked, there was an oddity, namely the odd array length.

this my code

export function convertGISToGeojson(file) {
  if (file) {
    let geojson = [];

    var promise = new Promise(getBuffer(file));

    promise
      .then(function (data) {
        geojson = data;
        console.log(geojson);
      })
      .catch(function (err) {
        console.log("Error: ", err);
      });

    return geojson;
  } else {
    return null;
  }
}

function getBuffer(fileData) {
  return function (resolve) {
    var reader = new FileReader();
    var shapefile = require("shapefile");
    reader.readAsArrayBuffer(fileData);
    reader.onload = function () {
      let geojson = [];
      let result = reader.result;

      shapefile
        .open(result)
        .then((source) =>
          source.read().then(function log(result) {
            if (result.done) return;
            geojson.push(result.value);
            return source.read().then(log);
          })
        )
        .catch((error) => console.error(error.stack));

      resolve(geojson);
    };
  };
}

when i try to console.log(data) that variable, the result like this But, when i try to console.log(data[0]), the result is undefined

whats wrong with my code?

in which line you execute console.log(data) and in which line you execute console.log(data[0]) — Elias, Sep 02 '21 at 07:27
Does this answer your question? [Why does javascript object show different values in console in Chrome, Firefox, Safari?](https://stackoverflow.com/questions/8249136/why-does-javascript-object-show-different-values-in-console-in-chrome-firefox) — Reyno, Sep 02 '21 at 07:33
You already have an issue with your `convertGISToGeojson` function. You are returning before the promises resolves. `geojson` is possible empty at the point. — Terry, Sep 02 '21 at 07:49
@Terry i was trying to use async, await, and promises resolves... but data that i get is like the image that i post — Zenryo, Sep 02 '21 at 07:53

darklightcode · Accepted Answer · 2021-09-02T08:30:47.820

Your convertGISToGeojson and getBuffer functions doesn't do what you would expect, you're returning an empty array or null, you don't wait for the promise to resolve or resolve too early, use async/await. I wrapped both functions in the demo below:

function convertGISToGeojson(fileArrayBuffer) {

  return new Promise((resolve, reject) => {

    var reader = new FileReader();
    //var shapefile = require("shapefile"); // uncomment this
    reader.readAsArrayBuffer(new Blob([fileArrayBuffer], {
      type: "application/octet-stream"
    }))
    reader.onload = function(evt) {
      let result = reader.result;
      shapefile
        .open(result)
        .then((source) =>
          source.read().then(function log(result) {
            return source.read().then(i => resolve(i.value));
          })
        )
        .catch((error) => reject(error.stack));
    };
    reader.onerror = (event) => reject(reader.error);

  })

}


(async() => {

  let file = 'https://cdn.rawgit.com/mbostock/shapefile/master/test/points.shp';
  let fileBuffer = await fetch(file).then(res => res.arrayBuffer());

  convertGISToGeojson(fileBuffer)
    .then(info => console.log('info', info))
    .catch(err => console.log('err', err))

})()

<script src="https://unpkg.com/shapefile@0.6.6/dist/shapefile.js"></script>

when i check the return, it comes like this [[Prototype]]: Promise [[PromiseState]]: "pending" [[PromiseResult]]: undefined — Zenryo, Sep 02 '21 at 07:44
@Zenryo i have updated my answer with a working minimal example — darklightcode, Sep 02 '21 at 08:31
thanks for the answer, it made me delve deeper into async/await — Zenryo, Sep 02 '21 at 09:02

score -1 · Answer 2 · answered Sep 02 '21 at 07:35

-1

Try console.log(data[0]) inside

promise
  .then(function (data) {
    geojson = data;
    console.log(data[0])
    console.log(geojson);
  })

answered Sep 02 '21 at 07:35

iamlk

74
2

Array different length in console.log at Javascript?

2 Answers2