<h3>TryCatch 101</h3><p>TryCatch is very useful in JavaScript code to handle errors/exceptions. Without that, our code will die in the middle when there is an exception. For example,</p><pre><code class="language-javascript" id="HTfM7pcvn">let size = undefinedVariable.size;
console.log("The size is: ", size);</code></pre><p>When running this code, we will get the error:&nbsp;</p><blockquote><p>Uncaught ReferenceError: undefinedVariable is not defined</p></blockquote><p>And the console.log will not be executed. However, if we add TryCatch, then the error will be properly caught, and the rest code will continue running. For example:</p><pre><code class="language-javascript" id="YR-FCK3Dw">let size = 0;

try {
  size = undefinedVariable.size;
} catch (error) {
  console.log("Error caught: ", {error});
}

console.log("The size is: ", size);</code></pre><p>Now, we should see both “Error caught …” and “The size is 0” on your console.</p><figure class="image"><img src="https://images.unsplash.com/photo-1634937846642-18100efae95f?crop=entropy&amp;cs=tinysrgb&amp;fit=max&amp;fm=jpg&amp;ixid=MnwxNTQwMTB8MHwxfHJhbmRvbXx8fHx8fHx8fDE2MzU2MTE5NTA&amp;ixlib=rb-1.2.1&amp;q=80&amp;w=1080"><figcaption>Photo by <a target="_blank" rel="noopener noreferrer" href="https://unsplash.com/@blakewisz?utm_source=DNX&amp;utm_medium=referral">Blake Wisz</a> on <a target="_blank" rel="noopener noreferrer" href="https://unsplash.com/?utm_source=DNX&amp;utm_medium=referral">Unsplash</a></figcaption></figure><h3>TryCatch in Async/Await</h3><p>Using the same idea, we can use TryCatch for Async/Await, like below:</p><pre><code class="language-javascript" id="HdfwL6BMA">async function exportAllPages(){
	//load pages in the database, process, and export them into JSON files
}
async function run() {
    try {
        await exportAllPages();
    } catch (e) {
        console.error(e);
    } finally {
        sendMail('All pages have been exported, but there could be some errors');
    }
}</code></pre><p>When we execute the code above, <code>exportAllPages()</code> will run and load the pages from the database, process, and export into the JSON, and then after the process is done, &nbsp;it sends the notification via email.&nbsp;</p><p>Now, let's assume there is some exception when exporting all pages since we have TryCatch, so we should still receive the email when it's done, but we don't know if all the pages have been exported or not. To fix that, we can add some logic to our run() function, like below:</p><pre><code class="language-javascript" id="DwGqXvd7K">async function run() {
	const error = "";
    try {
        await exportAllPages();
    } catch (e) {
    	error += "exprotAllPages failed: " + e;
        console.error(e);
    } finally {
    	if(error){
        	sendMail('Exporting all pages is finished, but we got some error:" + error); );
   		}
   		else {
   			sendMail('All pages have been exported!');
   		}
    }
}</code></pre><p>If <code>exportAllPages()</code> is a simple process, TryCatch above is probably good enough to tell us which where the exception happened, but in most cases, this won't help too much. &nbsp;Also, if you have 1000 pages to export, and the exception occurs when in the middle, the rest of the pages would not be processed.</p><p>Furthermore, in the real world, the <code>exportAllPages() </code>could contain many nested Async/Await functions, so TryCatch could only catch the first exception bubbled up from the nested await functions. &nbsp;Ideally, we should add TryCatch to all inner Async/Await functions, and save all exception errors into the <a target="_blank" rel="noopener noreferrer" href="https://deniapps.com/blog/how-to-use-global-variable-in-es6-modules">Global variable,</a> and then include that to the<code> sendMail(),</code> so then we are able to which pages failed to export for what reasons, and make sure all rest pages are still exported.</p><p>So the export function could be like this:</p><pre><code class="language-javascript" id="15zghBfUG">// check https://deniapps.com/blog/how-to-use-global-variable-in-es6-modules
// to learn more about globalContext
import globalContext from "./globalContext";

async function exportAllPages(){
	//load pages in the database
	const pages = [];
	try {
		await dbContext('pages').select('id').where(...);
	}
	catch (e) {
		globalContext.error.concat(e);
	}
	const promises = pages.map((page) =&gt; exportCustomPage(page.id));
	return await Promise.all(promises);	
}</code></pre><p>And then in the nested Await function: <code>exportCustomPage()</code></p><pre><code class="language-javascript" id="Mth-HZqP9">import globalContext from "./globalContext";

async function exportCustomPages(pageID){
	//load pages in the database
	const pages = [];
	try {
		const pageData = await dbContext('pages').select('*').where({id: pageId});
		await saveDatatoJSON(pageData);
	}
	catch (e) {
		globalContext.error.concat("export page,", pageID, e);
	}
}</code></pre><p>So, if there is an issue to export JSON for a page, then the TryCatch will catch the error into the global variable, and keep the rest process running.</p><h3>In Summary</h3><p>Adding TryCatch at the top level of Await/Async may meet our need to prevent the code from interrupting in the middle, but in order for debugging the cause of the error, then we would need to add the TryCatch to the nested Await/Async functions.</p>

TryCatch is very useful in JavaScript code to handle errors/exceptions. Without that, our code will die in the middle when there is an exception. Adding TryCatch at the top level of Await/Async may meet our need to prevent the code from interrupting in the middle, but in order for debugging the cause of the error, we would need to add the TryCatch to the nested Await/Async functions.

All Posts In Await