throw vs throw new Error [duplicate] - javascript

I want to write a common error handler which will catch custom errors thrown on purpose at any instance of the code.
When I did throw new Error('sample') like in the following code
try {
throw new Error({'hehe':'haha'});
// throw new Error('hehe');
} catch(e) {
alert(e);
console.log(e);
}
Log shows in Firefox as Error: [object Object] and I couldn’t parse the object.
For the second throw the log shows as: Error: hehe
Whereas when I did
try {
throw ({'hehe':'haha'});
} catch(e) {
alert(e);
console.log(e);
}
the console showed as: Object { hehe="haha"} in which I was able to access the error properties.
What is the difference?
Is the difference as seen in the code? Like string will be just passed as string and object as objects but the syntax will be different?
I haven’t explored throwing error object… I had done only throwing strings.
Is there any other way than the above two mentioned methods?

The difference between 'throw new Error' and 'throw someObject' in javascript is that throw new Error wraps the error passed to it in the following format −
{ name: 'Error', message: 'String you pass in the constructor'
}
The throw someObject will throw the object as is and will not allow any further code execution from the try block, ie same as throw new Error.
Here is a good explanation about The Error object and throwing your own errors
The Error Object
Just what we can extract from it in an event of an error? The Error object in all browsers support the following two properties:
name: The name of the error, or more specifically, the name of the constructor function the error belongs to.
message: A description of the error, with this description varying depending on the browser.
Six possible values can be returned by the name property, which as mentioned correspond to the names of the error's constructors. They are:
Error Name Description
EvalError An error in the eval() function has occurred.
RangeError Out of range number value has occurred.
ReferenceError An illegal reference has occurred.
SyntaxError A syntax error within code inside the eval() function has occurred.
All other syntax errors are not caught by try/catch/finally, and will
trigger the default browser error message associated with the error.
To catch actual syntax errors, you may use the onerror event.
TypeError An error in the expected variable type has occurred.
URIError An error when encoding or decoding the URI has occurred
(ie: when calling encodeURI()).
Throwing your own errors (exceptions)
Instead of waiting for one of the 6 types of errors to occur before control is automatically transferred from the try block to the catch block, you can also explicitly throw your own exceptions to force that to happen on demand. This is great for creating your own definitions of what an error is and when control should be transferred to catch.

throw "I'm Evil"
throw will terminate the further execution & expose message string on catch the error.
try {
throw "I'm Evil"
console.log("You'll never reach to me", 123465)
} catch (e) {
console.log(e); // I'm Evil
}
Console after throw will never be reached cause of termination.
throw new Error("I'm Evil")
throw new Error exposes an error event with two params name & message. It also terminate further execution
try {
throw new Error("I'm Evil")
console.log("You'll never reach to me", 123465)
} catch (e) {
console.log(e.name, e.message); // Error I'm Evil
}
throw Error("I'm Evil")
And just for completeness, this works also, though is not technically the correct way to do it -
try {
throw Error("I'm Evil")
console.log("You'll never reach to me", 123465)
} catch (e) {
console.log(e.name, e.message); // Error I'm Evil
}
console.log(typeof(new Error("hello"))) // object
console.log(typeof(Error)) // function

The following article perhaps goes into some more detail as to which is a better choice; throw 'An error' or throw new Error('An error'):
http://www.nczonline.net/blog/2009/03/10/the-art-of-throwing-javascript-errors-part-2/
It suggests that the latter (new Error()) is more reliable, since browsers like Internet Explorer and Safari (unsure of versions) don't correctly report the message when using the former.
Doing so will cause an error to be thrown, but not all browsers respond the way you’d expect. Firefox, Opera, and Chrome each display an “uncaught exception” message and then include the message string. Safari and Internet Explorer simply throw an “uncaught exception” error and don’t provide the message string at all. Clearly, this is suboptimal from a debugging point of view.

