有没有一种好的方法来确保在遍历使用对象的代码之前创建该对象?

时间:2019-06-25 20:47:33

标签: javascript ajax asynchronous fetch

我有一些代码使用data = pd.read_csv('hw_25000.csv', names = ['index', 'height_inches', 'weight_pounds'],header = 0 ) data.head(20) print(data[data.height_sm >= 170 ][data.height_sm <180 ].head(20)) sort = data[data.height_sm >= 170 ],[data.height_sm <180 ] data['sort'].head(20) #Выдает ошибку ValueError: Length of values does not match length of index 来捕获 .tiff 图像并将其转换为html5画布,以便使用 tiff.js 在浏览器中显示。 >(https://github.com/seikichi/tiff.js/tree/master)。几乎可以正常运行,但是,我注意到有时图像无法进入浏览器。

某些图像会出现,但有时其他图像不会出现,并在浏览器中显示以下错误消息:

fetch()

我需要找出是否有一种很好的方法来确保成功创建这些对象,并希望我能深入了解导致此行为的原因。

ReferenceError: Tiff is not defined

有时可能会加载所有图像,有时甚至不会加载。如果页面刷新足够的时间,可以保证看到某些图像无法加载。请注意,在我的实际项目中,我将实例化并调用13个对象上的class tiffImage { constructor() { this.tiffURL = 'url-to-image'; this.height; this.width; this.canvas; } async loadImage() { fetch(this.tiffURL) // retrieve tiff and convert it to an html5 canvas let response = await fetch(this.tiffURL); let buffer = await response.arrayBuffer(); let tiff = new Tiff({buffer: buffer}); // error points to this line this.canvas = tiff.toCanvas(); /* Parse some data from image and do DOM stuff */ } } // retrieve and display boards let someTiff1 = new tiffImage(); let someTiff2 = new tiffImage(); let someTiff3 = new tiffImage(); let someTiff4 = new tiffImage(); let someTiff5 = new tiffImage(); someTiff1.loadImage(); someTiff2.loadImage(); someTiff3.loadImage(); someTiff4.loadImage(); someTiff5.loadImage();

1 个答案:

答案 0 :(得分:1)

继续阅读Promises。许诺将使您能够等待异步操作完成后再进行操作。

loadImage() {
    return fetch(this.tiffURL)
        .then(response=>{
        // retrieve tiff and convert it to an html5 canvas
        let buffer = response.arrayBuffer();
        let tiff = new Tiff({buffer: buffer});  // error points to this line
        this.canvas = tiff.toCanvas();
        return this;

        /* Parse some data from image and do DOM stuff */
    }
}

Promise.all([someTiff1.loadImage(),someTiff2.loadImage()])
.then(results=>{
    console.log("My results", results)
})

请勿在您的代码中使用asyncawait。如果使用这些,则表示使用Promises错误。