Typeerror Cannot Read Property 'get' of Undefined Api.get
Resolving the JavaScript Promise Error "TypeError: Cannot Read 'And so' of Undefined"
Introduction
Working with JavaScript Promise comes with its own array of errors, and a pop i is
TypeError: Cannot read property 'then' of undefined.
In this guide, we will cover ii code examples containing a bugs that crusade this TypeError and then refactor the code to resolve the issue.
Case 1
Say yous accept the function getTaxAmount(price, taxRate) . It takes two arguments, cost and taxRate , calculates the amount of tax using the inputs, and is expected to return a Promise that resolves to the calculated tax corporeality.
Next, telephone call getTaxAmount() function with two arguments and log the returned value on the console.
1 const getTaxAmount = ( price , taxRate ) => { 2 Math . floor ( ( price * taxRate ) / 100 ) ; 3 } ; iv v getTaxAmount ( 100 , 12 ) . so ( ( taxAmount ) => console . log ( taxAmount ) ) ; js
If you run this buggy code on your browser panel or using Node CLI, you volition get this error:
1 TypeError: Cannot read property 'then' of undefined sh
Example ii
Hither'southward some other case. getGithubOrgs(url) is a function that takes a URL and uses Fetch API to get GitHub organization data for a given user(deekshasharma). fetch() makes a network asking to the destination URL and returns a Promise that resolves to a response object. The response is then parsed into a JSON. This role is expected to return a Promise that should resolve to JSON data.
The getGithubOrgs() function is then called with an statement containing a valid URL and logs the resulting JSON on the console.
1 function getGithubOrgs ( url ) { 2 fetch ( url ) . then ( ( response ) => response . json ( ) ) ; three } 4 5 getGithubOrgs ( 6 "https://api.github.com/users/deekshasharma/orgs" seven ) . and so ( ( jsonData ) => console . log ( jsonData ) ) ; js
When you run this code in the browser console, y'all will get an mistake:
1 TypeError: Cannot read property 'so' of undefined sh
What Causes This TypeError
TypeError - Cannot read property 'then' of undefined is thrown when the caller is expecting a Hope to be returned and instead receives undefined . Let's consider the above examples.
In Example 1, the getTaxAmount(toll, taxRate) function, when called, should have returned a Promise that resolves to a value of 12 . Currently this part just calculates the tax amount using the 2 inputs and does not return a value. Hence, the undefined value is returned.
In Example ii, the getGithubOrgs(url) function calls the Fetch API, which returns a Promise that resolves to a response object. This resulting Promise is received by the so() method, which parses the response to JSON using the json() method. Finally, so() returns a new Promise that resolves to JSON. But you may have noticed there is no return statement inside the getGithubOrgs(url) office, which means the resulting Hope from the then() method is never returned to the calling lawmaking.
How to Fix This Error
To resolve the issue in both code examples, you'll need to refactor the functions. Allow'south expect at them one by one.
Example ane
The office getTaxAmount() should exist refactored to the code below.
Hope.resolve() returns a resolved Hope with the value of the revenue enhancement amount calculated by the role. And then the calling code will ever receive a Hope as long as valid arguments were passed.
1 const getTaxAmount = ( toll , taxRate ) => { ii return Hope . resolve ( Math . floor ( ( price * taxRate ) / 100 ) ) ; iii } ; 4 v getTaxAmount ( 100 , 12 ) . then ( ( taxAmount ) => console . log ( taxAmount ) ) ; js
Run this code on your browser console or Node CLI, and you should go an ouput of 12 .
Example ii
The role getGithubOrgs(url) should exist refactored to include a return statement so that a Promise tin can exist returned to the caller.
1 office getGithubOrgs ( url ) { 2 return fetch ( url ) . then ( ( response ) => response . json ( ) ) ; 3 } 4 5 getGithubOrgs ( "https://api.github.com/users/deekshasharma/orgs" ) . then ( ( res ) => six panel . log ( res ) 7 ) ; js
Conclusion
Whenever you lot see this TypeError while working with JavaScript Hope, the first step is to audit the lawmaking that was expected to return a Promise . After all, y'all go this mistake when calling the then() method on a Promise . And the TypeError indicates you are calling then() on undefined , which is a hint that the Promise itself is undefined . The next pace is to get and debug the code to figure out why a Promise is not returned. We looked at ii dissimilar code examples to run across what tin can potentially cause this error and how to resolve it.
You tin read more nearly Promise.then() on MDN.
Source: https://www.pluralsight.com/guides/javascript-promise-typeerror:-cannot-read-then-of-undefined
0 Response to "Typeerror Cannot Read Property 'get' of Undefined Api.get"
Postar um comentário