TLDR: they are equivalent Error(x) === new Error(x).
// this:
const x = Error('I was created using a function call!');
​​​​// has the same functionality as this:
const y = new Error('I was constructed via the "new" keyword!');
source: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Error
throw and throw Error are functionally equivalent. But when you catch them and serialize them to console.log they are not serialized exactly the same way:
throw 'Parameter is not a number!';
throw new Error('Parameter is not a number!');
throw Error('Parameter is not a number!');
Console.log(e) of the above will produce 2 different results:
Parameter is not a number!
Error: Parameter is not a number!
Error: Parameter is not a number!

You first mention this code:
throw new Error('sample')
and then in your first example you write:
throw new Error({'hehe':'haha'})
The first Error object would actually be useful, because it is expecting a string value, in this case 'sample'. The second would not because you are trying to pass an object in, and it is expecting a string, and would not display a helpful error.
The error object would have the "message" property, which would be 'sample'.

The Error constructor is used to create an error object. Error objects are thrown when runtime errors occur. The Error object can also be used as a base object for user-defined exceptions.
User-defined Errors are thrown via the throw statement. program control will be passed to the first catch block in the call stack.
The difference between throwing an error with and without Error object:
throw {'hehe':'haha'};
In chrome devtools looks like this:
Chrome tells us that we have an uncaught error which just is a JS object. The object itself could have information regarding the error but we still don't know immediately where it came from. Not very useful when we are working on our code and debugging it.
throw new Error({'hehe':'haha'});
In chrome devtools looks like this:
An error thrown with the Error object gives us a stack trace when we expand it. This gives us valuable information where the error precisely came from which is often valuable information when debugging your code. Further note that the error says [object Object], this is because the Error constructor expects a message string as a first argument. When it receives a object it will coerce it into a string.

you can throw as object
throw ({message: 'This Failed'})
then for example in your try/catch
try {
//
} catch(e) {
console.log(e); //{message: 'This Failed'}
console.log(e.message); //This Failed
}
or just throw a string error
throw ('Your error')
try {
//
} catch(e) {
console.log(e); //Your error
}
throw new Error //only accept a string

TLDR
throw new Error('problem') captures a number of properties of the place where the error happened.
throw 'problem' does not
new Error('message') captures the execution stack + others
Using an Error object allows you to capture the execution stack at the point where you throw the error. So when the error gets passed up the error handling tree, so does this stack snapshot.
So inserting throw "test error" somewhere in my codebase results in:
Whereas throw new Error('test error') results in:
You can see that the native Error object captures the stack at the point I throw the error and makes it available to whatever captures the error. That makes it easier for me to trace the problem when I'm debugging it.
In addition to that it also captures properties such as fileName, lineNumber and columnNumber.
If you use the stack trace it's there for exception trackers to log for you
In this case the stack is being printed into the browser console but if you're using Javascript error logging tools like Appsignal or Bugsnag then that stack will also be available in them too. If you inspect the error object you can access the stack snapshot directly:
err = new Error('test')
err.stack
The heuristic I use for deciding which format to use
When I don't plan to catch the exception I use new Error('problem')
When I'm throwing an error because something unexpected or out-of-bounds has happened in the application, let's say the local datastore is corrupted, I might be in a situation where I don't want to handle it, but I do want to flag it. In this case I'll use the Error object so I have that stack snapshot.
By using throw new Error('Datastore is corrupted') it's easier to trace my way back to what's happened.
When I plan to catch the exception I use throw 'problem'
Edit - on re-reading this I think the next part needs some caution. It's generally a good idea to be very specific about which error you choose to catch otherwise you can end up catching things that you really wanted to bubble all the way up. In general it's probably better to create a specific error type and catch that specific error (or message string). This allows errors you didn't anticipate to bubble up to the surface."
If the error is an expected error that I plan to catch and handle then I'm not going to get much use out of the stack snapshot.
So, let's say I use an http service and it returns a 500 HTTP code. I may treat this as an error which I throw "responseCode=500" and then subsequently catch and handle.

