Menu
I'm looking at some code for react native fetch blob https://github.com/joltup/react-native-fetch-blob and I see in their example to call window.Blob, etc..
Is Window a global variable like you would see in a browser web environment? Or does it represent the current viewable screen in some way? Is the below code example just replacing/overriding a global object?
const Blob = RNFetchBlob.polyfill.Blob;
const fs = RNFetchBlob.fs;
window.XMLHttpRequest = RNFetchBlob.polyfill.XMLHttpRequest;
window.Blob = Blob;
332
The window is the global object in the browser environment. Any property attached to the window object can be accessed from any script on the web page, including the script for the React app. Since window is a global object, the React code can also access its properties, as shown below.
React window works by only rendering part of a large data set (just enough to fill the viewport). This helps address some common performance bottlenecks: It reduces the amount of work (and time) required to render the initial view and to process updates.
One way to declare a global variable in React is to attach a new variable as the property of the window object. For example, create a window.name variable in the index. js file like this: import React from "react"; import ReactDOM from "react-dom"; import App from "./App"; window.name = "John"; const root = ReactDOM.
If you use var outside of a function, it belongs to the global scope. If you use var inside of a function, it belongs to that function. If you use var inside of a block, i.e. a for loop, the variable is still available outside of that block. var has a function scope, not a block scope.
React Native defines a few globals (all under global) that are polyfilled so certain libraries that were originally developed for the browser can be used without failing. Most of the polyfills for familiar browser APIs are empty. You can see them all in InitializeCore.js.
window though is not empty. It's set to global:
if (global.window === undefined) {
global.window = global;
}
So the next question is, what is Blob in global?
Blob is a property that is added to global using the polyfillGlobal function. If you're curious about how that works, you can look at the PolyfillFunctions.js file. Blob itself is defined in Blob.js.
polyfillGlobal('Blob', () => require('Blob'));
So now that we see what React Native is doing, we can loop back to your questions:
global that is set to equal global.window.XMLHttpRequest and window.Blob with react-native-fetch-blob's own implementation.
131
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