React behavior
Apart from the rest of the answers, I would like to show one difference in React.
If I throw a new Error() and I am in development mode, I will get an error screen and a console log. If I throw a string literal, I will only see it in the console and possibly miss it, if I am not watching the console log.
Example
Throwing an error logs into the console and shows an error screen while in development mode (the screen won't be visible in production).
throw new Error("The application could not authenticate.");
Whereas the following code only logs into the console:
throw "The application could not authenticate.";

The Error class includes debugging information (as properties of its instances), such as the error's call stack. JS interpreters know how to serialise those properties into an informative error message string, and they can also be consumed by debugging software - such as browser dev tools - to construct a more informative GUI representation of the error. This is why it's generally more useful to throw an instance of the Error class rather than simply throwing, for example, a string describing the error, or a number representing an error code.
Using custom errors
It's particularly useful to make your own subclasses of Error, which allow you to uniquely identify different types of error with a descriptive name and machine-readable...
clues for debugging,
information for better user-facing error messages, or
information to help recover from the error.
Then, when you're handling errors, you can use the nice and clean instanceof operator to check what kind of error occurred. e.g.:
class ShoesTooBig extends Error {}
class DangerousWaterCurrent extends Error {
constructor(waterSpeed){
super(`These waters are moving at ${waterSpeed} metres per second - too fast to cross!`) // Provide a `message` argument to the Error() constructor
this.waterSpeed = waterSpeed // This passes some context about why/how the error occurred back to whichever function is going to catch & handle it
}
}
// ...later...
try {
swimAcrossRiver(footwear, river)
} catch (thrownValue) {
if (thrownValue instanceof DangerousWaterCurrent) {
constructDam(river, thrownValue.waterSpeed)
} else {
throw thrownValue // "Re-throw" the error back up the execution chain, for someone else to handle
}
}
new Error() vs Error()
There is a "convenient" shorthand way to make an instance of Error: by calling Error(message), instead of new Error(message), the way you'd make an instance of a normal class. This is a deliberate exception, inserted by the language designers, to the rule. There are similar shorthands for other in-language classes, like Number() and String(). They also let you call these classes with () as if they were functions, not classes. JS doesn't allow normal classes to do this, even though they're all actually functions under the syntactical sugar of "classes". Try in a REPL:
> class E extends Error {}
undefined
> Error(); 'a value'
"a value"
> E(); 'a value'
Uncaught TypeError: Class constructor E cannot be invoked without 'new'
at <anonymous>:2:1
Personally, I think this design decision was a mistake, as it adds more exceptions to the rules of JavaScript - which means more to learn for programmers, and more for language translators/interpreters to account for. Instead of C++/Java's new keyword, simply calling a class as if it were a function (as in Number("abc123")) should have the properties that the new keyword currently has: the class's constructor function should be executed, with this bound to the instance. The new keyword could then be discarded from the language. This is how Python's syntax works, and it's simpler, more readable, and more convenient.

This is quite old but hopefully, anyone searching this can still learn from this:
First and famous, in javascript, we have something called Primitive Wrapper; a primitive wrapper takes primitive data and represents it in an object format by simply using the "constructor pattern". Still yet, in primitive wrappers, you can decide to have your data returned as an object type or you can have it returned as its primitive type(in this situation, you are now given a go-ahead command for javascript to extract the primitive value and in this case, you don't use the new keyword).
In Summary:
throw "My error": this creates an Error object and returns the primitive data extracted from the constructor "this" object. And if you try checking the typeof in the catch block, it tells you its a primitive typeof "string"
throw new Error("My error"): this returns you an object where you can access the error value from the message property. What simply happens here is that the "new keyword" constructs a "this" object and assign "{name:"Error",message:"..."}" to it and returns it. And when you try to check the typeof from the catch block, you will see a typeof "object".
Note: in a situation where you explicitly pass in a custom object to the throw, it will behave as if you invoked the constructor using the new keyword and therefore, the catch block will return you the custom object and not the message property value. For example: throw {name:"RangeError",message:"range is out of scope",environment:"Happened in testing function"}.
In conclusion, use whatever suits you ones you know what you are doing. But for me if i don't need much data but rather just the error, then I go for Primitive returner.

throw something works with both object and strings.But it is less supported than the other method.throw new Error("") Will only work with strings and turns objects into useless [Object obj] in the catch block.

throw new Error() is good for throwing a specified error. But if you want to do custom error handling, it's better to use throw { example: 'error' } .
That is, if you want to know the specified error, use throw new Error("example string") , if you want to handle the error in custom, use throw.
function makeErrorResponse(err = {}, httpStatus, status, message, message) {
const error = new Error();
error.httpStatus = httpStatus;
error.status = status;
error.message = message;
error.err = err;
return error;
}
throw makeErrorResponse({}, 500, 500, 'server error');

Related

How to use `throw` properly in try...catch block when other unexpected errors might occur?

The title may not be the best.
Code sample:
a = 1;
try {
if (a == 1) {
throw ('My fake error.');
}
} catch (err) {
console.log(err.message);
}
Assume I have more complex code in the try block. If a statement in that try block throws an error I can get the text of the error by looking at err.message. But, if I throw an error myself I can only see the text if I look at err because err.message is undefined.
How do I catch both unexpected errors, and errors I throw in the same catch block without writing more complex code to see if err.message is null for instance? I would expect both to return a similar structure, but they do not.
A good approach to this sort of issue is to always throw Error objects, and not literals.
It is considered good practice to only throw the Error object itself or an object using the Error object as base objects for user-defined exceptions. The fundamental benefit of Error objects is that they automatically keep track of where they were built and originated.
If you throw a plain non-error value, that value will be the expression in the catch section - which will (probably) not have the .message (or .stack) property, and be less than useful as a result.
So, replace throw ('My fake error.'); with throw new Error('My fake error.'); - and then, in catch, doing console.log(err.message) may log either My fake error., or it may log whatever other unexpected error occurred, if the rest of the code around there is well structured enough to always throw Error objects. Just enabling and following that no-throw-literal ESLint rule referenced above would be sufficient.

How to properly catch and add information to errors

I want to add information to an Error object in typescript/javascript. I currently do it like this:
try {
// code that might throw code
} catch (e) {
throw new Error(`Error while processing file ${path}:\n${e}`);
}
But that removes the information from the previous error.
Java/PHP both have a previous parameter in exceptions so I can wrap the error and preserve/extend the original information but I can't seem to find an equivalent in JavaScript.
How would I do that?
So there is no standard way.
However, if your intention is just to add information to the exception message, without messing with the error itself, you can just extend the message property
try {
} catch (e) {
e.message = `File: ${path}\n${e.message}`;
throw e;
}
This will preserve the proper stack trace and will display like you expect in chrome or on the node console.
Here an example exception:
Error: File: 6ff6255b-45b5-4895-8d59-50fa60663cfc.json
JSON Schema: schemas/schema.json
- must NOT have additional properties
at JsonFs.validate (driver/json-fs.ts:60:19)
at JsonFs.readSource (driver/json-fs.ts:39:14)
at async JsonFs.readSourceFile (driver/abstract-fs.ts:82:30)
at async driver/abstract-fs.ts:46:34

What is the error contract for functions from "fs" in Node?

In my app, written in JavaScript for Node, I wan't to try to recover from file system errors. In order to do that I need to know what that error can be. The manual doesn't say much. So my question is:
What is the contract for the error object? What can that error object be?
Example:
readFile('file/path', function (error, data) {
if (error) throw error;
console.log(data);
});
All errors returned are inherited from the JavaScript Error Object (https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Error), and fall into two categories: JS errors and system errors.
Single operation APIs such as the readFile method in your example return either null, if there is no error, or an Error instance (https://nodejs.org/api/errors.html). Common system errors such as Permission Denied or No Such File can be returned, and an exhaustive list can be found here:
http://man7.org/linux/man-pages/man3/errno.3.html
There is plenty of documentation, you just need to be careful to catch the errors properly, especially when using async methods.
Errors are instances of the JS object and have properties. You can do something like:
if (e.code === 'EISDIR') {
console.log("Is not a directory!");
} else {
throw e;
}
Check out the docs here for the Node Error object.
Error
Typically it'll have a message and stack property. The message property is a detailed message about the error that was thrown. stack is the stack trace at the point when the error was thrown.
Some developers also put custom properties to add more details about the error. Hope this helps.

Inner Errors (exceptions) in JavaScript

Is there a preferred way to include inner exceptions when throwing exceptions in JavaScript?
I'm relatively new to JavaScript coming from a C# background. In C#, you can do the following:
try
{
// Do stuff
}
catch (Exception ex)
{
throw new Exception("This is a more detailed message.", ex);
}
In the samples I've seen in JavaScript, I haven't been able to find how to catch an exception, add a new message, and re-throw the new exception while still passing the original exception.
You can throw any object you want:
try {
var x = 1/0;
}
catch (e) {
throw new MyException("There is no joy in Mudville", e);
}
function MyException(text, internal_exception) {
this.text = text;
this.internal_exception = internal_exception;
}
Then an error will be thrown of type MyException with properties text and internal_exception.
An inner error may be available in the Error.cause property. You may provide one via the options parameter of the Error constructor. Example:
try {
divide(dividend, divisor);
} catch (err) {
throw new Error(`Devision by ${divisor} failed. See cause for details.`, { cause: err });
}
When such an error is thrown and printed, it will show the inner errors recursivly, just as you'd expect. Running throw new Error("Outer", { cause: new Error("Inner") }); in ts-node REPL produces:
Uncaught Error: Outer
at <repl>.ts:1:7
at Script.runInThisContext (node:vm:129:12)
... 7 lines matching cause stack trace ...
at bound (node:domain:433:15) {
[cause]: Error: Inner
at <repl>.ts:1:35
at Script.runInThisContext (node:vm:129:12)
at runInContext (/usr/local/lib/node_modules/ts-node/src/repl.ts:665:19)
at Object.execCommand (/usr/local/lib/node_modules/ts-node/src/repl.ts:631:28)
at /usr/local/lib/node_modules/ts-node/src/repl.ts:653:47
at Array.reduce (<anonymous>)
at appendCompileAndEvalInput (/usr/local/lib/node_modules/ts-node/src/repl.ts:653:23)
at evalCodeInternal (/usr/local/lib/node_modules/ts-node/src/repl.ts:221:12)
at REPLServer.nodeEval (/usr/local/lib/node_modules/ts-node/src/repl.ts:243:26)
at bound (node:domain:433:15)
Note that it's only a convention to put the inner error inside cause (but a strong one, as seen from ts-node truncating the outer stack trace due to 7 lines matching cause stack trace). So anything may be inside the cause property, so check it before you consume it! MDN gives an example of putting additional data after the example of using it for an inner error:
https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Error/cause

javascript pass

Is there something along the lines of python 'pass' in javascript?
I want to do the javascript equivalent of:
try:
# Something that throws exception
catch:
pass
pass is a no-op in Python. You need it for empty blocks because
try:
# Something that throws exception
catch:
# continue other stuff
is a syntax error. In JavaScript you can just use an empty catch block.
try {
// Something that throws exception
}
catch (e) {}
There is, and here it is:
That's right, nothing at all:
try {
somethingThatThrowsAnException();
} catch (e) {
}
I want to do the javascript equivalent of:
try:
# Something that throws exception
catch:
pass
Python doesn't have try/catch. It has try/except. So replacing catch with except, we would have this:
try {
// throw any exception
} catch(err) {}
The empty code block after the catch is equivalent to Python's pass.
Best Practices
However, one might interpret this question a little differently. Suppose you want to adopt the same semantics as a Python try/except block. Python's exception handling is a little more nuanced, and lets you specify what errors to catch.
In fact, it is considered a best practice to only catch specific error types.
So a best practice version for Python would be, since you want to only catch exceptions you are prepared to handle, and avoid hiding bugs:
try:
raise TypeError
except TypeError as err:
pass
You should probably subclass the appropriate error type, standard Javascript doesn't have a very rich exception hierarchy. I chose TypeError because it has the same spelling and similar semantics to Python's TypeError.
To follow the same semantics for this in Javascript, we first have to catch all errors, and so we need control flow that adjusts for that. So we need to determine if the error is not the type of error we want to pass with an if condition. The lack of else control flow is what silences the TypeError. And with this code, in theory, all other types of errors should bubble up to the surface and be fixed, or at least be identified for additional error handling:
try { // try:
throw TypeError() // raise ValueError
} catch(err) { // # this code block same behavior as
if (!(err instanceof TypeError)) { // except ValueError as err:
throw err // pass
}
}
Comments welcome!

Categories